Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
リストのスクロール方法の検討
Search
Kanta Mori
December 08, 2023
0
400
リストのスクロール方法の検討
Kanta Mori
December 08, 2023
Tweet
Share
More Decks by Kanta Mori
See All by Kanta Mori
ゆめみの Flutter エンジニア育成方法
morikann
1
1.4k
Featured
See All Featured
GraphQLとの向き合い方2022年版
quramy
49
14k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
How to Ace a Technical Interview
jacobian
278
23k
Become a Pro
speakerdeck
PRO
29
5.4k
Being A Developer After 40
akosma
90
590k
Site-Speed That Sticks
csswizardry
10
690
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
46
9.6k
Faster Mobile Websites
deanohume
307
31k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
4 Signs Your Business is Dying
shpigford
184
22k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
281
13k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Transcript
リストのスクロール方法の検討 YOUTRUST × ゆめみ Flutter LT会 #4
自己紹介 • 名前: 森 寛太 • ゆめみの Flutter エンジニア •
GitHub: https://github.com/morikann
リストのアイテムにスクロールする方法は何がある?🤔
None
計算が大変😱
Key を割り当てる方法がある💡
Keyを作成し、 リストのアイテムに渡す 遷移したいwidgetのcontextを 渡してスクロール
Keyを作成し、 リストのアイテムに渡す 遷移したいwidgetのcontextを 渡してスクロール
None
問題点 あらかじめ全てのリストアイテムにKeyを割り当てる必要がある 効率的なリストには使えない(ex. ListView.builder, SliverList.builder)
どうするか 🤔
scrollable_positioned_list • Googleが開発 • 効率的なカスタムリストを提供 • スクロールによるリストアイテムへの移 動 • ジャンプによるリストアイテムへの移動
None
問題点 • 画面全体でスクロールできる、かつ 画面の一部にリストを表示する構成ができない • CustomScrollView + SliverFillRemainingで ScrollablePositionedList.builderをラップすると それっぽい画面はできるが期待する動作にはならない
問題点 • 画面全体でスクロールできる、かつ 画面の一部にリストを表示する構成ができない • CustomScrollView + SliverFillRemainingで ScrollablePositionedList.builderをラップすると それっぽい画面はできるが期待する動作にはならない
どうするか 🤔
scroll_to_index • カスタムリストの提供はなし • 既存のリストに適用可能 • スクロールによるリストアイテムへの移 動 • ジャンプによるリストアイテムへの移動
は提供していない
AutoScrollController のインスタンスを作成 AutoScrollTag でリストアイテムをラップ スクロールメソッドにindexを提供するだけ
AutoScrollController のインスタンスを作成 AutoScrollTag でリストアイテムをラップ スクロールメソッドにindexを提供するだけ
まとめ • リストのスクロール方法は色々ある • デザイン、要件に合わせて適切な方法を取っていきたい
ご清聴ありがとうございました!