- 微信小程序支持在QQ客户端使用
[图片] 最近看到消息说微信小程序可以在QQ客户端里打开了,我就测试了一下。 首先直接在QQ里搜索”微慕 会出现”微慕“和”微慕Plus”两个小程序, 微慕是专业版只在微信端上线了,右下角会显示一个微信小程序的小图标。 微慕Plus是增强版在QQ端上线,下角没有显示小图标。 经过测试发现QQ端的微信小程序有以下特点: 小程序功能和界面均与在微信中体验一致,可分享微信好友及跳转其他微信小程序 流量主广告位均可以显示和点击跳转登录需要跳转微信授权点击右上角可以分享到QQ好友和群、添加到QQ我的小程序、发送给微信好友及添加到微信我的小程序,没有分享朋友圈、企业微信及电脑端打开等功能目前支持打开的方式有三种第一种:发微信小程序码给QQ好友,好友长按扫描或者摄像头扫码打开第二种:QQ里搜索微信小程序名称,点击打开(如果你的小程序搜不到,可以分享你的小程序码给几位好友使用QQ扫码,就可以搜到了——网友moon-chaser分享)第三种:搜索打开后分享到QQ群或者QQ好友,在对话框里打开 QQ小程序团队开发进度缓慢,最近一次开发者工具的更新是2021.09.22 。几个小程序平台中 ,QQ小程序的开发工具是最不好用且问题最多,然后迭代最慢的。QQ小程序的开发社区也是很简陋,也不像微信开放社区那么活跃,所以我一度以为他们可能是不做了。目前看来很有可能,其实我觉得腾讯这样整合一下也挺好,腾讯系所有需要用到小程序的客户端直接调用微信小程序就可以了,开发者没有那么累,腾讯也可以裁掉一些部门。现在微信小程序已经支持微信、企业微信、QQ,你觉得后续还会支持哪些客户端呢? [视频]
2022-04-24 - 小程序中如何加载使用第三方字体
简述:使用开启CORS的woff字体格式(或ttf)的https资源地址,使用[代码]wx.loadFontFace[代码] API(css原生[代码]@font-face[代码]语法)加载使用。 ⚠️ 注意:字体商用需授权许可,目前免费可商用的大部分字体,可见参考索引5。以下示例使用的是开源字体:得意黑和钉钉进步体。 1. wx.loadFontFace使用wx.loadFontFace 加载字体,配合wxss和wxml使用,参见文档 & 官方示例 // -- wxss -- // .DingTalk-JinBuTi { // font-family: 'DingTalk-JinBuTi'; // } wx.loadFontFace({ family: 'DingTalk-JinBuTi', source: 'url("https://xxx/font/DingTalk-JinBuTi.woff")', //此处需替换为真实字体地址 success(res) { console.log(res.status) }, fail: function (res) { console.log(res.status) }, complete: function (res) { console.log(res.status) } }); 注意: 格式支持常见的基本所有类型(ttf、woff、woff2(web主流)、otf、sfnt),建议格式为 TTF 和 WOFF(推荐),WOFF2 在低版本的 iOS 上会不兼容。字体链接仅支持https链接字体链接访问需满足浏览器同源策略,字体文件资源设置CORS的[代码]Access-Control-Allow-Origin[代码]为小程序域名:[代码]servicewechat.com[代码]或者*才可以。经过测试,ios和小米手机对于未设置CORS的字体文件仍然可以正常加载,荣耀和vivo无法正常加载,需要设置正确的CORS即可正常加载在加载成功之后,会自动刷新字体显示不需要设置downloadFile合法域名及业务域名。扩展:一次加载,全局使用如下在app.js中加载添加全局参数(global: true),即可在任意页面中的font-family中使用该字体。 onLaunch() { wx.loadFontFace({ family: 'DingTalk-JinBuTi', global: true, source: 'url("https://xxx/font/DingTalk-JinBuTi.woff")', //此处需替换为真实字体地址 success(res) { console.log(res.status) }, fail: function (res) { console.log(res.status) }, complete: function (res) { console.log(res.status) } }); }, 2. @font-face同css加载字体的规则,见MDN文档, 注意:字体链接访问需满足浏览器同源策略。支持常见格式。 @font-face { font-family: "SmileySans-Oblique"; src: url("https://xxx/font/SmileySans-Oblique.woff"); //此处需替换为真实字体地址 } .SmileySans-Oblique { font-family: 'SmileySans-Oblique'; } 扩展:全局使用在app.wxss中引入字体即可全局使用。 @font-face { font-family: "SmileySans-Oblique"; src: url("https://xxx/font/SmileySans-Oblique.woff"); //此处需替换为真实字体地址 } .SmileySans-Oblique { font-family: 'SmileySans-Oblique'; } 3. face-font base64 因源码过大致小程序增加包体积,暂不考虑。英文字体可以考虑。参见此。 扩展:在canvas中使用小程序canvas渲染时需要字体加载完成,css方式字体加载完成不容易监听,小程序文档提到可使用wx.loadFontFaced的回调中渲染canvas。参考文档及代码示例。 另外wxml-to-canvas中不支持font-family属性,可参考链接4修改源码实现。 参考wx.loadFontFace(Object object) | 微信开放文档微信小程序使用自定义字体的三种方法 - 掘金loadFontFace 支持全局生效 | 微信开放社区wxml-to-canvas没有fontWeight的相关支持? | 微信开放社区光明正大用字体——2023年“不要钱”的字体集合!哔哩哔哩bilibili[图片]
2023-03-21