您的位置:首页 > Web前端 > React

react native关于自定义字体图标android和IOS的处理

2017-12-12 00:00 411 查看
**```

icon处理:https://icomoon.io/app/#/select
主要是得到各种字体格式和section.json
具体步骤网址:   https://www.cnblogs.com/xiaojun-zxj/p/6293450.html 基于插件:react-native-vector-icons   既可以用这个库本身的,又可以用自定义的

1.先在android和ios正常运行,
在ios chartCode里面使用xxx.ttf时,执行react-native link,add到item里面
android下面app/////font  添加xxx.ttf,
在react-native-vector-icons 下面分别添加下面三个文件
2,处理icon,得到ttf库和section.json

3 根据section.json  在app里面得到对应的code值
componentDidMount() {
var allicon = {};
var data =Data.icons;
data.forEach((icon) => {
allicon[icon.properties.name]=icon.properties.code;
});
console.log(JSON.stringify(allicon))}

4在node_modules/react-native-vector-icons下新建Icomoon.js文件,复制一份Icomoon.ttf到node_modules/react-native-vector-icons/Fonts目录下,node_modules/react-native-vector-icons/glyphmaps下新建Icomoon.json文件

5将打印出来的code值粘贴到对应的json中
6在需要的页面引入对应的,直接正常使用就行


                                            
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  React Native