Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
MDCのBottomAppBarのShadowの実現方法
HiroYUKI Seto
January 28, 2019
Technology
0
680
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
1
4.5k
UI TestやVisual Regression Testを コスパ良くやる
seto_hi
3
1.4k
事業支援というお仕事
seto_hi
0
300
MDCの内部実装から学ぶ 表現力の高いViewの作り方
seto_hi
5
1.4k
CoordinatorLayoutのBehaviorを使い倒す
seto_hi
1
220
Jetpack Compose
seto_hi
2
510
UI改善に繋がるエンジニアの立ち回り
seto_hi
2
3.8k
MDCのButtonのCorner Family
seto_hi
1
120
Kyashは なぜ使いやすいのか
seto_hi
1
2k
Other Decks in Technology
See All in Technology
Building smarter apps with machine learning, from magic to reality
picardparis
4
3.2k
FoodTechにおける商流・金流・物流の進化/Evolution of Commercial, Financial, and Logistics in FoodTech
dskst
0
400
Implementing Kubernetes operators in Java with Micronaut - TechWeek Java Summit 2022
alvarosanchez
0
120
SI企業が「アジャイル推し」になったら 幸せになれますか?/Can SI company be happy if it becomes “Agile stan” ?
chinmo
1
1.2k
Lessons Learned from Scaling Infrastructure as Code
joatmon08
0
790
20220622_FinJAWS_あのときにAWSがあったらこうできた
taketakekaho
0
110
インフラのCI/CDはGitHub Actionsに任せた
mihyon
0
110
開発組織の生産性を可視化する State of DevOpsとFour Keysとは / deep dive into State of DevOps
yfcgpsebp
0
220
【toranoana.deno#7】Denoからwasmを呼び出す基礎
toranoana
0
120
Design for Humans: How to make better modernization decisions
indualagarsamy
2
120
#JP_Stripes Sapporo Stripeの活用例を色々ご紹介します!
miu_crescent
0
110
誰が正解を知っているのか / Who knows the right answer
takaking22
1
240
Featured
See All Featured
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
226
15k
Ruby is Unlike a Banana
tanoku
91
9.2k
Adopting Sorbet at Scale
ufuk
63
7.6k
Java REST API Framework Comparison - PWX 2021
mraible
PRO
11
4.7k
The Mythical Team-Month
searls
209
39k
The Language of Interfaces
destraynor
148
20k
Fireside Chat
paigeccino
12
1.3k
A better future with KSS
kneath
225
15k
Designing for Performance
lara
597
63k
Reflections from 52 weeks, 52 projects
jeffersonlam
337
17k
Making the Leap to Tech Lead
cromwellryan
113
7.4k
BBQ
matthewcrist
74
7.9k
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