Mørk tilstand og dynamisk farve
Tilpas farver til systemet og baggrunden.
Mørk tilstand og dynamisk farve er en gratis Jetpack Compose Academy-lektion på CoddyKit. Dette er lektion 3 af 4. Du kan læse hele lektionen gratis nedenfor — og derefter øve dig praktisk i browseren med en indbygget kodeeditor og en AI-vejleder, der er tilgængelig døgnet rundt. Den er en del af læringsforløbet i Jetpack Compose Academy, og dine fremskridt synkroniseres på tværs af nettet og CoddyKit-appen. Jetpack Compose Academy-kurset indeholder 4 lektioner i alt.
To paletter, én app
En gennemarbejdet app leveres med både en lys og en mørk palet. Du definerer dem som separate colorScheme-objekter og skifter mellem dem på temaniveau. 🌙
Registrer systemindstillingen
Du spørger systemet, hvilken tilstand der er aktiv, med isSystemInDarkTheme, en Composable, der returnerer true, når brugeren foretrækker mørk tilstand.
val dark = isSystemInDarkTheme()Vælg skemaet
Med det flag vælger du, hvilken palet der skal sendes til MaterialTheme, så appen automatisk følger systemets indstilling for mørk tilstand.
val scheme = if (dark) darkColorScheme()
else lightColorScheme()Standardværdier for darkColorScheme
Byggeren darkColorScheme leveres med fornuftige standardværdier til svagt lys, så du får læselige og behagelige mørke overflader, selv før du tilpasser dem.
Kontrast er stadig vigtig
I mørk tilstand beholder du de samme farveroller, men gør overfladerne mørkere og farverne ovenpå lysere, så teksten forbliver nem at læse.
Hvad er dynamisk farve
Dynamisk farve er Material You-magi: På Android 12 og nyere kan systemet udlede din palet fra brugerens baggrundsbillede. 🎨
Kontroller Android-versionen
Dynamisk farve kræver API 31 eller nyere, så du skal kontrollere versionen, før du bruger det baggrundsbilledebaserede skema.
val supported = Build.VERSION.SDK_INT >= 31Opret et dynamisk skema
Når det understøttes, kalder du dynamicLightColorScheme eller den mørke variant med en kontekst for at hente farver direkte fra baggrundsbilledet.
dynamicDarkColorScheme(context)Hav altid en reserve
På ældre enheder er dynamisk farve ikke tilgængelig, så du falder tilbage til din egen colorScheme for at bevare brandets udtryk.
Sæt det hele sammen
Dit tema vælger dynamisk farve, når det er tilladt, og ellers mørk eller lys efter systemindstillingen, så ét valg af colorScheme håndterer alle tilfælde.
val scheme = when {
dynamicOk && dark -> dynamicDarkColorScheme(ctx)
dark -> darkColorScheme()
else -> lightColorScheme()
}Afprøv begge tilstande
Forhåndsvis dine skærme i lys og mørk tilstand samt på et farverigt baggrundsbillede, så dynamisk farve ikke overrasker dig med kombinationer, der er svære at læse. ✨
Hurtigt tjek
En bruger på Android 13 vælger et lilla baggrundsbillede. Hvad kan dit tema gøre?
Opsummering: Adaptiv, personlig farve
Du registrerede systemtilstanden med isSystemInDarkTheme, skiftede paletter og kombinerede dynamisk farve med en sikker reserve. 🎉
Lær Kotlin med en AI-underviser — gratis
Skriv og kør rigtig kode i din browser, få øjeblikkelig hjælp fra en AI-underviser døgnet rundt, og fortsæt, hvor du slap, på web eller i appen.
- Kurser
- 30
- Lektioner
- 120
Ofte stillede spørgsmål
Er lektionen “Mørk tilstand og dynamisk farve” gratis?
Ja — hele teksten til “Mørk tilstand og dynamisk farve” kan læses gratis her på nettet. Hvis du vil øve dig interaktivt med en indbygget kodeeditor og en AI-vejleder døgnet rundt og få adgang til resten af Jetpack Compose Academy-kurset, skal du opgradere til CoddyKit PRO. Jetpack Compose Academy-kurset indeholder 4 lektioner i alt.
Hvad lærer jeg i “Mørk tilstand og dynamisk farve”?
Tilpas farver til systemet og baggrunden. Du øver dig i Jetpack Compose Academy med praktisk kode, som du kører direkte i browseren, og en AI-vejleder døgnet rundt besvarer dine spørgsmål, mens du arbejder dig gennem lektionen.
Skal jeg have erfaring for at begynde på Jetpack Compose Academy?
Der kræves ingen tidligere erfaring. Jetpack Compose Academy på CoddyKit er tilrettelagt for både begyndere og øvede, så du kan starte her eller fra begyndelsen og lære i dit eget tempo. Dette er lektion 3 af 4.
Hvor lang tid tager lektionen “Mørk tilstand og dynamisk farve”?
De fleste CoddyKit-lektioner tager cirka 5–10 minutter. Hver lektion er kort og interaktiv, så du gør løbende fremskridt og kan fortsætte, hvor du slap – på både web og app.
Kan jeg skrive og køre kode i denne Jetpack Compose Academy-lektion?
Ja. Alle Jetpack Compose Academy-lektioner har en indbygget kodeeditor, så du kan skrive og køre rigtig kode direkte i din browser og få øjeblikkelig feedback fra AI – uden lokal opsætning.
Alle lektioner i dette kursus
- MaterialTheme og farveskemaer
- Typografi- og formtokens
- Mørk tilstand og dynamisk farve
- Opbygning af et brugerdefineret designsystem