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.9k
事業支援というお仕事
seto_hi
0
420
MDCの内部実装から学ぶ 表現力の高いViewの作り方
seto_hi
5
1.8k
CoordinatorLayoutのBehaviorを使い倒す
seto_hi
1
400
Jetpack Compose
seto_hi
2
790
UI改善に繋がるエンジニアの立ち回り
seto_hi
2
4.7k
MDCのButtonのCorner Family
seto_hi
1
200
MDCのBottomAppBarのShadowの実現方法
seto_hi
0
980
Other Decks in Technology
See All in Technology
要件定義・デザインフェーズでもAIを活用して、コミュニケーションの密度を高める
kazukihayase
0
110
オブザーバビリティが広げる AIOps の世界 / The World of AIOps Expanded by Observability
aoto
PRO
0
360
ChatGPTとPlantUML/Mermaidによるソフトウェア設計
gowhich501
1
130
ZOZOマッチのアーキテクチャと技術構成
zozotech
PRO
3
1.5k
自作JSエンジンに推しプロポーザルを実装したい!
sajikix
1
170
企業の生成AIガバナンスにおけるエージェントとセキュリティ
lycorptech_jp
PRO
2
160
下手な強制、ダメ!絶対! 「ガードレール」を「檻」にさせない"ガバナンス"の取り方とは?
tsukaman
2
440
RSCの時代にReactとフレームワークの境界を探る
uhyo
10
3.4k
Terraformで構築する セルフサービス型データプラットフォーム / terraform-self-service-data-platform
pei0804
1
170
OCI Oracle Database Services新機能アップデート(2025/06-2025/08)
oracle4engineer
PRO
0
110
AWSを利用する上で知っておきたい名前解決のはなし(10分版)
nagisa53
10
3.1k
Obsidian応用活用術
onikun94
2
490
Featured
See All Featured
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.9k
It's Worth the Effort
3n
187
28k
Art, The Web, and Tiny UX
lynnandtonic
303
21k
The Straight Up "How To Draw Better" Workshop
denniskardys
236
140k
Mobile First: as difficult as doing things right
swwweet
224
9.9k
Intergalactic Javascript Robots from Outer Space
tanoku
272
27k
How to Ace a Technical Interview
jacobian
279
23k
The Invisible Side of Design
smashingmag
301
51k
[RailsConf 2023] Rails as a piece of cake
palkan
57
5.8k
Building a Modern Day E-commerce SEO Strategy
aleyda
43
7.6k
Done Done
chrislema
185
16k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
31
2.2k
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が参照できていない 例外を投げる