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
MDCのBottomAppBarのShadowの実現方法
Search
HiroYUKI Seto
January 28, 2019
Technology
0
950
MDCのBottomAppBarのShadowの実現方法
2019/1/28
potatotips #58
HiroYUKI Seto
January 28, 2019
Tweet
Share
More Decks by HiroYUKI Seto
See All by HiroYUKI Seto
Androidアプリの 安全なリファクタリングを行うパターン集
seto_hi
2
4.9k
UI TestやVisual Regression Testを コスパ良くやる
seto_hi
3
1.8k
事業支援というお仕事
seto_hi
0
400
MDCの内部実装から学ぶ 表現力の高いViewの作り方
seto_hi
5
1.8k
CoordinatorLayoutのBehaviorを使い倒す
seto_hi
1
380
Jetpack Compose
seto_hi
2
750
UI改善に繋がるエンジニアの立ち回り
seto_hi
2
4.6k
MDCのButtonのCorner Family
seto_hi
1
170
Kyashは なぜ使いやすいのか
seto_hi
1
2.5k
Other Decks in Technology
See All in Technology
コンソールで学ぶ!AWS CodePipelineの機能とオプション
umekou
2
110
スケールアップ企業のQA組織のバリューを最大限に引き出すための取り組み
tarappo
4
920
空が堕ち、大地が割れ、海が涸れた日~もしも愛用しているフレームワークが開発停止したら?~ #phperkaigi 2025
77web
2
1k
AIエージェント完全に理解した
segavvy
4
260
数百台のオンプレミスのサーバーをEKSに移行した話
yukiteraoka
0
680
AIエージェントキャッチアップと論文リサーチ
os1ma
6
1.2k
移行できそうでやりきれなかった 10年超えのシステムを葬るための戦略
ryu955
2
240
銀行でDevOpsを進める理由と実践例 / 20250317 Masaki Iwama
shift_evolve
1
110
Explainable Software Engineering in the Public Sector
avandeursen
0
360
日本MySQLユーザ会ができるまで / making MyNA
tmtms
1
360
パスキーでのログインを 実装してみよう!
hibiki_cube
0
650
SaaSプロダクト開発におけるバグの早期検出のためのAcceptance testの取り組み
kworkdev
PRO
0
420
Featured
See All Featured
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.4k
Fireside Chat
paigeccino
37
3.3k
It's Worth the Effort
3n
184
28k
Unsuck your backbone
ammeep
670
57k
Done Done
chrislema
183
16k
Documentation Writing (for coders)
carmenintech
69
4.7k
Speed Design
sergeychernyshev
28
860
Making the Leap to Tech Lead
cromwellryan
133
9.2k
What’s in a name? Adding method to the madness
productmarketing
PRO
22
3.4k
StorybookのUI Testing Handbookを読んだ
zakiyama
28
5.6k
Faster Mobile Websites
deanohume
306
31k
Making Projects Easy
brettharned
116
6.1k
Transcript
גࣜձࣾϊϋφɹށ༏೭ .%$ͷ#PUUPN"QQ#BSͷ 4IBEPXͷ࣮ݱํ๏
ށ༏೭ˏTFUP@IJ גࣜձࣾϊϋφ ΞϓϦΤϯδχΞɺ ϦαʔνɺࢪࡦɺσβΠϯ
None
.BUFSJBM%FTJHO$PNQPOFOUT
#PUUPN"QQ#BS
04͕4IBEPXΛඳը͢Δ݅ w "OESPJEˢ w &MFWBUJPO͕ΑΓେ͖͍ w 7JFXͷ0VUMJOF͕ํܗ • Outline.MODE_ROUND_RECT w
·ͨತਤܗ • Outline.MODE_CONVEX_PATH
#PUUPN"QQ#BS
Ͳ͏ͬͯ ࣮ݱ͞Ε͍ͯΔͷ
#PUUPN"QQ#BS࣮ EdgeTreatment topEdgeTreatment = new BottomAppBarTopEdgeTreatment(…); ShapeAppearanceModel appBarModel = materialShapeDrawable.getShapeAppearanceModel();
appBarModel.setTopEdge(topEdgeTreatment); materialShapeDrawable.setShadowCompatibilityMode( SHADOW_COMPAT_MODE_ALWAYS); … ViewCompat. setBackground(this, materialShapeDrawable);
#PUUPN"QQ#BS5PQ&EHF5SFBUNFOU @Override public void getEdgePath(…) { … shapePath.lineTo(…) shapePath.addArc(…) shapePath.addArc(…)
shapePath.addArc(…) shapePath.lineTo(…) … }
BEE"SD BEE"SD BEE-JOF BEE-JOF #PUUPN"QQ#BS BEE"SD
.BUFSJBM4IBQF%SBXBCMFESBX MaterialShapeDrawable.drawCompatShadow → EdgeShadowOperation.draw → ShadowCompatOperation.draw → ShadowRenderer.drawCornerShadow / ShadowRenderer.drawEdgeShadow
canvas.drawBitmap(shadowLayer, …)
4IBEPX3FOEFSFSESBX$PSOFS4IBEPX … cornerShadowPaint.setShader( new RadialGradient( …, Shader.TileMode.CLAMP)); … canvas.drawArc( …,
cornerShadowPaint); …
4IBEPX3FOEFSFS ΜΓ
None
·ͱΊ w #PUUPN"QQ#BS.BUFSJBM4IBQF%SBXBCMFΛ͏ w .BUFSJBM4IBQF%SBXBCMFͷ5PQ&EHF͕ #PUUPN"QQ#BS5PQ&EHF5SFBUNFOU w #PUUPN"QQ#BS5PQ&EHF5SFBUNFOU BSDͰ͘΅ΈΛදݱ͍ͯ͠Δ w
Өͷඳը4IBEPX3FOEFSFS
None