ReactNative
react-nativeでFirebaseを簡単に使えるようになるreact-native-firebaseというライブラリがあります。 rnfirebase.io ですが、react-native v0.51.0ではiOSの設定がドキュメント通りでは動きません。 そのワークアラウンドについて書いておきます。 RNFireba…
Inputフォームに続き、マテリアルデザインのRippleエフェクトをReact NativeのJSのみで実装してみました。 コード transformの方で最初実装してたのですが、タブを連続でタップすると表示が上手く行かないことがあったのでこちらで実装しました。 iOS Android
gist.github.com AndroidとiOSでInputTextのスタイルを合わせるのが面倒だなと思ってました。 iOSもマテリアルデザインに寄せてしまうのは最近だとアリだと思っているのでちょっと試しに作りました。 ざっと30分くらいで作ったので本物の機能は足りてないで…
facebook.github.io iOSの方はちゃんとドキュメントがあるのに何でAndroidは無いんですかね… といってもやり方は簡単です。 MainActivityでcreateReactActivityDelegateをオーバーライドして ReactActivityDelegateのgetLaunchOptionsをオーバーライドするだ…
React Nativeでグラフを描くにはどうしたらいいのかと調べましたら、 React Native内にReact Native ARTというライブラリが在るのを知りました。 ドキュメントにも書いてないですが、開発はされているようです。 react-native/ReactNativeART.js at 0.48-sta…
github.com Breaking changes Android Remove unused createJSModules calls (ce6fb33, 53d5504) - @javache ReactPackageというinterfaceからcreateJSModulesが削除されました。 これ結構ヤバイ変更だと思っています。 Androidのネイティブにアクセスするラ…
React Nativeで始めるアプリ開発 from Ryosuke Hara www.slideshare.net SlideShareにアップロードしてます。 Keynoteで作ったのをPowerPointに変換して上げてるので若干レイアウト崩れてます（修正する元気無い） React Nativeに関する簡単な紹介です。…
もー、クソん。 Oppo。 KeyEvent.KEYCODE_MENU（82番） がシステム側で受け取られててアプリまで来ない。 ちなみにOppoはシェイクしてもDevモード出ない。 しかたなく他の空いているキーコードをアプリで受け取って書き換えることに… 処理は簡単で、ReactAct…
ReactNativeでアプリを作る時はReduxを使っていて、ReduxのStoreとReactのComponentをBindingしてくれるreact-reduxが便利なので使っています。 github.com react-reduxが提供するconnectというStoreとComponentをBindingする関数が在るのですが、 connect( …
2017/05/25時点です。 StackNavigatorのルートに他のNavigatorを入れるとエラーになる。 たとえば、 スプラッシュ→ログイン→メイン（ドロワー） ってしたい時にメインまで行ったらメインでスタックを初期化したいですよね？ その時にメインがNavigatorだった…
Javascriptでちゃんとテスト書いてますか？ 私は書いてないです。 テストはあんまり書いたことないです（ドン引き Javascriptのテストは全く書いたことないです（ドンッ！！ 今仕事で開発しているアプリはReactNativeなんですが、 やっぱスクリプト言語だと…
Introduction · react-sketchapp ReactのシンタックスでSketchが動くらしい。 なんだかすごそう（小並感 インストール 公式のまんま git clone https://github.com/airbnb/react-sketchapp.git cd react-sketchapp/examples/basic-setup && npm install basi…
アプリのクラッシュレポートツールを大体入れているかと思うのですが、ReactNativeではどうするのが一般的なんでしょうかね。 FabricのCrashlyticsを入れたのですが、これはネイティブのエラーの箇所をレポートするので自前のネイティブ処理じゃない場合はラ…
React nativeってどうなの？ from Ryosuke Hara www.slideshare.net LTなんて初めてでした。 とりあえず、なんか友人からの質問やTwitterとか見てて疑問に思ってそうな事適当に並べて見ました。 なんというか、福岡でもReact/React Nativeをワイワイさせた…
（追記）解決しました。 やっぱりJavascriptCoreが原因でした。 github.com developers-jp.googleblog.com ここで紹介されてたので、ネイティブSDK入れなくてもいけるのか〜 と思って色々試して見ました。 匿名ログインしてRealtimeDatabaseに書き込みは出来…
最近は仕事でも個人でもReact Nativeでの開発がメインになっており、かなり知識が溜まってきました。 で、だいぶiOSとAndroidに最適化したUIの構成ができるようになってきたのでメモ程度に残します。 OSごとのUIの分け方 ReactNativeは標準で幾つかiOS, Andr…
facebook.github.io Andoroidの戻るボタンが押された時のイベントをハンドリングするAPIです。 なんか公式ドキュメント見るとaddEventListerでセットしたハンドラの破棄はremoveEventListerを使わないといけないっぽいですが、 ソースを見てみる addEventLis…
issue上がってます github.com 再現方法 NetInfo.isConnectedを使うだけ。 Androidはちゃんとしたネットワークの接続状況を返してくれますが、iOSは常にfalse… 原因 github.com ワークアラウンド なんと公式ドキュメントのサンプルにまで書いてあります…直さ…
issue上がってます github.com 再現方法 例えば通信処理中にインジケータ（くるくるするやつ）を出して、通信終わったらインジケータ消してレスポンスに応じてダイアログでユーザに通知したいとかあるじゃないですか。 このインジケータの表示にModalを使っ…
実機デバッグはVysorを使おう chrome.google.com 実機の画面をキャプチャしてPCに転送してくれます。 キャプチャ画面でクリックやスクロール、タイピングもできるので非常に便利です。 ReactNativeのRELOAD機能はR2回押しで実機だと出来ないのでコレを使うと…
*Android編①って書いてるけどAndroid編②があるとかiOS編があるとかは未定です ReactNativeの「Native」の部分がどう動いてるのか気になったのでソース見てみました。 細かい所まで見てないですし、間違った認識かもしれませんのであしからず。 エントリポイ…
最近自社のアプリ（iOS,Swift/Android, Kotlin）をReactNative化しているので使ってみた雑感など。 導入のきっかけ 自社アプリのiOS(Swift)とAndroid(Kotlin)は私が一人で作って運用しています。 なんで一人かというと社内でアプリをかけるのは私しかいない…
