react-native(38)

36follower
@iwasaki さんのアバター 42views

React NativeのTextInputでAndroidの改行ができない

React NativeのTextInputをAndroidで使った際にEnterキーでの改行ができないことがあります。 該当するIssueはこちら https://github.com/facebook/react-native/is... 2017年6月26日
@iwasaki さんのアバター 36views

React NativeでStyleSheet.createしたstyleを渡すとpropの型がnumberになってしまう?

React NativeでCSSを書く場合、以下のように書くことが多いかと思います。 const styles = StyleSheet.create({ image: { flex: 1, width: 150, ... 2017年6月23日
@iwasaki さんのアバター 28views

react-native-fetch-blobのfetchでデータをWeb越しにダウンロードする際の注意点

ファイルをダウンロードする際のサンプル https://github.com/wkh237/react-native-fetch-blob#download-example-fetch-files-that-need-authorizat... 2017年6月22日
Tomoumi Nishimura さんのアバター 21views

TextInputのmultiline設定がAndroidだとうまく機能しない

原因は不明ですが、React-NativeではAndroid版TextInputのmultilineがうまく機能しない場合があるようです。 前提 こんな感じのTextInputを想定しています。 <TextInput... 2017年6月21日
@iwasaki さんのアバター 8views

React Nativeでmultilineの入力フィールドの入力開始位置を整える

Androidで高さを指定してmultilineにすると、開始位置がちょっと下の方にずれ、複数行入力していくと位置がガチャつくことがあります。 その場合には高さの指定とともに textAlignVertical: 'top', を入... 2017年6月21日
@iwasaki さんのアバター 11views

React NativeでRealmを使う際にinValidメソッドを使うには

Realmのschemaを設定する際に Realm.Object をextend して使います。 class Item extends Realm.Object {} Item.schema = { name: 'Item', p... 2017年6月21日
@iwasaki さんのアバター 52views

React NativeでRealmのfilterをいい感じで使う

filterは以下のような感じで使います。1つ目の引数はqueryの文字列になります。文字列内に$0,$1…を指定することで、2番目以降の引数が呼ばれるようになります。 realm.objects('Message').fil... 2017年6月19日
@iwasaki さんのアバター 33views

react-native-fetch-blobでファイルをダウンロードした際の後始末

後始末としてやることはファイルダウンロードのキャンセルおよびキャッシュファイルの削除になります。 キャンセル処理はこのあたりが参考になりそうです。 https://github.com/wkh237/react-native-fetch... 2017年6月16日
@iwasaki さんのアバター 18views

React NativeでPDFファイルを表示する

iOSでの話です。 以下のように、WebViewを使うことでPDFファイルなどを表示することができるようになります。ファイルのダウンロードは別のScreenで行い、ファイルの表示は別のScreenにuriを渡すのがいいようです。 imp... 2017年6月16日
Tomoumi Nishimura さんのアバター 83views

React Nativeのコンポーネントを詳しく見る

React Nativeのコンポーネントは仮想DOMとして表現されていますが、これを見るためにReact Developer Toolsというツールが用意されています。 導入方法 npmを利用します。 npm install -g r... 2017年6月14日
@iwasaki さんのアバター 14views

React NativeでMigration is required due to the following errorsが出た時の対処法

react-native run-ios や react-native run-android した際に以下のようなエラーが出ました。 Migration is required due to the following err... 2017年6月14日
@iwasaki さんのアバター 127views

React Nativeで画像ファイルのアップロード

https://hacknote.jp/archives/27471/ に関連する内容です。 react-native-fetch-blob と react-native-image-picker とを利用して 画像を選択してアップ... 2017年6月12日
@iwasaki さんのアバター 26views

React NativeのiPhone実機でテストする際にGeneratedInfoPlistDotEnv.hが見つからない

<built-in>:1:10: fatal error: '/Users/XXX/Library/Developer/Xcode/DerivedData/XXX/Build/Products/Debug-iphoneos/Ge... 2017年6月12日
Tomoumi Nishimura さんのアバター 23views

Reactotronに詳しめのログを投げる

Reactotronを使うと、React Nativeで作ったアプリのログをリアルタイムかつ簡単に確認することができます。 Reactotronを利用してログを飛ばす場合、例えば、 console.tron.log("hogehoge"... 2017年6月7日
@iwasaki さんのアバター 20views

React NativeのListViewでenableEmptySectionsのエラーが出た際の対処法

ListViewでヘッダーがないと以下のようなエラーが出ることがあります。 Warning: In next release empty section headers will be rendered. In this release ... 2017年6月6日
Tomoumi Nishimura さんのアバター 61views

react-native-fetch-blobでmultipart-formdataをPOSTする

react-native-fetch-blobを利用してデータを送るには、 RNFetchBlob.fetch(method, url, headers, [ { name: 'id', data: id }, { name: 'pass... 2017年5月31日
Tomoumi Nishimura さんのアバター 68views

React Nativeで画像選択を行う

React Nativeを利用したアプリ開発で、画像を選択する処理を実現する際には、react-native-image-pickerパッケージが利用できます。 導入 基本的には npm install react-native-im... 2017年5月11日
nakata さんのアバター 49views

react-nativeで配置

react-nativeのDimensionsコンポーネントを用いると画面の比率でサイズ、位置を調節出来て便利。 import { Dimensions } from 'react-native'; で取り込んで const { widt... 2017年3月31日