uniapp自定义图标
时间: 2023-08-28 18:08:12 浏览: 147
Uniapp支持自定义图标,可以使用以下两种方法:
1. 使用第三方图标库
可以使用第三方图标库,如阿里图标库、FontAwesome等,将图标下载到本地,然后在uniapp项目中使用。在使用时,需要在页面的json文件中引入图标库的css文件,并在页面中使用对应的class来显示图标。
2. 使用本地图标
可以将自己设计的图标保存在本地,然后在页面中使用。在使用时,需要在pages.json文件中配置自定义的图标路径,然后在页面中使用对应的路径和文件名来显示图标。
例如,在pages.json中配置:
```
"tabBar": {
"color": "#999",
"selectedColor": "#007aff",
"borderStyle": "white",
"backgroundColor": "#fafafa",
"list": [{
"pagePath": "pages/index/index",
"text": "首页",
"iconPath": "custom/tab_home.png",
"selectedIconPath": "custom/tab_home_selected.png"
}, {
"pagePath": "pages/mine/mine",
"text": "我的",
"iconPath": "custom/tab_mine.png",
"selectedIconPath": "custom/tab_mine_selected.png"
}]
}
```
然后在页面中使用:
```
<image src="../../custom/tab_home.png"></image>
```
阅读全文