$30 off During Our Annual Pro Sale. View Details »

MDCのButtonのCorner Family

Avatar for HiroYUKI Seto HiroYUKI Seto
February 08, 2019
Technology
1
220

MDCのButtonのCorner Family

2019/2/8
null

Avatar for HiroYUKI Seto

HiroYUKI Seto

February 08, 2019
Tweet

More Decks by HiroYUKI Seto

See All by HiroYUKI Seto
Androidアプリの 安全なリファクタリングを行うパターン集
Avatar for HiroYUKI Seto seto_hi
2
5k
UI TestやVisual Regression Testを コスパ良くやる
Avatar for HiroYUKI Seto seto_hi
3
1.9k
事業支援というお仕事
Avatar for HiroYUKI Seto seto_hi
0
430
MDCの内部実装から学ぶ
表現力の高いViewの作り方
Avatar for HiroYUKI Seto seto_hi
5
1.8k
CoordinatorLayoutのBehaviorを使い倒す
Avatar for HiroYUKI Seto seto_hi
1
420
Jetpack Compose
Avatar for HiroYUKI Seto seto_hi
2
850
UI改善に繋がるエンジニアの立ち回り
Avatar for HiroYUKI Seto seto_hi
2
4.7k
MDCのBottomAppBarのShadowの実現方法
Avatar for HiroYUKI Seto seto_hi
0
1k
Kyashは なぜ使いやすいのか
Avatar for HiroYUKI Seto seto_hi
1
2.5k

Other Decks in Technology

See All in Technology
AR Guitar: Expanding Guitar Performance from a Live House to Urban Space
Avatar for Ekito ekito_station
0
210
「もしもデータ基盤開発で『強くてニューゲーム』ができたなら今の僕はどんなデータ基盤を作っただろう」
Avatar for AEON aeonpeople
0
250
SREが取り組むデプロイ高速化 ─ Docker Buildを最適化した話
Avatar for capytan capytan
0
140
【開発を止めるな】機能追加と並行して進めるアーキテクチャ改善/Keep Shipping: Architecture Improvements Without Pausing Dev
Avatar for 株式会社ビットキー / Bitkey Inc. bitkey
PRO
1
130
ActiveJobUpdates
Avatar for Kuniaki IGARASHI igaiga
1
320
Agent Skillsがハーネスの垣根を超える日
Avatar for Gota gotalab555
6
4.3k
2025年のデザインシステムとAI 活用を振り返る
Avatar for Tech Leverages leveragestech
0
230
日本Rubyの会: これまでとこれから
Avatar for Koji SHIMADA snoozer05
PRO
6
240
"人"が頑張るAI駆動開発
Avatar for yoko yokomachi
1
170
MySQLとPostgreSQLのコレーション / Collation of MySQL and PostgreSQL
Avatar for とみたまさひろ tmtms
1
1.2k
Authlete で実装する MCP OAuth 認可サーバー #CIMD の実装を添えて
Avatar for watahani watahani
0
180
マイクロサービスへの5年間 ぶっちゃけ何をしてどうなったか
Avatar for Tomohiro Hashidate joker1007
20
7.7k

Featured

See All Featured
技術選定の審美眼（2025年版） / Understanding the Spiral of Technologies 2025 edition
Avatar for Takuto Wada twada
PRO
115
93k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
35
3.3k
Fashionably flexible responsive web design (full day workshop)
Avatar for Andy Clarke malarkey
407
66k
Keith and Marios Guide to Fast Websites
Avatar for Keith Pitt keithpitt
413
23k
State of Search Keynote: SEO is Dead Long Live SEO
Avatar for Ryan Jones ryanjones
0
69
Leveraging Curiosity to Care for An Aging Population
Avatar for Cassini Nazir cassininazir
1
130
A designer walks into a library…
Avatar for Paul Jervis Heath pauljervisheath
210
24k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
35
2.3k
KATA
Avatar for Megan Lloyd mclloyd
PRO
33
15k
New Earth Scene 8
Avatar for Sydney Stone popppiees
0
1.2k
Marketing to machines
Avatar for Jono Alderson jonoalderson
1
4.3k
The SEO identity crisis: Don't let AI make you average
Avatar for Varn varn
0
38

Transcript

  1. גࣜձࣾϊϋφɹ੉ށ༏೭ .%$ͷ#VUUPOͷ $PSOFS'BNJMZ

  2. ੉ށ༏೭ˏTFUP@IJ גࣜձࣾϊϋφ ΞϓϦΤϯδχΞɺ ϦαʔνɺࢪࡦɺσβΠϯ

  3. None

  4. .BUFSJBM%FTJHO$PNQPOFOUT

  5. #VUUPO • app:shapeAppearance=
 "@style/ShapeAppearanceOverlay.Cut" • app:cornerRadius="0dp"

  6. #VUUPO • app:shapeAppearance=
 "@style/ShapeAppearanceOverlay.Cut" • app:cornerRadius="4dp"

  7. #VUUPO • app:shapeAppearance=
 "@style/ShapeAppearanceOverlay.Cut" • app:cornerRadius="18dp"

  8. #VUUPO • app:shapeAppearance=
 "@style/ShapeAppearanceOverlay.Cut" • app:cornerRadius="30dp"

  9. #VUUPO • app:shapeAppearance=
 "@style/ShapeAppearanceOverlay.Cut" • app:cornerRadius="60dp"

  10. #VUUPO • app:shapeAppearance=
 "@style/ShapeAppearanceOverlay.Cut" • app:cornerRadius="70dp"

  11. #VUUPO • app:shapeAppearance=
 "@style/ShapeAppearanceOverlay.Cut" • app:cornerRadius="80dp"

  12. #VUUPO • app:shapeAppearance=
 "@style/ShapeAppearanceOverlay.Cut" • app:cornerRadius="90dp"

  13. #VUUPO • app:shapeAppearance=
 "@style/ShapeAppearanceOverlay.Cut" • app:cornerRadius=“100dp"

  14. ಺෦࣮૷

  15. ొ৔ਓ෺ • MaterialShapeDrawable • Buttonͷഎܠɺ͍͕ͭ͜ݪҼ • ShapeAppearanceModel • ݟͨ໨Λ࢘ΔϚϯɺ֯΍ลͷShapePathΛ࡞Δ •

    ShapePath • ͲΜͳݟͨ໨͔ͷ஋Ϋϥε • ShapeAppearancePathProvider • ShapeAppearanceModelΛPathʹม׵͢ΔϚϯ

  16. എܠͷඳը MaterialShapeDrawable.draw MaterialShapeDrawable.drawFillShape → MaterialShapeDrawable.drawShape → Canvas.drawRoundRect/Canvas.drawPath Cut͸drawPath

  17. എܠͷ1BUIͷ࡞੒ MaterialShapeDrawable.draw MaterialShapeDrawable.calculatePath → MSD.calculatePathForSize → ShapeAppearancePathProvider.calculatePath → ShapeAppearancePathProvider.calculatePath

  18. 4IBQF"QQFBSBODF1BUI1SPWJEFSDBMDVMBUF1BUI • setCornerPathAndTransform /
 setEdgePathAndTransform
 → ShapePathΛ࡞੒ • appendCornerPath /appendEdgePath


    → ShapePathΛPathʹม׵
 ɹ→ ShapePath.applyToPath
 ɹɹ→ PathOperation.applyToPath

  19. DPSOFS3BEJVTlEQ

  20. DPSOFS3BEJVTEQ

  21. DPSOFS3BEJVTEQ

  22. $PSOFS'BNJMZ306/%&%

  23. $PSOFS'BNJMZ306/%&% • app:cornerRadius="100dp"

  24. $PSOFS'BNJMZ306/%&% • app:cornerRadius="100dp"

  25. എܠͷඳը MaterialShapeDrawable.draw MaterialShapeDrawable.drawFillShape → MaterialShapeDrawable.drawShape → Canvas.drawRoundRect/Canvas.drawPath

  26. $PSOFS'BNJMZ306/%&% • app:cornerRadius="100dp"

  27. ·ͱΊ w $VUͰϦϘϯܕʹͳΔͷ͸ҙਤ͍ͯ͠Δ͔  w ˠڪΒ͘ҙਤ͍ͯ͠ͳ͍ w എܠͷඳը w 3PVOEFEˠ3PVOE3FDU

    w $VUˠ1BUIΛඳը w 1BUI΁ͷม׵͸φΠʔϒ
  28. None