35
22

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

React-Native-vector-iconsで使えるアイコン一覧

Posted at

React NativeでFontAwesomeのアイコンを使おうとしたら
使えないアイコンもあったので一応使えるアイコン一覧ページを貼っときます。

#react-native-vector-iconsアイコン一覧
react-native-vector-icons directory

Screen Shot 2018-12-06 at 12.50.06.png

念の為、使い方も記載。

##install

npm install --save react-native-vector-icons
npm install

##import
今回は「Font Awesome」を使う
※使うアイコンフォントによって/FontAwesomeを変えます。

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

##アイコンを使う

App.js
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import Icon from 'react-native-vector-icons/FontAwesome';


export default class App extends React.Component {
  render() {
    return (
      <View style={{ flex:1, alignItems: 'center', justifyContent:'center' }}>
        <Icon name="home" size={50}/>
      </View>
    );
  }
}

Screen Shot 2018-12-06 at 12.45.41.png

こんな感じです。

###参考ページ
ありがとうございました。
ReactNativeでFontAwesomeを使う

35
22
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
35
22

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?