uniapp使用iconfont-阿里巴巴矢量图标库设置tabBar图标

1.iconfont图标库

在这里插入图片描述

2.找到想要的图标,可以直接搜索,我现在要找到适合首页,关于,还有列表的一些图标

在这里插入图片描述
找到之后添加入库(添加购物车)
在这里插入图片描述
在这里插入图片描述

打开购物车后选择添加项目,最好是根据实际情况,把项目需要的图标放在一个项目里面

在这里插入图片描述

刚刚选择好的图标添加到了新闻项目里面

在这里插入图片描述

uniapp的tabbar页面,有图标还有选择图标,设置不同的颜色

在这里插入图片描述

编辑好需要的图标,可以更改,完成之后选择保存为副本,也可以更改名称

![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/b8e85d345ba0431d8613230adda1f821.png

在这里插入图片描述

完成所有图标之后可以进行下载,如果是使用方法二则不需要下载别的颜色的图标,只需要下载一种就可以了

在这里插入图片描述

下载方式有两种,

可以选择png,这种方法就是直接图片放到static文件家里,在pages.json的tabbar里面进行引用就可以了

在这里插入图片描述

方法二,直接点击下载到本地,复制iconfont.ttf放在static里

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值