web端使用图标很方便, 尤其吸管字体图标, 大小,颜色等都可以使用font相关css进行更改,
RN中刚开始感觉蛮麻烦的,这里引用下前端历险记中RN总结总的一些方法
1: 图标的Base64
-
将Iconfinder中图标的Base64编码值定义为变量，在使用地方的uri值指定为该变量。该网站上比较容易找到配套图标，就是点击和未点击配套的图标，但是不能改变图标颜色。
-
使用时: 在iconfinder图标网复制中的一些可用的图片的Base64字符串, 并在自己icon.js中赋值变量,
如下图:
icon目录下的 Icon.js
-
在需要的文件中引用Icon.js
引用Icon.js
- 在需要的文件中引用 (antd - Mobile组件TabBar)
-
antd - Mobile组件TabBar
-
使用FontAwesome，配置方式详见react-native-vector-icons。使用该图标可通过style指定图标样式，包括颜色，但要找配套的图标比较困难。注意FontAwesome中描述<i class="fa fa-user" aria-hidden="true"></i>
使用图标，这应该是移动Web的使用方式，在React Native中使用如下。import Icon from 'react-native-vector-icons/FontAwesome'; ...... <Icon name="user" size={20} style={styles.icon} />
网友评论