Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
Battle of GridLayout with RecyclerView
Kazuki Chigita
March 26, 2019
Technology
0
170
Battle of GridLayout with RecyclerView
GridLayout with RecyclerView
Kazuki Chigita
March 26, 2019
Tweet
Share
More Decks by Kazuki Chigita
See All by Kazuki Chigita
DroidKaigiカンファレンスアプリの歴史からみるアプリアーキテクチャのこれまでとこれから
chigichan24
2
1.4k
継続的に機能開発を進めながら行うマルチモジュール化
chigichan24
2
3.7k
Application Design 勉強会 #12
chigichan24
0
33
Application Design 勉強会 #10
chigichan24
0
57
Application Design 勉強会 #6
chigichan24
0
74
Application Design 勉強会 #4
chigichan24
0
45
Application Design 勉強会 #2
chigichan24
1
75
Read DroidKaigi2019 app source code
chigichan24
1
330
FlutterでBLEを いい感じにする
chigichan24
2
550
Other Decks in Technology
See All in Technology
データをコネコネ!メール配信用データ生成の仕組み
kappezoro
0
110
Backlog × RPAでいろいろ捗った話
z_tetsu
0
370
Microsoft Data Analytics trends : ”Lakehouse” , ”Data Mesh"
ryomaru0825
2
110
サイバー攻撃を想定したクラウドネイティブセキュリティガイドラインとCNAPP及びSecurity Observabilityの未来
syoshie
1
850
Amplifyで Webアプリケーションの 堅固な土台をサクッと構築する方法
kawasakiteruo
0
200
COSCUP x KCD Taiwan 2020 - 那些年我們在開源社群的日子 - Cloud Native Taiwan
pohsien
0
110
聊聊 Cgo 的二三事
david74chou
0
330
金融スタートアップの上場準備で大事にしたマインドセット / 2022-08-04-the-mindset-in-preparing-for-ipo
stajima
0
300
Red Hat Partner Training Portal のご紹介 / Red Hat Partner Training Portal Introduction
rhpej
0
110
AWSを始める人に向けた7つの大切なこと / 7 tips for AWS beginners
hiranofumio
1
620
疎ベクトル検索と密ベクトル検索: 第68回 Machine Learning 15minutes! Broadcast
keyakkie
1
240
GCCP Creator @ COSCUP 2022
line_developers_tw
PRO
0
1.4k
Featured
See All Featured
The Invisible Customer
myddelton
110
11k
Designing with Data
zakiwarfel
91
4k
Raft: Consensus for Rubyists
vanstee
127
5.5k
Gamification - CAS2011
davidbonilla
75
3.9k
How STYLIGHT went responsive
nonsquared
85
4k
Building Better People: How to give real-time feedback that sticks.
wjessup
344
17k
Design by the Numbers
sachag
271
17k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
7
1.1k
What's in a price? How to price your products and services
michaelherold
229
9.4k
The Cult of Friendly URLs
andyhume
68
4.8k
Pencils Down: Stop Designing & Start Developing
hursman
113
9.8k
Building Flexible Design Systems
yeseniaperezcruz
310
34k
Transcript
Battle of GridLayout with RecyclerView chigichan24 @ CA.apk #7 5
min
$whoami Kazuki Chigita (chigichan24) AbemaTV でインターン中 takahiromさんのもとAndroid開発のいろはを学んでいる
GridLayout
GridLayout جૅ
pulic class GridLayout extends ViewGroup جૅ
pulic class GridLayout extends ViewGroup N+1本の線でN個の等分領域に分けられる جૅ
pulic class GridLayout extends ViewGroup 0 1 2 … ⼦Viewはなんの指定もしなければ
各領域に広がる N+1本の線でN個の等分領域に分けられる جૅ
pulic class GridLayout extends ViewGroup 0 1 2 N+1本の線でN個の等分領域に分けられる ⼦Viewに専有したい数を渡せば
その分だけ広がる GridLayoutManager.SpanSizeLookUp()を使う جૅ
GridLayout
GridLayout with RecyclerView
How to adapt?
How to adapt? binding.recyclerView.layoutManager = GridLayoutManager(context, spanCount)
How to adapt? binding.recyclerView.layoutManager = GridLayoutManager(context, spanCount)
How to adapt? binding.recyclerView.layoutManager = GridLayoutManager(context, spanCount) N+1本の線でN個の等分領域に分けられる
Battle of GridLayout with RecyclerView chigichan24 @ CA.apk #7 5
min
Battle of GridLayout with RecyclerView chigichan24 @ CA.apk #7 5
min
GridLayout (span)
GridLayout (span) ͱ
GridLayout (span) RecyclerView (Itemdecoration) ͱ
GridLayout (span) RecyclerView (Itemdecoration) ͱ ͍ΖΜͳLayout͕ΊΔ
͜ΜͳLayoutΛ͘Έ͍ͨ1
͜ΜͳLayoutΛ͘Έ͍ͨ1
͜ΜͳLayoutΛ͘Έ͍ͨ1 spanCount=4のGridLayoutManagerをセットする
͜ΜͳLayoutΛ͘Έ͍ͨ1 spanCount=4のGridLayoutManagerをセットする GridLayoutManager.SpanSizeLookUp() { override fun getSpanSize(position: Int): Int {
//positionに応じて割り当てるサイズを渡す. } }
͜ΜͳLayoutΛ͘Έ͍ͨ1 spanCount=4のGridLayoutManagerをセットする GridLayoutManager.SpanSizeLookUp() { override fun getSpanSize(position: Int): Int {
//positionに応じて割り当てるサイズを渡す. return when { position == 0 -> 4 position <= 2 -> 2 else -> 1 } } }
͜ΜͳLayoutΛ͘Έ͍ͨ1 spanCount=4のGridLayoutManagerをセットする GridLayoutManager.SpanSizeLookUp() { override fun getSpanSize(position: Int): Int {
//positionに応じて割り当てるサイズを渡す. return when { position == 0 -> 4 position <= 2 -> 2 else -> 1 } } } RecyclerViewのItemDecorationのうちgetItemOffestsをoverride
͜ΜͳLayoutΛ͘Έ͍ͨ1 spanCount=4のGridLayoutManagerをセットする GridLayoutManager.SpanSizeLookUp() { override fun getSpanSize(position: Int): Int {
//positionに応じて割り当てるサイズを渡す. return when { position == 0 -> 4 position <= 2 -> 2 else -> 1 } } } RecyclerView. ItemDecoration() { override fun getItemOffests( outRect: Rect, view: View, parent: RecyclerView, state: RecylerView.State ) { outRect.left = margin ... } }
͜ΜͳLayoutΛ͘Έ͍ͨ2
͜ΜͳLayoutΛ͘Έ͍ͨ2 SpanCountは何分割にすればよいのか?
͜ΜͳLayoutΛ͘Έ͍ͨ2 SpanCountは何分割にすればよいのか? 等幅 & センタリング にしないといけない
͜ΜͳLayoutΛ͘Έ͍ͨ2 SpanCountは何分割にすればよいのか? 等幅 & センタリング にしないといけない 8
͜ΜͳLayoutΛ͘Έ͍ͨ2
͜ΜͳLayoutΛ͘Έ͍ͨ2
͜ΜͳLayoutΛ͘Έ͍ͨ2 SpaceItemを導⼊する
͜ΜͳLayoutΛ͘Έ͍ͨ2 SpaceItemを導⼊する (複数のItemが必要になってくるとGroupieが便利です)
ҰൠԽ ここに⼊るViewの数は 可変にしたい
ҰൠԽ 最⼤幅になりうる数の集合の最⼩公倍数×2 (多分) ここに⼊るViewの数は 可変にしたい
·ͱΊ GridLayoutとRecyclerViewはいろいろできる いい感じのLayoutを作るには算数⼒が必要