react-native(34)

34follower
Tomoumi Nishimura さんのアバター 9views

React-NativeでNativeモジュールを使う

React-Nativeでは基本的にjsでアプリの動作を記述していくことになりますが、どうしてもjsからは利用できないネイティブ機能が使いたくなることがあります。 そういう場合には、そのネイティブ機能をラップするモジュールを記述することで、... 2017年8月9日
tortuepin さんのアバター 4views

react-nativeでToast

画面の下にちょこって出てくるToast。 Native-Baseを使う。 構文 import { Toast } from 'native-base'; Toast.show({ text: 'メッセージ'... 2017年8月9日
@iwasaki さんのアバター 4views

React Nativeで新規プロジェクトを作成する

作成 react-native init <project-name> npm install --save realm npm install --save redux npm install --save react-na... 2017年8月9日
@iwasaki さんのアバター 8views

React Native Navigatorでタイトルを変更する方法

注意点 似たようなモジュールがたくさんあるので、自分がどれを使っているか把握しておく必要があります。 react-community/react-navigation GitHub https://github.com/react-... 2017年8月4日
@iwasaki さんのアバター 10views

React Nativeアプリがローカルで動作しなくなった

react-native run-ios や react-native run-android を実行すると Loading dependency graph... Bundling `index.android.js` ░░... 2017年8月4日
Tomoumi Nishimura さんのアバター 3views

React-Native実機テスト中にメニューを出す

React-Nativeは、シミュレーターでの実行時に⌘+Dを押すことでメニューを呼び出すことができ、メニューからはアプリのリロード(ただし、JavaScriptで書かれた部分のみ)や、Chromeを利用したデバッグなどが可能になります。 ... 2017年8月2日
tortuepin さんのアバター 10views

react-native renderされるタイミング

react-nativeでrenderされるタイミングは以下の2種類しかない stateが変更される propsが変更される stateが変更された場合、shouldComponentUpdate()がよばれ、ここでtrueが返った... 2017年7月26日
ysugiyama12 さんのアバター 22views

React Nativeで要素をloopして表示する

Viewタグなどで囲まれた要素に配列の値などを代入しながら複数回表示する時の方法 export default class Sample extends Component { render() { var label = [... 2017年7月12日
kensuke-iizuka さんのアバター 15views

React Nativeのバージョンを指定して初期化する

React Nativeを使ってモバイルアプリケーションを作る際にReact Nativeのバージョンを指定して作成するには、 以下のinitコマンドでバージョンを指定してあげれば大丈夫です。 これで少し古いnodeモジュールを使ってい... 2017年7月11日
@iwasaki さんのアバター 16views

react-native-fetch-blobをAndroidで使う際に文字化けが起きるケース

React NativeでファイルのアップロードやダウンロードなどAPIを叩く周りの処理を行う際によく使うライブラリ react-native-fetch-blob これを使った際に顔文字を使うなど特定の状況下で文字化けが発生しました。... 2017年7月10日
@iwasaki さんのアバター 8views

React Nativeのテキストエリアの下線を消す

React Native の TextInput には underlineColorAndroid の属性があります。 テキストエリアの下線の色を指定できるようになっています。 https://facebook.github.io/re... 2017年7月4日
@iwasaki さんのアバター 24views

React Nativeで画面を回転させた際に再描画させる方法

トリッキーなことをしていなければ、よしなにしてくれますが、positionの指定などを細かくやっている際に画面を回転させた際に再描画させる方法 は以下のようにします。 constructor(props) { super(pr... 2017年7月3日
@iwasaki さんのアバター 3views

npm i react-native-mime-typesではfalseが返るケースがある

https://github.com/wkh237/react-native-fetch-blob/wiki/File-System-Access-API#scanfilepathstringpromise-androi-only にはA... 2017年7月3日
@iwasaki さんのアバター 9views

react-native run-android した際にAndroid 4.4.4 (API 19)だと以下のようなエラーが出る

react-native run-android した際にAndroid 4.4.4 (API 19)だと以下のようなエラーが出る Running /usr/local/opt/android-sdk/platform-tools/a... 2017年6月29日
Tomoumi Nishimura さんのアバター 15views

React Nativeでトーストメッセージ

Androidを使っている際に、画面の下の方に出て来る簡素なメッセージのことをトーストメッセージと言います。 React Nativeでの実装もすっごいシンプル。 import ToastAndroid from 'react-nati... 2017年6月28日
@iwasaki さんのアバター 32views

React Nativeで要素の高さを取得する方法

render() { return ( <TextInput ref={(r) => { this.myTextInput = r; }} ... 2017年6月27日
@iwasaki さんのアバター 21views

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

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

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

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

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 さんのアバター 13views

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

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