ReactNative react-native-paperの使い方

スポンサーリンク
未分類

ReactNativeのUIライブラリを使って画面を作り込んでみます。今回使うのは[react-native-paper]を使ってみます。

インストール

yarn add react-native-paper react-native-vector-icons --exact
yarn add @types/react-native-vector-icons -D --exact

iOSの場合

iOS/Podfileに以下の一行を追加します。

pod 'RNVectorIcons', :path => '../node_modules/react-native-vector-icons'

追加したら以下のコマンドを実行します。

cd ios
pod install --repo-update
cd ..

次にiOS/[アプリ名]/info.plistを編集しましょう。

<key>UIAppFonts</key>
<array>	
	<string>AntDesign.ttf</string>
	<string>Entypo.ttf</string>
	<string>EvilIcons.ttf</string>
	<string>Feather.ttf</string>
	<string>FontAwesome.ttf</string>
	<string>FontAwesome5_Brands.ttf</string>
	<string>FontAwesome5_Regular.ttf</string>
	<string>FontAwesome5_Solid.ttf</string>
	<string>Foundation.ttf</string>
	<string>Ionicons.ttf</string>
	<string>MaterialIcons.ttf</string>
	<string>MaterialCommunityIcons.ttf</string>
	<string>SimpleLineIcons.ttf</string>
	<string>Octicons.ttf</string>
	<string>Zocial.ttf</string>
</array>

できたら以下のコマンドを実行します。

rm -rf ios/build
yarn ios

暇な時間にU-NEXT

今なら無料1ヶ月無料トライアル600円分の有料コンテンツを使えるチャンス!

見放題作品が31日間無料で視聴可能最新作はレンタル配信!

600円分のポイントプレゼント!DVD・ブルーレイよりも先行配信の最新作、放送中ドラマの視聴や最新コミックの購入に使用可能

 

追加料金なく、80誌以上の雑誌が読み放題

未分類
スポンサーリンク
uediveをフォローする
SEの休日

コメント

タイトルとURLをコピーしました