FlutterとMaterialYouの対応状況について

https://yuruhachi-it.connpass.com/event/227859/

Transcript

1. Material Youͱ 
 FlutterͷରԠঢ়گʹ͍ͭͯ
2. FlutterͱϚςϦΞϧσβΠϯ • FlutterΛ࢖͍ͬͯΔͱMaterial͕୔ࢁͰͯ͘Δ 
 →ϚςϦΞϧσβΠϯʹೖ໳ 
 
 • Material You͕ग़ͨ 
 →Կͱͳ͘೉ͦ͠͏ɾɾɾ
3. ௐ΂ͯΈ·ͨ͠ʂ
4. ϚςϦΞϧσβΠϯ • ༷ʑͳϓϥοτϑΥʔϜ΍σόΠεͰߴ඼࣭ͷମݧΛߏங͢Δ ͨΊͷࢧԉΛ͢ΔσβΠϯγεςϜ
5. σβΠϯγεςϜͱ͸ʁ • σβΠϯͷݪଇ΍֓೦ͷϧʔϧ 
 ҙࢥܾఆΛखॿ͚͠ɺϢʔβʹྑ͍ମݧΛ఻͑Δ 
 Typography / Color / Navigation …
6. Material You • ύʔιφϥΠζ͞ΕͨUI • ؙΈΛଳͼͨ֯ • ΞμϓςΟϒσβΠϯ 
 ͳͲ…
7. DynamicColor นࢴͷબ୒ʹ߹Θͤͯ৭Λੜ੒ʢAndroid 12Ҏ্ͷΈʣ
8. ColorSystemͷҧ͍ Material Design 2 Material You
9. Material Design 2 ColorSystem • Primary΍Secondary ੡඼ͷಛ௃ͱͳΔ৭ 
 എܠɺද໘ɺΤϥʔ
10. Material Design 3 ColorSystem .1 • Primary FAB,໨ཱͨͤΔϘλϯɺΞΫςΟϒͳঢ়ଶɺӨ(ߴ͞) 
 Secondary ϑΟϧλʔTipͳͲͷ͋·Γ໨ཱͨͳ͍ཁૉ
11. Material Design 3 ColorSystem .2 • Teriary Primary,Secondryͷόϥϯε 
 ೖྗϑΟʔϧυͳͲʹ༻͍ΒΕΔ
12. Typographyͷҧ͍ Material Design 2 Material You
13. Typographyͷҧ͍ Material You
14. Component - AppBar Material Design 2 Material You
15. Component - NavigationBar Material Design 2 Material You
16. Component - Ϙλϯ Material Design 2 Material You
17. Component - Chips Material Design 2 Material You
18. FlutterͷରԠํ਑(࢑ఆ) • Material Youͷಋೖํ਑͸ݕ౼த 
 
 
 • Material 2͸(1೥Ҏ্αϙʔτ͞ΕΔ) • ৄ͘͠͸ʂhttps://github.com/ fl utter/ fl utter/projects/211
19. ෦෼తʹରԠ͞Ε͍ͯΔ 
 NavigationBarΛ঺հ
20. ͓ΘΓʹ • Flutterʹ͓͚ΔϦϦʔε༧ఆ೔͸ܾ·͍ͬͯͳ͍͕αϙʔτ͸ ͞ΕΔ • Material2΋1೥Ҏ্αϙʔτ͞ΕΔ༧ఆͷͨΊɺ͙͢ʹରԠ͢ Δඞཁ͸ͳ͍ • σβΠϯγεςϜͷ͓ӄͰָ͕ग़དྷ͍ͯΔͷͰɺରԠ͍͖ͯ͠ ͍ͨؾ࣋ͪ
21. ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ