flutter引入阿里矢量图标库
·
纪念我第一次引入阿里矢量图标库
之前看了好多教程,觉得很麻烦就一直没有动手手,之前用vue,每次加图标就要去配置里面改东西,还是很麻烦的,flutter会更简单吗?不可能,连加个图片都要配置的框架你以为加icon不需要吗?
1.



下载到本地之后将下载的文件夹打开


将.ttf文件放入新建的icons文件,这是我的文件路径
找到你的配置文件的文件,就是配置图片文件的文件,与图片配置同一级别
fonts与assets同级别
fonts:
- family: MyIcons
fonts:
- asset: assets/icons/iconfont.ttf
不会写没关系,在上图flutter下面找,有注释的地方,文件自动生成好的示例
我就是直接用的注释,ctrl+‘/’可取消注释,这就是引用了
然后在文件中的引用
new IconButton(
icon:const Icon(IconData(0xe641, fontFamily: 'MyIcons')),
//tooltip: 'Add Alarm',
onPressed: () {
print('点击了搜索按钮');
}),
0xe641实在阿里矢量图中找到的,每个图标会对哦应一串字符
发现规律了吗?就是把 &# 换成 0 后面的字符串不变
鼠标移入之后就会出现复制代码
暂时每次想新加入图标都需要更新.ttf文件,引入图标嘛,都是一样的麻烦…欢迎大佬指正
更多推荐


所有评论(0)