2017年11月8日水曜日

react nativeでKeyboard.dismissを常に行うために、ScrollViewを使う的なお話

  • このエントリーをはてなブックマークに追加

Keyboardの管理って地味に面倒なやつで。
画面領域をタップしたら見えないようにしたいとかそういう感じではあるんだけど、
普通はKeyboard.dismiss()を叩かないといけないわけで。
となるとそもそものWrapperとしてTouchabelWithoutFeedbackを使ってごにょごにょしようとすると、
そっちのタッチイベントが優先されてScrollViewとかFlatListがスクロールできなくなるっていう。

ってなわけで今日はそんなことをせずに画面をタップしてKeyboardを消すには的なお話をば。


{this.props.children}

上のようなものを作ってあげて、各ScreenでimportしてContainerとして使ってあげれば良い的な。
ScrollViewでタップイベントなのかなんなのかが発生時に自動的にKeyboardをdismissしてくれる的な。

Adsense