質問: webサイトでよく見かけるビューの変化の話ですが、 上にスワイプして下にスクロールするときに、上のヘッダー部分を隠す、トップに戻ったら隠した部分を出現させる、 という機能をアプリではあまり見かけません。 このような機能をアプリに実装するのは難しいのでしょうか? ScrollViewにて、スクロールされたという情報を受け取るのはpropsで行うのでしょうか? また、横スクロールにより、タブを変更するという機能も見かけますが、 この機能と先ほどの機能は同じロジックで管理できるのでしょうか? ![イメージ説明](https://teratail.storage.googleapis.com/uploads/contributed_images/437a298a9d707f0e41b0c11576a5c7ac.png)
回答: > > 上にスワイプして下にスクロールするときに、上のヘッダー部分を隠す、トップに戻ったら隠した部分を出現させる、 > > という機能をアプリではあまり見かけません。 > > このような機能をアプリに実装するのは難しいのでしょうか? > > > ↓が参考になるかと思います https://medium.com/appandflow/react-native-scrollview-animated-header-10a18cb9469e ちなみにあまり見かけない理由ですが、 header をタップすると一番上まで戻るという機能が OS 標準でついているので、スマホアプリで header を隠すのはそういったお約束を破る、ということになります。 驚き最小の原則で header を隠さないようにしているのではないかと思います。 > > ScrollViewにて、スクロールされたという情報を受け取るのはpropsで行うのでしょうか? > > > `onScroll` にハンドラーを登録して検知するという形になります https://facebook.github.io/react-native/docs/scrollview.html#onscroll > > また、横スクロールにより、タブを変更するという機能も見かけますが、 > > この機能と先ほどの機能は同じロジックで管理できるのでしょうか? > > > react-navigation など、ナビゲーション系のパッケージがサポートしているジェスチャーで処理する形になります。