Android Academy · Lektion

Tekst, billede og knap

Brug de grundlæggende indbyggede composables.

Lektion 3 af 413 trin

Tekst, billede og knap er en gratis Android Academy-lektion på CoddyKit. Dette er lektion 3 af 4. Du kan læse alle 3 lektioner i dette læringsspor gratis i deres fulde længde — derefter låser CoddyKit PRO alle lektioner op samt praktiske øvelser med en indbygget kodeeditor og en AI-underviser døgnet rundt. Den er en del af læringsforløbet i Android Academy, og dine fremskridt synkroniseres på tværs af nettet og CoddyKit-appen. Android Academy-kurset indeholder 4 lektioner i alt.

Indbyggede composables

Compose leveres med færdige composables til almindelige brugerflader. Tre, du kommer til at bruge hele tiden, er Text, Image og Button.

Text-composable

Text viser en tekststreng. Dens vigtigste parameter er text.

@Composable
fun Title() {
    Text(text = "My App")
}

Styling af tekst

Text accepterer mange parametre til styling, f.eks. fontSize, color og fontWeight.

Text(
    text = "Big Bold",
    fontSize = 24.sp,
    color = Color.Blue,
    fontWeight = FontWeight.Bold
)

sp kontra dp

Skriftstørrelser bruger .sp (skalauafhængige pixels), så de respekterer brugerens tilgængelighedsindstilling for skriftstørrelse. Layoutstørrelser bruger .dp (densitetsuafhængige pixels).

Brug sp til tekst og dp til alt andet.

Image-composable

Image viser et billede. Brug painterResource til at indlæse en drawable, og angiv altid contentDescription af hensyn til tilgængeligheden.

Image(
    painter = painterResource(id = R.drawable.logo),
    contentDescription = "App logo"
)

contentDescription

contentDescription læses højt af skærmlæsere. For dekorative billeder uden betydning skal du angive null. For meningsfulde billeder skal du give en kort beskrivelse.

Button-composable

Button er et klikbart element. Dens vigtigste parameter er onClick, en lambda, der køres, når der trykkes på knappen. Knappens etiket placeres i dens content-lambda — normalt som en Text.

Button(onClick = { /* do something */ }) {
    Text(text = "Tap me")
}

Reaktion på klik

onClick-lambdaen er stedet, hvor du placerer din logik — opdater tilstand, navigér, eller kald en funktion.

Button(onClick = { println("Clicked!") }) {
    Text(text = "Log")
}

Content-lambdaer

Bemærk, at Button tager en afsluttende content-lambda. Alt, hvad du placerer indeni, gengives som knappens indhold, så en knap kan indeholde et ikon og tekst, ikke kun en etiket.

Button(onClick = { }) {
    Text(text = "Save")
}

Kombinér dem

Rigtige brugerflader blander disse composables. Her stables en titel, et billede og en knap i en Column.

@Composable
fun Card() {
    Column {
        Text(text = "Profile")
        Image(
            painter = painterResource(id = R.drawable.avatar),
            contentDescription = "Avatar"
        )
        Button(onClick = { }) { Text("Follow") }
    }
}

Der findes mange flere

Ud over disse tre tilbyder Compose TextField, Icon, Checkbox, Switch og mange flere. Det samme mønster gælder: Send parametre og content-lambdaer.

Hurtigt tjek

Hvilken parameter i Button kører din kode, når brugeren trykker på den?

Besvar den i den interaktive lektion

Opsummering

Du har mødt tre centrale composables:

Text — viser strenge; typografien ændres med fontSize og color (brug sp).
Image — painterResource + contentDescription.
Button — en onClick-lambda samt en content-lambda.

Gratis at komme i gang

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: 36
Lektioner: 152

Start gratis Se hele kurset

Ofte stillede spørgsmål

Er lektionen “Tekst, billede og knap” gratis?

Ja — alle 3 lektioner i læringssporet Android Academy, inklusive “Tekst, billede og knap”, kan læses gratis i deres fulde længde her på webstedet. Derefter låser CoddyKit PRO alle lektioner op samt interaktive øvelser med en indbygget kodeeditor og en AI-underviser døgnet rundt. Android Academy-kurset indeholder 4 lektioner i alt.

Hvad lærer jeg i “Tekst, billede og knap”?

Brug de grundlæggende indbyggede composables. Du øver dig i Android 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å Android Academy?

Der kræves ingen tidligere erfaring. Android 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 “Tekst, billede og knap”?

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 Android Academy-lektion?

Ja. Alle Android 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

← Tilbage til Android Academy