Column: zaken verticaal stapelen
Plaats kinderen van boven naar beneden.
Column: zaken verticaal stapelen is een gratis Jetpack Compose Academy-les op CoddyKit. Dit is les 1 van 4. Je kunt de volledige les hieronder gratis lezen en daarna in de browser praktisch oefenen met een ingebouwde code-editor en een AI-begeleider die 24/7 beschikbaar is. Deze les maakt deel uit van het leertraject Jetpack Compose Academy. Je voortgang wordt gesynchroniseerd op het web en in de CoddyKit-app. De cursus Jetpack Compose Academy bevat in totaal 4 lessen.
Verticaal stapelen
Wanneer je wilt dat kinderen van boven naar beneden staan, gebruik je Column. Dit is in Compose de standaardlay-out voor verticale stapels. 📚
Je eerste Column
Een Column accepteert een afsluitende lambda. Elke Composable die je erin aanroept, wordt een kind en wordt getekend in de volgorde waarin je deze schrijft.
Column {
Text("First")
Text("Second")
}De volgorde loopt van boven naar beneden
Kinderen worden gestapeld in de bronvolgorde. De eerste Composable staat bovenaan, de volgende eronder, enzovoort naar beneden op het scherm.
Verschillende kinderen combineren
Een Column kan elke Composable bevatten, niet alleen Text. Knoppen, afbeeldingen en zelfs andere Columns worden er allemaal netjes in gestapeld.
Column {
Text("Title")
Button(onClick = {}) { Text("Go") }
}Standaardformaat: inhoud omsluiten
Standaard is een Column alleen zo hoog en breed als zijn kinderen nodig hebben. De Column krimpt om de inhoud heen, tenzij je iets anders instelt.
De breedte vullen
Voeg een Modifier toe om het formaat te veranderen. fillMaxWidth rekt de Column horizontaal uit over het hele scherm.
Column(modifier = Modifier.fillMaxWidth()) {
Text("Wide column")
}Ruimte tussen kinderen
Gebruik verticalArrangement met spacedBy om gelijkmatige tussenruimtes tussen alle kinderen te plaatsen. Je hoeft elk item niet handmatig op te vullen.
Column(verticalArrangement = Arrangement.spacedBy(8.dp)) {
Text("A")
Text("B")
}Kinderen horizontaal uitlijnen
Stel horizontalAlignment in om kinderen uit te lijnen. CenterHorizontally trekt ze allemaal naar het midden van de breedte van de Column.
Column(horizontalAlignment = Alignment.CenterHorizontally) {
Text("Centered")
}Columns kunnen nog niet scrollen
Een gewone Column kan niet scrollen. Als kinderen buiten het scherm vallen, worden ze afgeknipt. Daarom is een Column vooral geschikt voor korte, vaste lijsten.
Scrollen toevoegen wanneer dat nodig is
Voeg voor langere inhoud verticalScroll toe aan de modifier van de Column. Nu scrollt de hele stapel als één geheel.
Column(modifier = Modifier.verticalScroll(rememberScrollState())) {
Text("Long content")
}Nesten voor echte schermen
Op echte schermen worden Columns genest in andere Columns. Een buitenste Column bevat secties en elke sectie is een eigen kleine Column met details.
Snelle controle
Laten we controleren hoe een Column zijn kinderen rangschikt.
Samenvatting: Column
Je hebt Column geleerd: deze stapelt kinderen van boven naar beneden in volgorde, omsluit standaard de inhoud en gebruikt rangschikking, uitlijning en modifiers om het formaat en de tussenruimtes te bepalen.
Leer Kotlin met een AI-tutor — gratis
Schrijf echte code en voer die uit in je browser, krijg direct hulp van een AI-tutor die 24/7 beschikbaar is en ga verder waar je gebleven bent op het web of in de app.
- Cursussen
- 30
- Lessen
- 120
Veelgestelde vragen
Is de les “Column: zaken verticaal stapelen” gratis?
Ja — de volledige tekst van “Column: zaken verticaal stapelen” kun je hier gratis op het web lezen. Als je interactief wilt oefenen met een ingebouwde code-editor en een AI-begeleider die 24/7 beschikbaar is, en de rest van de cursus Jetpack Compose Academy wilt ontgrendelen, kun je upgraden naar CoddyKit PRO. De cursus Jetpack Compose Academy bevat in totaal 4 lessen.
Wat leer ik in “Column: zaken verticaal stapelen”?
Plaats kinderen van boven naar beneden. Je oefent met Jetpack Compose Academy door code rechtstreeks in de browser uit te voeren. Een AI-begeleider die 24/7 beschikbaar is beantwoordt je vragen terwijl je de les doorwerkt.
Heb ik ervaring nodig om met Jetpack Compose Academy te beginnen?
Ervaring vooraf is niet nodig. Jetpack Compose Academy op CoddyKit is opgebouwd voor beginners tot gevorderden, zodat je hier of bij het begin kunt starten en in je eigen tempo kunt leren. Dit is les 1 van 4.
Hoe lang duurt de les “Column: zaken verticaal stapelen”?
De meeste lessen van CoddyKit duren ongeveer 5–10 minuten. Elke les is kort en interactief, zodat je gestaag vooruitgaat en op het web en in de app precies verdergaat waar je was gebleven.
Kan ik code schrijven en uitvoeren in deze les over Jetpack Compose Academy?
Ja. Elke les over Jetpack Compose Academy bevat een ingebouwde code-editor, zodat je rechtstreeks in je browser echte code kunt schrijven en uitvoeren en direct feedback van AI krijgt — lokale installatie is niet nodig.
Alle lessen in deze cursus
- Column: zaken verticaal stapelen
- Row: zaken naast elkaar plaatsen
- Box: lagen en overlappingen
- Rangschikking en uitlijning