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
71
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
130
【Flutter】Themeを活用して 統一感のあるデザインにする
kawa1214
0
160
Other Decks in Technology
See All in Technology
5分で紹介する生成AIエージェントとAmazon Bedrock Agents / 5-minutes introduction to generative AI agents and Amazon Bedrock Agents
hideakiaoyagi
0
220
テストアーキテクチャ設計で実現する高品質で高スピードな開発の実践 / Test Architecture Design in Practice
ropqa
3
710
Bounded Context: Problem or Solution?
ewolff
1
210
トラシューアニマルになろう ~開発者だからこそできる、安定したサービス作りの秘訣~
jacopen
2
1.5k
プロセス改善による品質向上事例
tomasagi
1
1.6k
Googleマップ/Earthが一般化した 地図タイルのイマ
mapconcierge4agu
1
200
明日からできる!技術的負債の返済を加速するための実践ガイド~『ホットペッパービューティー』の事例をもとに~
recruitengineers
PRO
3
100
株式会社EventHub・エンジニア採用資料
eventhub
0
4.2k
PL900試験から学ぶ Power Platform 基礎知識講座
kumikeyy
0
110
サーバーレスアーキテクチャと生成AIの融合 / Serverless Meets Generative AI
_kensh
12
3k
Culture Deck
optfit
0
330
まだ間に合う! エンジニアのための生成AIアプリ開発入門 on AWS
minorun365
PRO
4
580
Featured
See All Featured
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
[RailsConf 2023] Rails as a piece of cake
palkan
53
5.2k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
49
2.3k
Building a Scalable Design System with Sketch
lauravandoore
460
33k
It's Worth the Effort
3n
184
28k
Done Done
chrislema
182
16k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
33
2.1k
Six Lessons from altMBA
skipperchong
27
3.6k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
8
270
Building a Modern Day E-commerce SEO Strategy
aleyda
38
7.1k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.1k
Embracing the Ebb and Flow
colly
84
4.6k
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Ҏ্αϙʔτ͞ΕΔ༧ఆͷͨΊɺ͙͢ʹରԠ͢ Δඞཁͳ͍ • σβΠϯγεςϜͷ͓ӄͰָ͕ग़དྷ͍ͯΔͷͰɺରԠ͍͖ͯ͠ ͍ͨؾ࣋ͪ
͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ