注意:此方法适合制作小点的字库,因为手动制作过程有点繁琐

准备工作:

网上下载字库

过程省略....

 

裁剪字库

 

1. 使用FontCreator工具裁剪(或者自定义)字库

2. 先通过https://transfonter.org/网站转换成ttf格式的字库格式。

微信小程序自定义(裁剪)“小字库”制作与使用

微信小程序自定义(裁剪)“小字库”制作与使用

 

3. 打开FontCreator软件,点击File >> Open选择刚才转换的simsun.ttf文件,然后打开它

裁剪字库

微信小程序自定义(裁剪)“小字库”制作与使用

4. 新建文件:File >> New

微信小程序自定义(裁剪)“小字库”制作与使用

5. 点击工具栏中“插入新字形”

微信小程序自定义(裁剪)“小字库”制作与使用

 

6. 从打开的宋体字库中复制一个字形到刚才新建的文件的“新字形”处:

复制

微信小程序自定义(裁剪)“小字库”制作与使用

拷贝

微信小程序自定义(裁剪)“小字库”制作与使用

 

7. 编辑单个字形的属性

微信小程序自定义(裁剪)“小字库”制作与使用

8. 设置字形编码值

微信小程序自定义(裁剪)“小字库”制作与使用

9. 根据字形表示的字符来设置,这里我选择的是大写,这个根据你要设置的字符来自行设置

微信小程序自定义(裁剪)“小字库”制作与使用

10. 重复以上步骤完成所有字形的编码值设置。最后在最前面设置一个空字形(据说是防止字库不被识别)

微信小程序自定义(裁剪)“小字库”制作与使用

 

11. 保存裁剪后的字库,并导出为ttf格式。

 

微信小程序自定义(裁剪)“小字库”制作与使用

 

12. 将生成的字库转换成base64格式

微信小程序自定义(裁剪)“小字库”制作与使用

导入到微信小程序目录中

 

1. 解压将刚才转换成base64的压缩包。

2. 在微信小程序目录中新建一个style目录,并在style文件夹下新建一个wxss文件,并将转换成base64的压缩包中的wxss文件中的内容全部复制到新建的wxss文件中

微信小程序自定义(裁剪)“小字库”制作与使用

微信小程序自定义(裁剪)“小字库”制作与使用

注意:新建的wxss文件中的css代码中font-family的值,这个后面其他wxss文件中设置字体时需要用到。这里的是“simsun”

 

3. 在需要使用字体的wxss文件的开头通过import语法来导入字库。然后就可以在wxss文件中使用了。注意路径

微信小程序自定义(裁剪)“小字库”制作与使用

使用自定义的字库,注意名称。

微信小程序自定义(裁剪)“小字库”制作与使用

4. 编译小程序,即可查到效果

微信小程序自定义(裁剪)“小字库”制作与使用

 

 

参考文档:

https://blog.csdn.net/xiaohui_brook/article/details/51909612

https://blog.csdn.net/qq_24985715/article/details/80857733

相关文章:

  • 2021-08-10
  • 2021-12-12
  • 2022-02-07
  • 2022-02-25
  • 2022-12-23
  • 2022-12-23
  • 2022-01-08
猜你喜欢
  • 2021-12-11
  • 2021-11-30
  • 2021-09-11
  • 2021-12-15
  • 2022-12-23
  • 2022-12-23
  • 2021-07-21
相关资源
相似解决方案