安装链接

yarn add react-native-vector-icons

react-native link react-native-vector-icons

在项目工程中打开 .xcodeproj 文件 添加 fonts文件夹

安卓上我没配置 试了下 貌似可以的,具体有那些图标能用 目前还在试用中

import Icon from 'react-native-vector-icons/FontAwesome';

<Icon.Button  //在图片后加, 自定义样式的文字
name="facebook"
backgroundColor="#3b5998">
<Text style={{fontFamily: 'Arial', fontSize: }}>Login with Facebook</Text>
</Icon.Button>

先试试这个看配置成功没

https://www.npmjs.com/package/react-native-vector-icons  这里面有 说明 内置了那些图标,可以点进去查看

有上面几个,在使用的时候 是分别引入的,就是你想使用这里面那个库 你就引入 这个模块

import Icon from 'react-native-vector-icons/FontAwesome';

或者

import Icon from 'react-native-vector-icons/Feather';

等等,看自己想用那个库

react-native-vector-icons 图标库使用的更多相关文章

  1. [RN] React Native 使用精美图标库react-native-vector-icons

    React Native 使用精美图标库react-native-vector-icons 一.安装依赖 npm install --save react-native-vector-icons // ...

  2. React Native如何添加自定义图标

    iOS 1.通过xcode将'xxx.ttf'文件引入项目,如图: 2.在node_modules/react-native-vector-icons下新建Icomoon.js文件,复制一份Icomo ...

  3. [RN] React Native 使用 react-native-vector-icons 图标显示问号

    我在第一次使用 react-native-vector-icons 时图标显示问号 后来在网上查了很多文章,发现原因有两个 1)安装完 react-native-vector-icons 后,没有li ...

  4. [RN] React Native 使用 阿里巴巴 矢量图标库 iconfont

    React Native 使用 阿里巴巴 矢量图标库 iconfont 文接上文: React Native 使用精美图标库react-native-vector-icons 本文主要讲述 如何 使用 ...

  5. beeshell —— 开源的 React Native 组件库

    介绍 beeshell 是一个 React Native 应用的基础组件库,基于 0.53.3 版本,提供一整套开箱即用的高质量组件,包含 JavaScript(以下简称 JS)组件和复合组件(包含 ...

  6. React Native(七)——react-native-elements

    配合React native使用的UI库:https://react-native-training.github.io/react-native-elements/ 1. 新建项目:http://w ...

  7. Airbub 弃用React Native

    弃用 React Native ? 最近的技术圈尤为热闹,Google 发布了首个 Flutter 预览版.Vue.js 在 GitHub 上的 star 数量超过了 React.js,而如今全球著名 ...

  8. 【React Native】在网页中打开Android应用程序

    React Native官方提供Linking库用于调起其他app或者本机应用.Linking的主要属性和方法有: 属性与方法 canOpenURL(url); 判断设备上是否有已经安装相应应用或可以 ...

  9. [RN] React Native 解决 使用 阿里巴巴 矢量图标库 iconfont 图标不垂直居中问题

    React Native 解决 使用 阿里巴巴 矢量图标库 iconfont 图标不垂直居中问题 解决方法: 添加 size,  line-height ,值为和 height 一样的高度. 例如: ...

  10. 基于React Native的Material Design风格的组件库 MRN

    基于React Native的Material Design风格的组件库.(为了平台统一体验,目前只打算支持安卓) 官方网站 http://mrn.js.org/ Github https://git ...

随机推荐

  1. P2799国王的魔镜

    链接 想了好久(蒟蒻的不能蒟蒻) 题解: #include<iostream>#include<cstdio>#include<cstring>#include&l ...

  2. reids(缓存,reids下载,安装 测试)

    什么是缓存:缓存就是数据交换的缓冲区(称作Cache),当某一硬件要读取数据时,会首先从缓存中查找需要的数据,如果找到了则直接执行,找不到的话则从内存中找.由于缓存的运行速度比内存快得多,故缓存的作用 ...

  3. 数据库SQL语言学习--上机练习4(视图)

    上机练习4 一.实验目的 . 熟悉和掌握对数据表中视图的查询操作和 SQL 命令的使用: . 熟悉和掌握对数据表中视图的更新操作和 SQL 命令的使用,并注意视图更新与基本表更新的区别与联系: . 学 ...

  4. MySQL 二进制文件恢复数据基础版本

    先来一段 自行体会 #---------------------------------------------------------------------------------- #模拟通过b ...

  5. 详解http和https的作用与区别

    PS: https就是http和TCP之间有一层SSL层,这一层的实际作用是防止钓鱼和加密.防止钓鱼通过网站的证书,网站必须有CA证书,证书类似于一个解密的签名.另外是加密,加密需要一个密钥交换算法, ...

  6. java中synchronized 用在实例方法和对象方法上面的区别

    https://bijian1013.iteye.com/blog/1836575 在Java中,synchronized 是用来表示同步的,我们可以synchronized 来修饰一个方法.也可以s ...

  7. Spring+MyBatis实现数据库读写分离方案

    推荐第四种:https://github.com/shawntime/shawn-rwdb 方案1 通过MyBatis配置文件创建读写分离两个DataSource,每个SqlSessionFactor ...

  8. ArcGIS for android添加图层几何体

    GraphicLayer lyr; Map<String,Object> attr = new HashMap<String,Object>(); attr.put(this. ...

  9. win7开始菜单路径

    按Win + R, 输入C:\Users\zhouwanchun\AppData\Roaming\Microsoft\Windows\Start Menu 点击确定

  10. CentOS的文件属性:命令 ls -l

    第一列:有11位 1)第一位表示文件类型 1)l表示链接文件 2)d表示目录 3)-普通文件 4)b块设备  磁盘分区就是这种类型 5)c 串行端口设备文件(字符设备文件),比如键盘,鼠标,打印机,t ...