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
詳解 RelativeLayoutの内部実装
Search
HiroYUKI Seto
February 03, 2018
Technology
0
3.1k
詳解 RelativeLayoutの内部実装
2018/2/9
DroidKaigi 2018 DAY02 room1 10:30~
発表の付録1
HiroYUKI Seto
February 03, 2018
Tweet
Share
More Decks by HiroYUKI Seto
See All by HiroYUKI Seto
Androidアプリの 安全なリファクタリングを行うパターン集
seto_hi
2
4.9k
UI TestやVisual Regression Testを コスパ良くやる
seto_hi
3
1.8k
事業支援というお仕事
seto_hi
0
410
MDCの内部実装から学ぶ 表現力の高いViewの作り方
seto_hi
5
1.8k
CoordinatorLayoutのBehaviorを使い倒す
seto_hi
1
400
Jetpack Compose
seto_hi
2
780
UI改善に繋がるエンジニアの立ち回り
seto_hi
2
4.7k
MDCのButtonのCorner Family
seto_hi
1
190
MDCのBottomAppBarのShadowの実現方法
seto_hi
0
980
Other Decks in Technology
See All in Technology
Nx × AI によるモノレポ活用 〜コードジェネレーター編〜
puku0x
0
520
データモデリング通り #2オンライン勉強会 ~方法論の話をしよう~
datayokocho
0
150
ロールが細分化された組織でSREと協働するインフラエンジニアは何をするか? / SRE Lounge #18
kossykinto
0
210
僕たちが「開発しやすさ」を求め 模索し続けたアーキテクチャ #アーキテクチャ勉強会_findy
bengo4com
0
2.3k
LLMで構造化出力の成功率をグンと上げる方法
keisuketakiguchi
0
780
家族の思い出を形にする 〜 1秒動画の生成を支えるインフラアーキテクチャ
ojima_h
3
1k
GMOペパボのデータ基盤とデータ活用の現在地 / Current State of GMO Pepabo's Data Infrastructure and Data Utilization
zaimy
3
210
o11yツールを乗り換えた話
tak0x00
2
930
AIに目を奪われすぎて、周りの困っている人間が見えなくなっていませんか?
cap120
1
550
LLMをツールからプラットフォームへ〜Ai Workforceの戦略〜 #BetAIDay
layerx
PRO
1
960
Google Agentspaceを実際に導入した効果と今後の展望
mixi_engineers
PRO
3
410
[OCI Technical Deep Dive] OracleのAI戦略(2025年8月5日開催)
oracle4engineer
PRO
1
150
Featured
See All Featured
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
131
19k
Become a Pro
speakerdeck
PRO
29
5.5k
Documentation Writing (for coders)
carmenintech
73
5k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Code Reviewing Like a Champion
maltzj
524
40k
How to train your dragon (web standard)
notwaldorf
96
6.2k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.4k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
What's in a price? How to price your products and services
michaelherold
246
12k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
110
19k
A better future with KSS
kneath
239
17k
Transcript
DroidKaigi 2018付録1 詳解 RelativeLayoutの 内部実装 株式会社ノハナ 瀬戸優之 @seto_hi
RelativeLayoutのポイント =Graph
Graph グラフ(英: Graph)とは、 ノード(頂点)群とノード間の連結関係を表す エッジ(枝)群で構成される抽象データ型、 and・orその実装である具象データ型である。 (wikipedia)
DependencyGraph • 有向グラフ • mNodes = 子Viewすべて、ArrayList • mKeyNodes =
IDを持つ子View、SparseArray Node • dependents = 参照しているNode • dependencies = 参照されているNode
RelativeLayout#onMeasure
RelativeLayout#onMeasure 1. DependencyGraphを作る 2. 横方向でGraphのrootからmeasure、仮レイアウト 3. 縦方向でGraphのrootからmeasure、仮レイアウト ◦ 自身のサイズも仮決定
RelativeLayout#onMeasure 4. 自身がwrap_contentなら ◦ 子のサイズとMeasureSpecから自身のサイズを修正 ◦ 中央寄せのViewの位置を修正 5. Gravityによって位置を本決め 6.
setMeasuredDimensions
mesureでの仮レイアウト • 参照のGraphのrootからmeasure + 仮レイアウトしていく • measure対象のViewが参照しているViewは 必ず仮レイアウト済み • measureさえすればmeasure対象のViewの
仮レイアウト位置が確定できる
子ViewのmeasureSpec 1. 左右(or上下)ともに参照しているViewがある ◦ 左右(or上下)のViewの間のサイズ + EXACTLY 2. 1.でない場合 ◦
子Viewがサイズ決め打ち ▪ 子Viewのサイズと余りサイズの最小値 + EXACTLY ◦ 子Viewがmatch_parent ▪ RelativeLayoutの余りサイズ + EXACTLY※ ◦ 子Viewがwrap_content ▪ RelativeLayoutの余りサイズ + AT_MOST※ ※余りがなければ0 + UNSPECIFIED
RelativeLayout#onLayout
RelativeLayout#onLayout • measure通りにレイアウトするだけ ◦ RelativeLayout.LayoutParamsが位置と座標を持つ ▪ mLeft, mTop, mRight, mBottom
• シンプル!
循環参照の検知
循環参照の検知 • RelativeLayoutで循環参照は禁止 ◦ rightOfのleftOfが自身のような場合 ◦ ConstraintLayoutは一部OK(Chainになる) • グラフの参照で解決
DependencyGraph • mNodes = 子Viewすべて、ArrayList • mKeyNodes = IDを持つ子View、SparseArray Node
• dependents = 参照しているNode • dependencies = 参照されているNode
DependencyGraph#getSortedViews 1. GraphのrootをDequeに入れる 2. Dequeからグラフの頂点のNodeをpoll 3. 2.を参照している子Nodeに対して 3.1. 参照されているNodeがないならばDequeに追加 3.2.
参照されているNodeがあれば何もしない 4. Dequeが空ならば5、 Dequeが空でないならば2.に戻る 5. すべてのEdgeをDequeに追加できていない場合は 例外を投げる
循環参照の検知(正常系) A B C Dequeue
循環参照の検知(正常系) A B C Dequeue A 1.RootをDequeueに追加
循環参照の検知(正常系) A B C Dequeue B 2.pollして消去 3.1.Dequeueに追加
循環参照の検知(正常系) B C Dequeue C 3.1.Dequeueに追加 2.pollして消去
循環参照の検知(正常系) C Dequeue 2.pollして消去
循環参照の検知(正常系) Dequeue 5.Dequeueが空で すべてのEdgeを参照したので終了
循環参照の検知(異常系) A B C Dequeue 循環参照
循環参照の検知(異常系) A B C Dequeue A 1.RootをDequeueに追加
循環参照の検知(異常系) A B C Dequeue 2.pollして消去 3.2.参照があるので Dequeueに追加しない
循環参照の検知(異常系) B C Dequeue 5.Dequeueが空なのにすべてのEdgeが参照できていない 例外を投げる