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
Android Studio 3.0 ハンズオン : LayoutEditor & Const...
Search
Yuki Anzai
October 09, 2017
Technology
13
2.5k
Android Studio 3.0 ハンズオン : LayoutEditor & ConstraintLayout
DevFest Tokyo 2017 #devfest17
https://gdg-tokyo.connpass.com/event/66236/
Yuki Anzai
October 09, 2017
Tweet
Share
More Decks by Yuki Anzai
See All by Yuki Anzai
What’s new in Android development tools
yanzm
0
770
Google I/O 2025 Keynote & Developer Keynote Overview
yanzm
0
130
Coding Agent を使って Android アプリを作ってみる / Let's try using coding agent for Android app development
yanzm
0
150
MediaPipe と ML Kit ってどう ちがうの? / What is the difference between MediaPipe and ML Kit?
yanzm
0
1.2k
アプリをリリースできる状態に保ったまま 段階的にリファクタリングするための 戦略と戦術 / Strategies and tactics for incremental refactoring
yanzm
8
5.2k
Kotlinらしいコードを書こう - Convert Java File to Kotlin File のあとにやること / What to do after Convert Java File to Kotlin File
yanzm
1
5.7k
個人アプリ開発 (メンテナンス) 14年の歴史 / My personal app development history
yanzm
1
940
Material 3 やめました / Good-bye M3 design system
yanzm
4
8.8k
Compose Multiplatform で Bluesky のクライアント作ってみた / Bluesky client with Compose Multiplatform
yanzm
0
680
Other Decks in Technology
See All in Technology
PdM業務における使い分け
shinshiro
0
580
SREを知らずに SREマネージャーになった話 / How I Became an SRE Manager Without Knowing What SRE Is
moneyforward
0
300
スプリントレビューを効果的にするために
miholovesq
9
1.6k
地図と生成AI
nakasho
0
690
本当にわかりやすいAIエージェント入門
segavvy
10
5.9k
20250718_ITSurf_“Bet AI”を支える文化とコストマネジメント
helosshi
1
210
Snowflake のアーキテクチャは本当に筋がよかったのか / Data Engineering Study #30
indigo13love
0
250
P2P通信の標準化 WebRTCを知ろう
faithandbrave
6
2.3k
経験がないことを言い訳にしない、 AI時代の他領域への染み出し方
parayama0625
0
130
MCP とマネージド PaaS で実現する大規模 AI アプリケーションの高速開発
nahokoxxx
1
1.4k
QuickBooks®️ Customer®️ USA Contact Numbers: Complete 2025 Support Guide
qbsupportinfo
0
100
DatabricksのOLTPデータベース『Lakebase』に詳しくなろう!
inoutk
0
110
Featured
See All Featured
Being A Developer After 40
akosma
90
590k
StorybookのUI Testing Handbookを読んだ
zakiyama
30
5.9k
Measuring & Analyzing Core Web Vitals
bluesmoon
7
530
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
Typedesign – Prime Four
hannesfritz
42
2.7k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
GitHub's CSS Performance
jonrohan
1031
460k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
10
990
Intergalactic Javascript Robots from Outer Space
tanoku
271
27k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
331
22k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.9k
Embracing the Ebb and Flow
colly
86
4.8k
Transcript
"OESPJE4UVEJP عٝؤؔٝ ְׂ֮ײֹ!%FW'FTU5PLZP -BZPVU&EJUPS$POTUSBJOU-BZPVU
HPPHM%C,I-:
˖ CMPH:".ך꧟鎸䌘 ˖ ZBO[NCMPHTQPUDPN ˖ UXJUUFS!ZBO[Nװׂ ˖ V1IZDB*OD 吳䒭⠓爡ؐؿ؍ؕ
˖ (56((JSMTHUVHHJSMTKQ ˖ ESPJEHJSMTIUUQTESPJEHJSMTDPOOQBTTDPN ͋Μ͍͟Ώ͖
-BZPVU&EJUPS$POTUSBJOU-BZPVU ד 5XJUUFSך״ֲז6*ꥡ㾴ד⡲
倜׃ְفٗآؙؑز ⡲
None
None
None
None
$POTUSBJOU-BZPVU
$POTUSBJOU-BZPVU ˖ "OESPJE4VQQPSU-JCSBSZך♧א ˖ 7JFX(SPVQ ˖ 3FMBUJWF-BZPVU넝堣腉ח׃䠬ׄ ˖ ⵖ秈$POTUSBJOUדꂁ縧㜥䨽寸
ⵖ秈䭷㹀ׅ ˖ 㶨ؽُ٦חⵖ秈䭷㹀 ˖ ⵖ秈ח״ꂁ縧㜥䨽ָ寸ת app:layout_constraintXXXXXXX
NBUDI DPOTUSBJOU ˖ $POTUSBJOU-BZPVUך㶨ؽُ٦דכNBUDI@QBSFOU כ⢪זְ ˖ EQNBUDIDPOTUSBJOU ˖ ⵖ秈弫ׅ朐䡾ד剑䎢ָ
CVJMEHSBEMF ך鏣㹀 implementation 'com.android.support.constraint:constraint-layout:1.0.2' compile 'com.android.support.constraint:constraint-layout:1.0.2' HSBEMFY⟃꣬ HSBEMFY⟃
BQQCVJMEHSBEMF
BDUJWJUZ@NBJOYNMֻ
ػٖحز 1BMFUUF
سٓحؚسٗحف
㾩䚍 "UUSJCVUFT
%FTJHO4VSGBDFך㢌刿 %FTJHO #MVFQSJOU
%FTJHO4VSGBDFך㢌刿 %FTJHO
%FTJHO4VSGBDFך㢌刿 #MVFQSJOU
%FGBVMU.BSHJOT ⵖ秈אֽהֹח荈⹛ד鏣㹀ׁو٦آٝ
5XJUUFSך״ֲז6* ꥡ㾴ד⡲
5FYU7JFXꤐׅ 鼅䫛׃גEFMFUF
None
*NBHF7JFX鷄⸇ׅ 鼅䫛 سٓحؚسٗحف
鼅䫛 ؙٔحؙ
None
عٝسٕ 筮سٓحؚ׃ג$POTUSBJOU鏣㹀 饔ؙٔحؙ׃ג$POTUSBJOU鍑ꤐ
%FGBVMU.BSHJOTחׅ ؙٔحؙ ؙٔحؙ
*NBHF7JFX䊩♳חꂁ縧ׅ ♳ךعٝسٕسٓحؚ׃ג♳畭 דꨄׅ 䊩ךعٝسٕسٓحؚ׃ג䊩畭 דꨄׅ
None
5FYU7JFX鷄⸇ׅ 鼅䫛 سٓحؚسٗحف
None
5FYU7JFX*NBHF7JFXך〸חꂁ縧ׅ ♳ךعٝسٕسٓحؚ׃ג *NBHF7JFXך♳ךعٝسٕ דꨄׅ 䊩ךعٝسٕسٓحؚ׃ג *NHBF7JFXך〸ךعٝسٕ דꨄׅ
None
5FYU7JFXךو٦آٝ㢌刿ׅ ؙٔحؙ ؙٔحؙ
None
5FYU"QQFBSBODF㢌刿ׅ ؙٔحؙ ؙٔحؙ
None
فٖؽُ٦欽ך俑㶵㢌刿ׅ ؙٔحؙ ؙٔحؙ
None
劤俑欽ך5FYU7JFX鷄⸇ׅ
劤俑欽ך5FYU7JFXꂁ縧ׅ ♳ךعٝسٕ ̔せ欽ך5FYU7JFXך♴畭 䊩ךعٝسٕ ̔せ欽ך5FYU7JFXך䊩畭 〸ךعٝسٕ ̔$POTUSBJOU-BZPVUך〸畭
None
XJEUINBUDIDPOTUSBJOUחׅ ؙٔحؙ
8SBQ$POUFOU XSBQ@DPOUFOU 'JYFE 99EQ .BUDI$POTUSBJOUT EQ
None
䊩ךو٦آٝEQחׅ
7FDUPS%SBXBCMF鷄⸇ׅ 鼅䫛 'JMF/FX7FDUPS"TTFUؙٔحؙ
ؙٔحؙ
Ⰵ⸂ 鼅䫛 ؙٔحؙ
ؙٔحؙ
ؙٔحؙ
GBWPSJUF TIBSF TFUUJOHT 鷄⸇
*NBHF7JFX⦐ 5FYU7JFX⦐鷄⸇ׅ 埆♧ח⚛ץ
DIBJOחׅ ؙٔحؙ Ⰻ鼅䫛ׅ
None
⦐ך5FYU7JFXך䌴NBUDIDPOTUSBJOUחׅ
%FGBVMU.BSHJOTחׅ
DIBJOך䊩〸畭劤俑חׇ֮
♳♴GBWPSJUFחׇ֮
GBWPSJUFך♳畭劤俑ך♴畭חאז־
儗欽ך5FYU7JFXꂁ縧ׅ ؙٔحؙ CBTFMJOF欽ךعٝسٕ
CBTFMJOFせחさׇ
JE欽ך5FYU7JFXꂁ縧ׅ CBTFMJOFせחさׇ䊩〸せה儗חאז־
؟؎ؤװ⡭涯זו锃侭 ׃ג㸣䧭ׇׁ״ֲ
ֶתֽ
涫㜥➂暟 $POTUSBJOU-BZPVU $POTUSBJOU-BZPVUך㶨ؽُ٦ד ⡘縧寸״ֲה׃גְך $POTUSBJOU-BZPVUך➭ך㶨ؽُ٦ ! JEBODIPS
♳畭 $POTUSBJOU-BZPVU ח䲧ִ app:layout_constraintTop_toTopOf="parent" )FMMP
♴畭 $POTUSBJOU-BZPVU ח䲧ִ app:layout_constraintBottom_toBottomOf="parent" )FMMP
䊩畭 $POTUSBJOU-BZPVU ח䲧ִ app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintStart_toStartOf="parent" )FMMP
〸畭 $POTUSBJOU-BZPVU ח䲧ִ app:layout_constraintRight_toRightOf="parent" app:layout_constraintEnd_toEndOf="parent" )FMMP
♳♴ $POTUSBJOU-BZPVU ך⚥㣛ח䲧ִ app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" )FMMP
♳♴ך嫰䭷㹀ׅ app:layout_constraintVertical_bias="0.3" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" )FMMP
䊩〸 $POTUSBJOU-BZPVU ך⚥㣛ח䲧ִ app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" )FMMP
䊩〸ך嫰䭷㹀ׅ app:layout_constraintHorizontal_bias="0.3" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" )FMMP
$POTUSBJOU-BZPVU ך⚥㣛ח䲧ִ app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" )FMMP
♳♴ $POTUSBJOU-BZPVU ְםְח䎢־ android:layout_height="0dp" app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent" EQNBUDIDPOTUSBJOU )FMMP
䊩〸 $POTUSBJOU-BZPVU ְםְח䎢־ android:layout_width="0dp" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" )FMMP EQNBUDIDPOTUSBJOU
$POTUSBJOU-BZPVU ְםְח䎢־ android:layout_width="0dp" android:layout_height="0dp" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toTopOf="parent" )FMMP
NBUDI DPOTUSBJOU ךהֹך NBYJNVN TJ[F android:layout_width="0dp" android:layout_height="0dp" … app:layout_constraintWidth_max="300dp" app:layout_constraintHeight_max="100dp"
EQ EQ )FMMP
NBUDI DPOTUSBJOU ךהֹ XSBQ@DPOUFOU ך״ֲחׅ android:layout_width="0dp" android:layout_height="0dp" … app:layout_constraintWidth_default="wrap" app:layout_constraintHeight_default="wrap"
)FMMP
NBUDI DPOTUSBJOU XSBQ ךהֹך NJOJNVN TJ[F android:layout_width="0dp" android:layout_height="0dp" … app:layout_constraintWidth_min="100dp"
app:layout_constraintHeight_min="100dp" EQ EQ )FMMP
♳畭➭ך 7JFX ך♳畭ח䲧ִ app:layout_constraintTop_toTopOf="@id/anchor"
♳畭➭ך 7JFX ך♴畭ח䲧ִ app:layout_constraintTop_toBottomOf="@id/anchor"
♴畭➭ך 7JFX ך♴畭ח䲧ִ app:layout_constraintBottom_toBottomOf="@id/anchor"
♴畭➭ך 7JFX ך♳畭ח䲧ִ app:layout_constraintBottom_toTopOf="@id/anchor"
CBTFMJOF ➭ך 7JFX ך CBTFMJOF ח䲧ִ app:layout_constraintBaseline_toBaselineOf="@id/anchor" " "
䊩畭➭ך 7JFX ך䊩畭ח䲧ִ app:layout_constraintLeft_toLeftOf="@id/anchor" or app:layout_constraintStart_toStartOf="@id/anchor"
䊩畭➭ך 7JFX ך〸畭ח䲧ִ app:layout_constraintLeft_toRightOf="@id/anchor" or app:layout_constraintStart_toEndOf="@id/anchor"
〸畭➭ך 7JFX ך〸畭ח䲧ִ app:layout_constraintRight_toRightOf="@id/anchor" or app:layout_constraintEnd_toEndOf="@id/anchor"
〸畭➭ך 7JFX ך䊩畭ח䲧ִ app:layout_constraintRight_toLeftOf="@id/anchor" or app:layout_constraintEnd_toStartOf="@id/anchor"
♳♴➭ך 7JFX ך⚥㣛ח䲧ִ app:layout_constraintTop_toTopOf="@id/anchor" app:layout_constraintBottom_toBottomOf="@id/anchor"
䊩〸➭ך 7JFX ך⚥㣛ח䲧ִ app:layout_constraintLeft_toLeftOf="@id/anchor" app:layout_constraintRight_toRightOf="@id/anchor" or app:layout_constraintStart_toStartOf="@id/anchor" app:layout_constraintEnd_toEndOf="@id/anchor"
7JFX ך㣐ֹׁ嫰ד䭷㹀ׅ android:layout_width="0dp" android:layout_height="0dp" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintDimensionRatio="h,2:1" or app:layout_constraintDimensionRatio="w,1:2"
(VJEFMJOF
HVJEFMJOF <android.support.constraint.Guideline android:id="@+id/guideline" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="vertical" app:layout_constraintGuide_percent="0.5"/> app:layout_constraintGuide_begin="20dp" app:layout_constraintGuide_end="20dp"
HVJEFMJOF חさׇגꂁ縧ׅ android:layout_width="0dp" app:layout_constraintLeft_toRightOf="@id/guideline1" app:layout_constraintRight_toLeftOf="@id/guideline2" ! JEHVJEFMJOF ! JEHVJEFMJOF
HPOF NBSHJO
HPOF.BSHJO )FMMP )FMMP )FMMP android:layout_marginLeft="16dp" app:layout_constraintLeft_toRightOf="@id/anchor" app:layout_goneMarginLeft="0dp" BODIPSךWJTJCJMJUZHPOF ⵖ秈⯓ך7JFXךWJTJCJMJUZָHPOFהֹח⢪ NBHJO⦼
BODIPSךWJTJCJMJUZWJTJCMF EQ
$IBJO
DIBJO )FMMP )FMMP )FMMP ✼ְחⵖ秈׃֮גְ app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toLeftOf="@+id/view2" WJFX app:layout_constraintLeft_toRightOf="@+id/view1" app:layout_constraintRight_toLeftOf="@+id/view3"
WJFX app:layout_constraintLeft_toRightOf="@+id/view2" app:layout_constraintRight_toRightOf="parent" WJFX ! JEWJFX ! JEWJFX ! JEWJFX
DIBJO4UZMF )FMMP )FMMP )FMMP app:layout_constraintHorizontal_chainStyle="spread" )FMMP )FMMP )FMMP app:layout_constraintHorizontal_chainStyle="packed" )FMMP
)FMMP )FMMP app:layout_constraintHorizontal_chainStyle="spread_inside" WJFXח䭷㹀ׅ
DIBJO TQSFBE NBUDI DPOTUSBJOU )FMMP )FMMP )FMMP android:layout_width="0dp" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toLeftOf="@+id/view2"
app:layout_constraintHorizontal_chainStyle="spread" WJFX android:layout_width="0dp" app:layout_constraintLeft_toRightOf="@+id/view1" app:layout_constraintRight_toLeftOf="@+id/view3" WJFX android:layout_width="0dp" app:layout_constraintLeft_toRightOf="@+id/view2" app:layout_constraintRight_toRightOf="parent" WJFX
DIBJO TQSFBE NBUDI DPOTUSBJOU XFJHIU )FMMP )FMMP )FMMP android:layout_width="0dp" app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="@+id/view2" app:layout_constraintHorizontal_chainStyle="spread" app:layout_constraintHorizontal_weight="2" WJFX android:layout_width="0dp" app:layout_constraintLeft_toRightOf="@+id/view1" app:layout_constraintRight_toLeftOf="@+id/view3" app:layout_constraintHorizontal_weight="1" WJFX android:layout_width="0dp" app:layout_constraintLeft_toRightOf="@+id/view2" app:layout_constraintRight_toRightOf="parent" app:layout_constraintHorizontal_weight="1" WJFX
DIBJO QBDLFE CJBT app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toLeftOf="@+id/view2" app:layout_constraintHorizontal_chainStyle="packed" app:layout_constraintHorizontal_bias="0.3" WJFX app:layout_constraintLeft_toRightOf="@+id/view1" app:layout_constraintRight_toLeftOf="@+id/view3"
WJFX app:layout_constraintLeft_toRightOf="@+id/view2" app:layout_constraintRight_toRightOf="parent" WJFX )FMMP )FMMP )FMMP