Tweet
Tweet

Slide 1

Slide 1 text

ConstraintLayout ࠶ೖ໳ Takahiro Shimokawa in potatotips #38 by @androhi 1

Slide 2

Slide 2 text

ࣗݾ঺հ • @androhi • FiNC inc. • Android ΞϓϦ։ൃ୲౰ • DroidKaigi ӡӦελοϑ by @androhi 2

Slide 3

Slide 3 text

໨࣍ 1. ConstraintLayoutͬͯԿ͚ͩͬʁ 2. ConstraintLayoutͷجຊ 3. AndroidStudio2.3ͰՃΘͬͨศརػೳ by @androhi 3

Slide 4

Slide 4 text

1. ConstraintLayoutͬͯԿ͚ͩͬʁ • RelativeLayoutͷ͍͢͝΍ͭ • શͯͷϏϡʔ͕૬ରҐஔͰ഑ஔ͞ΕΔ • ΑΓॊೈͳࢦఆ͕Մೳ • LayoutEditorͰ؆୯ʹ࢖͑ΔΑ͏ʹͳ͍ͬͯΔ (From Build a Responsive UI with ConstraintLayout) by @androhi 4

Slide 5

Slide 5 text

ඞཁͳ΋ͷ ͦͷ1 ConstraintLayout library by @androhi 5

Slide 6

Slide 6 text

by @androhi 6

Slide 7

Slide 7 text

ඞཁͳ΋ͷ ͦͷ2 build.gradle΁ͷهड़ by @androhi 7

Slide 8

Slide 8 text

dependencies { compile 'com.android.support.constraint:constraint-layout:1.0.2' } by @androhi 8

Slide 9

Slide 9 text

2. ConstraintLayoutͷجຊ • ৽͍͠Layout Editor • ੍໿Λ௥Ճ͢Δ play-ground : ConstraintLayout Example by @androhi 9

Slide 10

Slide 10 text

৽͍͠Layout Editor by @androhi 10

Slide 11

Slide 11 text

by @androhi 11

Slide 12

Slide 12 text

... by @androhi 12

Slide 13

Slide 13 text

੍໿Λ௥Ճ͢Δ by @androhi 13

Slide 14

Slide 14 text

ʢҾ༻ : Add a constraintʣ by @androhi 14

Slide 15

Slide 15 text

3. AndroidStudio2.3ͰՃΘͬͨ3ͭͷศརػ ೳ • ৽ςϯϓϨʔτ • Viewͷେ͖͞ΛΞεϖΫτൺͰઃఆ • Viewಉ࢜Λ࠯Ͱܨ͍ͩΑ͏ͳ੍ޚ by @androhi 15

Slide 16

Slide 16 text

৽ςϯϓϨʔτ by @androhi 16

Slide 17

Slide 17 text

by @androhi 17

Slide 18

Slide 18 text

by @androhi 18

Slide 19

Slide 19 text

Viewͷେ͖͞ΛΞεϖΫτൺͰઃఆ by @androhi 19

Slide 20

Slide 20 text

by @androhi 20

Slide 21

Slide 21 text

Viewಉ࢜Λ࠯Ͱܨ͍ͩΑ͏ͳ੍ޚ by @androhi 21

Slide 22

Slide 22 text

ʢҾ༻ : Control linear groups with a chainʣ by @androhi 22

Slide 23

Slide 23 text

·ͱΊ • ConstraintLayout͸ϨεϙϯγϒϧͳUIΛ࡞ΔͨΊͷػೳ͕ ๛෋ • Viewʹ௚઀੍໿Λ௥Ճ͢ΔͷͰɺView֊૚Λϑϥοτʹอͯ Δ • LayoutEditor্ͷૢ࡞͸׳Ε͕ඞཁͳͷͰɺ·ͣ͸αϯϓϧ Ͱ༡ΜͰΈΔ by @androhi 23

Slide 24

Slide 24 text

͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝ ·ͨ͠ by @androhi 24