【鸿蒙Next】鸿蒙与flutter使用自定义iconfont的ttf字体库对比总结

ttf的iconfont库如何获取

1、自己创建

第一步、 iconfont-阿里巴巴矢量图标库 打开网址

第二步、搜索自己的需要的图标、并且加购到购物车

第三步、点击购物车，添加至项目

第四步、添加至项目或者新建项目再添加

第五步、下载至本地

就得到了ttf文件

2、设计同学提供ttf文件

如何引入到项目中 flutter fonts: - family: myIcon #指定一个字体名 fonts: - asset: fonts/iconfont.ttf 鸿蒙Next

1、在ets中新建目录，取名fonts，将刚才复制的文件 粘贴至fonts中。

如：

注意：只要ttf文件也可以的

2、在项目中注册自定义的字体

// 1.注册字体 font.registerFont({ familyName:'myFont', familySrc:'/fonts/iconfont.ttf' })

应用若需全局使用自定义字体，请在EntryAbility.ets文件的onWindowStageCreate生命周期中，通过windowStage.loadContent回调中注册。

使用iconfont自定义字体库 flutter

为了使用方便，我们定义一个MyIcons类，功能和Icons类一样：将字体文件中的所有图标都定义成静态变量：

class MyIcons{ // book 图标 static const IconData book = const IconData( 0xe614, fontFamily: 'myIcon', matchTextDirection: true ); // 微信图标 static const IconData wechat = const IconData( 0xec7d, fontFamily: 'myIcon', matchTextDirection: true ); }

 使用

Row( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ Icon(MyIcons.book,color: Colors.purple,), Icon(MyIcons.wechat,color: Colors.green,), ], )

鸿蒙Next Text('\ue67f')//引号里的'\u'+编号为官网图片的后四位 .fontFamily('myFont')//这句话必须加上，不然不显示 .fontSize(20)

参考：

  blog.csdn.net/adaedwa187545/article/details/143433707

.jianshu /p/5f305f105d89