こんにちは、エキサイトでアプリエンジニアをしている岡島です。 今回は、ListViewなどスクロールができるウィジェットのphysicsついてまとめていこうと思います。
Scrollableなウィジェット
Flutterには、スクロール可能なウィジェットがいくつか用意されています。主なものには以下があります:
- ListView
- PageView
- GridView
- SingleChildScrollView
- CustomScrollView
これらのウィジェットは、physicsプロパティを持っており、このプロパティを通じてスクロールの挙動をカスタマイズすることができます。
physicsについて
physicsプロパティは、スクロールの動作や効果を制御しています。physicsには以下のような種類があるのでそれぞれの特徴について紹介していきます。
- AlwaysScrollableScrollPhysics
- BouncingScrollPhysics
- ClampingScrollPhysics
- NeverScrollableScrollPhysics
- RangeMaintainingScrollPhysics
AlwaysScrollableScrollPhysics
AlwaysScrollableScrollPhysicsは、リストがスクロール可能な要素の数にかかわらず、常にスクロール可能にする設定です。、リスト項目が少なくても、スクロール可能な状態が維持されます。
iOSではBouncingScrollPhysicsの挙動、AndroidではClampingScrollPhysicsの挙動となります。
AlwaysScrollableScrollPhysics class - widgets library - Dart API
デフォルト | AlwaysScrollableScrollPhysics |
---|---|
BouncingScrollPhysics
BouncingScrollPhysicsは、iOS風のバウンス効果を持つスクロール動作を提供します。リストの先頭や末尾に到達すると、バウンドするようなスクロールです。
BouncingScrollPhysics class - widgets library - Dart API
iOS | Android |
---|---|
ClampingScrollPhysics
ClampingScrollPhysicsはAndroidのスクロール動作に近く、リストの先頭や末尾に到達した際に、バウンドせずにスクロールが停止する挙動です。
ClampingScrollPhysics class - widgets library - Dart API
iOS | Android |
---|---|
NeverScrollableScrollPhysics
NeverScrollableScrollPhysicsは、スクロールを完全に無効化します。
NeverScrollableScrollPhysics class - widgets library - Dart API
iOS | Android |
---|---|
RangeMaintainingScrollPhysics
RangeMaintainingScrollPhysicsは、スクロール範囲が増減しても、自動的にスクロール位置を調整します。 リストの内容が動的に変化する場合に役に立ちます。
RangeMaintainingScrollPhysics class - widgets library - Dart API
最後に
今回はスクロールができるウィジェットのphysicsについてまとめてみました。状況に応じて使い分けることや組み合わせることで、ユーザー体験の向上につながるかと思います。読んでいただきありがとうございました!