小程序动态加载网络字体

wx.loadFontFace(Object object)

动态加载网络字体,文件地址需为下载类型。'2.10.0'起支持全局生效,需在 app.js 中调用。</p><p>注意:</p><ol><li>字体文件返回的 contet-type 参考 font,格式不正确时会解析失败。</li><li>字体链接必须是https(ios不支持http)</li><li>字体链接必须是同源下的,或开启了cors支持,小程序的域名是<code>servicewechat.com

  • 工具里提示 Faild to load font可以忽略
  • '2.10.0' 以前仅在调用页面生效。
  • 参数

    Object object

    属性类型默认值必填说明最低版本
    globalbooleanfalse是否全局生效2.10.0
    familystring定义的字体名称
    sourcestring字体资源的地址。建议格式为 TTF 和 WOFF,WOFF2 在低版本的iOS上会不兼容。
    descObject可选的字体描述符
    结构属性类型默认值必填说明
    stylestring'normal'字体样式,可选值为 normal / italic / oblique
    weightstring'normal'字体粗细,可选值为 normal / bold / 100 / 200../ 900
    variantstring'normal'设置小型大写字母的字体显示文本,可选值为 normal / small-caps / inherit
    scopesArray字体作用范围,可选值为 webview / native,默认 webview,设置 native 可在 Canvas 2D 下使用
    successfunction接口调用成功的回调函数
    failfunction接口调用失败的回调函数
    completefunction接口调用结束的回调函数(调用成功、失败都会执行)

    object.success 回调函数

    参数
    Object res
    属性类型说明
    statusstring加载字体结果

    object.fail 回调函数

    参数
    Object res
    属性类型说明
    statusstring加载字体结果

    object.complete 回调函数

    参数
    Object res
    属性类型说明
    statusstring加载字体结果

    示例代码

    wx.loadFontFace({
      family: 'Bitstream Vera Serif Bold',
      source: 'url("https://sungd.github.io/Pacifico.ttf")',
      success: console.log
    })


    分类小程序界面UI相关推荐:

    小程序显示消息提示框wx.showToast 小程序显示模态对话框 小程序显示 loading 提示框wx.showLoading 小程序底部弹窗wx.showActionSheet 小程序隐藏消息提示框wx.hideToast 小程序隐藏 loading 提示框wx.hideLoading 小程序返回对话框wx.enableAlertBeforeUnload 关闭小程序页面返回询问对话框wx.disableAlertBeforeUnload 小程序显示导航条加载动画wx.showNavigationBarLoading 小程序动态设置当前页面的标题wx.setNavigationBarTitle 小程序设置页面导航条颜色wx.setNavigationBarColor 小程序隐藏导航条加载动画wx.hideNavigationBarLoading 小程序隐藏返回首页按钮wx.hideHomeButton 小程序动态设置下拉背景字体、loading 图的样式wx.setBackgroundTextStyle 小程序动态设置窗口的背景色wx.setBackgroundColor 小程序tabBar右上角显示红点wx.showTabBarRedDot 小程序显示 tabBar wx.showTabBar 小程序动态设置 tabBar 的整体样式wx.setTabBarStyle 小程序动态设置 tabBar 某一项的内容wx.setTabBarItem 小程序tabBar右上角添加文本wx.setTabBarBadge 小程序移除 tabBar右上角的文本wx.removeTabBarBadge 小程序隐藏 tabBar的右上角的红点wx.hideTabBarRedDot 小程序隐藏 tabBar wx.hideTabBar 小程序动态加载网络字体 小程序停止当前页面下拉刷新wx.stopPullDownRefresh 小程序开始下拉刷新 小程序将页面滚动到目标位置wx.pageScrollTo 小程序增强 ScrollView 实例ScrollViewContext 小程序动态设置置顶栏文字内容wx.setTopBarText 小程序延迟执行wx.nextTick 小程序获取菜单按钮的布局位置wx.getMenuButtonBoundingClientRect 小程序设置窗口大小wx.setWindowSize 小程序监听窗口尺寸变化事件wx.onWindowResize 小程序取消监听窗口尺寸变化事件wx.offWindowResize