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
HiroYUKI Seto
February 03, 2018
Technology
0
3.8k
ノハナ社のレイアウト戦略
2018/2/9
DroidKaigi 2018 DAY02 room1 10:30~
発表の付録3
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
400
MDCの内部実装から学ぶ 表現力の高いViewの作り方
seto_hi
5
1.8k
CoordinatorLayoutのBehaviorを使い倒す
seto_hi
1
380
Jetpack Compose
seto_hi
2
760
UI改善に繋がるエンジニアの立ち回り
seto_hi
2
4.6k
MDCのButtonのCorner Family
seto_hi
1
180
MDCのBottomAppBarのShadowの実現方法
seto_hi
0
950
Other Decks in Technology
See All in Technology
Cursor AgentによるパーソナルAIアシスタント育成入門―業務のプロンプト化・MCPの活用
os1ma
15
5.9k
白金鉱業Meetup_Vol.18_AIエージェント時代のUI/UX設計
brainpadpr
1
230
AIと共に乗り越える、 入社後2ヶ月の苦労と学習の軌跡
sai_kaneko
0
130
AndroidアプリエンジニアもMCPを触ろう
kgmyshin
1
220
Dataverseの検索列について
miyakemito
1
130
更新系と状態
uhyo
8
2k
SREからゼロイチプロダクト開発へ ー越境する打席の立ち方と期待への応え方ー / Product Engineering Night #8
itkq
2
1k
持続可能なドキュメント運用のリアル: 1年間の成果とこれから
akitok_
1
230
10ヶ月かけてstyled-components v4からv5にアップデートした話
uhyo
5
370
AWSのマルチアカウント管理 ベストプラクティス最新版 2025 / Multi-Account management on AWS best practice 2025
ohmura
4
340
日経電子版 for Android の技術的課題と取り組み(令和最新版)/android-20250423
nikkei_engineer_recruiting
1
500
読んで学ぶ Amplify Gen2 / Amplify と CDK の関係を紐解く #jawsug_tokyo
tacck
PRO
1
260
Featured
See All Featured
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
52
2.4k
Build your cross-platform service in a week with App Engine
jlugia
230
18k
Mobile First: as difficult as doing things right
swwweet
223
9.6k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
13
1.4k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.2k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
The Straight Up "How To Draw Better" Workshop
denniskardys
232
140k
The Pragmatic Product Professional
lauravandoore
33
6.6k
Art, The Web, and Tiny UX
lynnandtonic
298
20k
How to Think Like a Performance Engineer
csswizardry
23
1.5k
Reflections from 52 weeks, 52 projects
jeffersonlam
349
20k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Transcript
DroidKaigi 2018付録3 ノハナ社 の レイアウト戦略 株式会社ノハナ 瀬戸優之 @seto_hi
ノハナ社のレイアウト戦略 • レイアウトどうしたらいいの?の ノハナ的回答 • あくまで参考 • みんな違ってみんないい
Q1 Q. レイアウトエディタ使ってます? A. 使ってません ・意図しない要素が追加されるリスクが怖い ・エンジニアが楽をしても結局はQAコストになる
・ConstraintLayoutの属性はそんなに多くないです ・覚えましょう ※eclipse時代から開発しているのでxmlに慣れすぎている
Q2 Q. レイアウトのRootはすべてConstraintLayoutですか? A. 違います ConstraintLayoutな画面は多いですが、 measure回数が少なくなることと
保守性を考えて レイアウトを組みます
Measure回数 ViewGroup Measure回数 FrameLayout 自身のMeasureSpecがEXACTLYなら1回 それ以外は2回されるViewあり LinearLayout WeightがないViewは1回 WeightをあるViewはだいたい2回 RelativeLayout
2回 ConstraintLayout Viewのサイズが固定値なら1回 そうでなければ2〜最大3回 ただし別途複数回レイアウト計算が走る
ConstraintLayout利点 • 階層が浅くなりやすい ◦ 自由度が高い ◦ だいたいのレイアウトに対応できる!すごい! • RootをConstraintLayoutにすると、 レイアウトを大幅に変更しても対応しやすい
• 多機能 ◦ Groupなど
ConstraintLayout欠点 • 簡単なレイアウトには計算が多すぎる ◦ いい感じのレイアウトではmeasureがほぼ2回走る ◦ 現状の端末では十二分に高速だとは思うが.. ▪ 簡単なレイアウトなので複雑な計算しても高速 •
記述が多い ◦ 例えば縦組みレイアウトなら LinearLayoutの方が記述も少なく処理も高速 人間の目にも優しい
ノハナ流 ViewGroup決定メソッド LinearLayout RelativeLayout CosntraintLayout 縦 or 横一直線な レイアウト レイアウトが直近で
修正される可能性が 高い RelativeLayoutでも 実現できそう YES NO でもConstraintLayoutを 使うと楽
Q3 Q. 独自ViewGroupはいっぱいありますか? A. そんなには多くないです メンテナンス性を考えるとあまり作るべきでない ・どうしても既存のViewGroupでは実現できない
・measureとlayoutが複雑になりすぎない 場合にのみ作るようにしています