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
FlutterとMaterialYouの対応状況について
Search
ryo
November 10, 2021
Technology
0
60
FlutterとMaterialYouの対応状況について
https://yuruhachi-it.connpass.com/event/227859/
ryo
November 10, 2021
Tweet
Share
More Decks by ryo
See All by ryo
Firebase Test Labを紹介
kawa1214
0
120
【Flutter】Themeを活用して 統一感のあるデザインにする
kawa1214
0
150
Other Decks in Technology
See All in Technology
RubyのWebアプリケーションを50倍速くする方法 / How to Make a Ruby Web Application 50 Times Faster
hogelog
3
950
EventHub Startup CTO of the year 2024 ピッチ資料
eventhub
0
130
個人でもIAM Identity Centerを使おう!(アクセス管理編)
ryder472
4
240
飲食店データの分析事例とそれを支えるデータ基盤
kimujun
0
210
Adopting Jetpack Compose in Your Existing Project - GDG DevFest Bangkok 2024
akexorcist
0
120
アジャイルでの品質の進化 Agile in Motion vol.1/20241118 Hiroyuki Sato
shift_evolve
0
180
"とにかくやってみる"で始めるAWS Security Hub
maimyyym
2
100
Mastering Quickfix
daisuzu
1
110
組織成長を加速させるオンボーディングの取り組み
sudoakiy
2
220
iOS/Androidで同じUI体験をネ イティブで作成する際に気をつ けたい落とし穴
fumiyasac0921
1
110
SREが投資するAIOps ~ペアーズにおけるLLM for Developerへの取り組み~
takumiogawa
2
480
ノーコードデータ分析ツールで体験する時系列データ分析超入門
negi111111
0
430
Featured
See All Featured
Designing the Hi-DPI Web
ddemaree
280
34k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
93
16k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
8
900
Fantastic passwords and where to find them - at NoRuKo
philnash
50
2.9k
Git: the NoSQL Database
bkeepers
PRO
427
64k
Scaling GitHub
holman
458
140k
[RailsConf 2023] Rails as a piece of cake
palkan
52
4.9k
Adopting Sorbet at Scale
ufuk
73
9.1k
Speed Design
sergeychernyshev
25
620
Facilitating Awesome Meetings
lara
50
6.1k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
232
17k
For a Future-Friendly Web
brad_frost
175
9.4k
Transcript
Material Youͱ FlutterͷରԠঢ়گʹ͍ͭͯ
FlutterͱϚςϦΞϧσβΠϯ • FlutterΛ͍ͬͯΔͱMaterial͕ࢁͰͯ͘Δ →ϚςϦΞϧσβΠϯʹೖ • Material You͕ग़ͨ
→Կͱͳͦ͘͠͏ɾɾɾ
ௐͯΈ·ͨ͠ʂ
ϚςϦΞϧσβΠϯ • ༷ʑͳϓϥοτϑΥʔϜσόΠεͰߴ࣭ͷମݧΛߏங͢Δ ͨΊͷࢧԉΛ͢ΔσβΠϯγεςϜ
σβΠϯγεςϜͱʁ • σβΠϯͷݪଇ֓೦ͷϧʔϧ ҙࢥܾఆΛखॿ͚͠ɺϢʔβʹྑ͍ମݧΛ͑Δ Typography / Color /
Navigation …
Material You • ύʔιφϥΠζ͞ΕͨUI • ؙΈΛଳͼͨ֯ • ΞμϓςΟϒσβΠϯ ͳͲ…
DynamicColor นࢴͷબʹ߹Θͤͯ৭ΛੜʢAndroid 12Ҏ্ͷΈʣ
ColorSystemͷҧ͍ Material Design 2 Material You
Material Design 2 ColorSystem • PrimarySecondary ͷಛͱͳΔ৭ എܠɺද໘ɺΤϥʔ
Material Design 3 ColorSystem .1 • Primary FAB,ཱͨͤΔϘλϯɺΞΫςΟϒͳঢ়ଶɺӨ(ߴ͞) Secondary
ϑΟϧλʔTipͳͲͷ͋·Γཱͨͳ͍ཁૉ
Material Design 3 ColorSystem .2 • Teriary Primary,Secondryͷόϥϯε ೖྗϑΟʔϧυͳͲʹ༻͍ΒΕΔ
Typographyͷҧ͍ Material Design 2 Material You
Typographyͷҧ͍ Material You
Component - AppBar Material Design 2 Material You
Component - NavigationBar Material Design 2 Material You
Component - Ϙλϯ Material Design 2 Material You
Component - Chips Material Design 2 Material You
FlutterͷରԠํ(ఆ) • Material Youͷಋೖํݕ౼த • Material 2(1Ҏ্αϙʔτ͞ΕΔ)
• ৄ͘͠ʂhttps://github.com/ fl utter/ fl utter/projects/211
෦తʹରԠ͞Ε͍ͯΔ NavigationBarΛհ
͓ΘΓʹ • Flutterʹ͓͚ΔϦϦʔε༧ఆܾ·͍ͬͯͳ͍͕αϙʔτ ͞ΕΔ • Material21Ҏ্αϙʔτ͞ΕΔ༧ఆͷͨΊɺ͙͢ʹରԠ͢ Δඞཁͳ͍ • σβΠϯγεςϜͷ͓ӄͰָ͕ग़དྷ͍ͯΔͷͰɺରԠ͍͖ͯ͠ ͍ͨؾ࣋ͪ
͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ