Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up
for free
ConstraintLayout再入門
Takahiro Shimokawa
March 22, 2017
Programming
2
2.3k
ConstraintLayout再入門
potatotips#38での発表資料です。
Takahiro Shimokawa
March 22, 2017
Tweet
Share
More Decks by Takahiro Shimokawa
See All by Takahiro Shimokawa
androhi
0
720
androhi
0
120
androhi
1
390
androhi
0
670
androhi
0
400
androhi
2
1.9k
androhi
1
2.3k
androhi
1
980
androhi
0
330
Other Decks in Programming
See All in Programming
panini
1
160
manfredsteyer
PRO
0
110
suzukiot
0
250
grapecity_dev
0
190
takara9
0
150
takahi5
1
430
rarous
0
170
legalforce
PRO
1
710
manfredsteyer
PRO
0
150
gernotstarke
0
380
takutakahashi
3
260
koheisakata
0
100
Featured
See All Featured
samlambert
237
10k
tanoku
86
8.6k
morganepeng
18
1.2k
carmenhchung
31
1.5k
revolveconf
200
9.7k
shlominoach
176
7.5k
zenorocha
296
40k
orderedlist
PRO
328
36k
kneath
294
39k
dougneiner
55
5.4k
eitanlees
112
10k
kastner
54
1.9k
Transcript
ConstraintLayout ࠶ೖ Takahiro Shimokawa in potatotips #38 by @androhi 1
ࣗݾհ • @androhi • FiNC inc. • Android ΞϓϦ։ൃ୲ •
DroidKaigi ӡӦελοϑ by @androhi 2
࣍ 1. ConstraintLayoutͬͯԿ͚ͩͬʁ 2. ConstraintLayoutͷجຊ 3. AndroidStudio2.3ͰՃΘͬͨศརػೳ by @androhi 3
1. ConstraintLayoutͬͯԿ͚ͩͬʁ • RelativeLayoutͷ͍ͭ͢͝ • શͯͷϏϡʔ͕૬ରҐஔͰஔ͞ΕΔ • ΑΓॊೈͳࢦఆ͕Մೳ • LayoutEditorͰ؆୯ʹ͑ΔΑ͏ʹͳ͍ͬͯΔ
(From Build a Responsive UI with ConstraintLayout) by @androhi 4
ඞཁͳͷ ͦͷ1 ConstraintLayout library by @androhi 5
by @androhi 6
ඞཁͳͷ ͦͷ2 build.gradleͷهड़ by @androhi 7
dependencies { compile 'com.android.support.constraint:constraint-layout:1.0.2' } by @androhi 8
2. ConstraintLayoutͷجຊ • ৽͍͠Layout Editor • ੍ΛՃ͢Δ play-ground : ConstraintLayout
Example by @androhi 9
৽͍͠Layout Editor by @androhi 10
by @androhi 11
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android" ... android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.example.android.constraintlayoutexamples.MainActivity"> <android.support.constraint.ConstraintLayout android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="wrap_content">
<Button android:id="@+id/button" ... android:text="@string/centering_views" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toTopOf="parent" tools:layout_constraintLeft_creator="1" tools:layout_constraintRight_creator="1" /> ... by @androhi 12
੍ΛՃ͢Δ by @androhi 13
ʢҾ༻ : Add a constraintʣ by @androhi 14
3. AndroidStudio2.3ͰՃΘͬͨ3ͭͷศརػ ೳ • ৽ςϯϓϨʔτ • Viewͷେ͖͞ΛΞεϖΫτൺͰઃఆ • Viewಉ࢜ΛͰܨ͍ͩΑ͏ͳ੍ޚ by
@androhi 15
৽ςϯϓϨʔτ by @androhi 16
by @androhi 17
by @androhi 18
Viewͷେ͖͞ΛΞεϖΫτൺͰઃఆ by @androhi 19
by @androhi 20
Viewಉ࢜ΛͰܨ͍ͩΑ͏ͳ੍ޚ by @androhi 21
ʢҾ༻ : Control linear groups with a chainʣ by @androhi
22
·ͱΊ • ConstraintLayoutϨεϙϯγϒϧͳUIΛ࡞ΔͨΊͷػೳ͕ ๛ • Viewʹ੍ΛՃ͢ΔͷͰɺView֊Λϑϥοτʹอͯ Δ • LayoutEditor্ͷૢ࡞׳Ε͕ඞཁͳͷͰɺ·ͣαϯϓϧ Ͱ༡ΜͰΈΔ
by @androhi 23
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝ ·ͨ͠ by @androhi 24