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
Vasya Drobushkov: Android Dark Theme
Search
Vasya
July 19, 2019
Programming
0
110
Vasya Drobushkov: Android Dark Theme
How to support dark theme in your Android app
Vasya
July 19, 2019
Tweet
Share
More Decks by Vasya
See All by Vasya
Android Design Support Library
krossovochkin
0
200
Other Decks in Programming
See All in Programming
Polarsの成長: v0.14からv1.0までの変遷と今後の展望
zerebom
1
350
CSC307 Lecture 12
javiergs
PRO
0
220
スクラムマスターって孤独じゃないですか?
yoshitaroyoyo
1
140
Exploring the Gradually Lost Technical Skills in the Cloud Native Era
hwchiu
2
3.9k
はしめてのプログラミングとロボット制御
watawatavoltage
0
290
AHC035解説
terryu16
0
710
Product Management LT会_クアンド新家
shinshin
0
210
Trial
cairolibrary720
1
130
CSC307 Lecture 10
javiergs
PRO
0
310
HMSコンペ 11th Solution (team : kansai-kaggler)
t88
1
680
【Go言語】ジェネリクス
tomo1227
0
170
みんなのオブザーバビリティプラットフォームを作ってるんだがパフォーマンスがやばい #mackerelio #srenext
ne_sachirou
0
370
Featured
See All Featured
Designing on Purpose - Digital PM Summit 2013
jponch
113
6.6k
No one is an island. Learnings from fostering a developers community.
thoeni
17
2.8k
Fireside Chat
paigeccino
25
2.8k
Web development in the modern age
philhawksworth
203
10k
It's Worth the Effort
3n
181
27k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
155
14k
Robots, Beer and Maslow
schacon
PRO
157
8.1k
Faster Mobile Websites
deanohume
303
30k
Designing Experiences People Love
moore
136
23k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
325
21k
StorybookのUI Testing Handbookを読んだ
zakiyama
15
4.9k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
34
1.9k
Transcript
Dark Theme
Vasya Drobushkov Android Developer @ Ciklum Github: @krossovochkin Medium: @krossovochkin
Android Oreo Wallpapers
Android Pie Display Settings
Android Pie Display Settings
Android Pie Display Settings
Android Pie Display Settings
Android Pie Night mode
Android Pie Night mode
Android Pie Night mode
Android Pie Night mode
Android Q Display Settings
Android Q Display Settings
Android Q Display Settings
Why? Environment Battery Accessibility
None
Force Dark <style name="AppTheme"> <item name="android:forceDarkAllowed">true</item> </style>
Force Dark Result Q+
DayNight Theme <style name="AppTheme" parent="Theme.AppCompat.DayNight" /> // OR <style name="AppTheme"
parent="Theme.MaterialComponents.DayNight" />
DayNight First Try
-night resources // values/themes.xml <style name="Theme.AppCompat.DayNight" parent="Theme.AppCompat.Light"/> // values-night/themes.xml <style
name="Theme.AppCompat.DayNight" parent="Theme.AppCompat"/>
Custom Night Resources // values-night/colors.xml <resources> <color name="colorPrimary">#511b43</color> <color name="colorPrimaryDark">#511b43</color>
<color name="colorAccent">#ff6868</color> </resources>
Default Updated
Force Dark Custom DayNight Background darker
Force Dark Custom DayNight Dividers are dark
Force Dark Custom DayNight Button style
Android P
Dynamic DayNight mode AppCompatDelegate.setDefaultNightMode(mode) getDelegate().setLocalNightMode(mode) System Application Activity
Night Modes • MODE_NIGHT_NO // LIGHT • MODE_NIGHT_YES // DARK
• MODE_NIGHT_AUTO_BATTERY // DARK IN BATTERY SAVE MODE • MODE_NIGHT_FOLLOW_SYSTEM // SYSTEM PREFERENCE
Application Settings setPreferencesFromResource(R.xml.preferences, rootKey) themePreference?.onPreferenceChangeListener = Preference.OnPreferenceChangeListener { _, mode
-> AppCompatDelegate.setDefaultNightMode(mode) true }
Application Settings (Q)
Application Settings (prior to Q)
Issue
Persistence class App : Application() { override fun onCreate() {
super.onCreate() val mode = PreferenceManager .getDefaultSharedPreferences(this) .getInt("theme_key", MODE_NIGHT_NO) AppCompatDelegate.setDefaultNightMode(mode)
Fixed
Sum up • Extend DayNight Theme • Provide additional -night
resources for Dark Theme • Add preference for changing mode inside Application • Persist preference choice • Work with designer for the rest
Test Dark Theme
Test force dark
Disable force dark for particular views <Button android:forceDarkAllowed="false" tools:targetApi="q"/> view.setForceDarkAllowed(false)
Attributes <TextView android:textColor="?android:attr/textColorPrimary" … />
Check is Dark theme applied fun Context.isDarkTheme(): Boolean { val
mode = this.resources.configuration.uiMode and Configuration.UI_MODE_NIGHT_MASK return mode == Configuration.UI_MODE_NIGHT_YES }
AppCompat Material Components
AppCompat Material Components
Elevation val bg = MaterialShapeDrawable .createWithElevationOverlay(this, 32.0f) // OR val
color = ElevationOverlayProvider(this) .getSurfaceColorWithOverlayIfNeeded(32.0f)
https://github.com/krossovochkin/DarkThemeSample Sample project
Questions?