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
93
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
190
Other Decks in Programming
See All in Programming
SIMD Parallel Programming with the Vector API
josepaumard
0
180
Scalable Customer Journey Orchestration (CJO)
lewuathe
0
330
StoreKit2によるiOSのアプリ内課金のリニューアル
kangnux
0
110
ゆるい個人開発のススメ
kuroppe1819
10
990
AWS CDKコントリビュートTIPS / aws-cdk-contribution-tips
gotok365
2
190
if constexpr文はテンプレート世界のラムダ式である
faithandbrave
3
650
Fragment Composition of GraphQL
quramy
7
1k
⼤規模⾔語モデルの拡張(RAG)が 終わったかも知れない件について
nearme_tech
23
15k
CA.swift19 恋するAIアプリ開発の裏側
oskmr
0
360
Anthropic Cookbook のおすすめレシピ
schroneko
7
980
Compose-View Interop in Practice (mDevCamp 2024)
stewemetal
0
140
1BRC--Nerd Sniping the Java Community
gunnarmorling
0
340
Featured
See All Featured
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
78
42k
Practical Orchestrator
shlominoach
182
9.7k
How To Stay Up To Date on Web Technology
chriscoyier
782
250k
The Art of Programming - Codeland 2020
erikaheidi
42
12k
Building Effective Engineering Teams - LeadDev
addyosmani
28
1.8k
Web Components: a chance to create the future
zenorocha
305
41k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
116
18k
Pencils Down: Stop Designing & Start Developing
hursman
117
11k
Scaling GitHub
holman
457
140k
Building a Scalable Design System with Sketch
lauravandoore
456
32k
Stop Working from a Prison Cell
hatefulcrawdad
266
19k
It's Worth the Effort
3n
180
27k
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?