Row: Placér ting side om side
Placér underordnede elementer fra venstre mod højre.
Row: Placér ting side om side er en gratis Jetpack Compose Academy-lektion på CoddyKit. Dette er lektion 2 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.
Side om side
Når du vil placere underordnede elementer på en vandret linje, bruger du en Row. Den er Columns vandrette søskende. ➡️
Din første Row
En Row modtager en afsluttende lambda ligesom Column. Hvert underordnet element, du kalder i den, placeres ved siden af det forrige fra venstre mod højre.
Row {
Text("Left")
Text("Right")
}Rækkefølgen går fra venstre mod højre
De underordnede elementer flyder i kildekodens rækkefølge hen over skærmen. Den første Composable placeres i starten, den næste ved siden af den og så videre.
Et klassisk ikon med tekst
Rows er gode til små par, f.eks. et Icon ved siden af en Text-etiket. Denne kombination findes overalt i rigtige apps.
Row {
Icon(Icons.Default.Star, null)
Text("Favorite")
}Afstand mellem underordnede elementer
Brug horizontalArrangement sammen med spacedBy for at skabe en ens afstand mellem hvert underordnet element i stedet for at tilføje indvendig afstand ét ad gangen.
Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) {
Text("A")
Text("B")
}Justér underordnede elementer lodret
Indstil verticalAlignment for at rette de underordnede elementer ind på tværs af rækkens højde. CenterVertically holder et ikon og en høj tekst pænt centreret.
Row(verticalAlignment = Alignment.CenterVertically) {
Icon(Icons.Default.Star, null)
Text("Centered")
}Skub elementer fra hinanden
Arrangement.SpaceBetween fastgør det første underordnede element i starten og det sidste i slutningen og fordeler den ekstra plads mellem dem.
Row(horizontalArrangement = Arrangement.SpaceBetween) {
Text("Start")
Text("End")
}Del plads med weight
Giv et underordnet element weight i dets modifier, så det gør krav på den resterende bredde. To ens weights deler rækken ligeligt.
Row {
Text("Half", Modifier.weight(1f))
Text("Half", Modifier.weight(1f))
}Rows ruller ikke endnu
En almindelig Row kan ikke rulle. Underordnede elementer, der overskrider bredden, bliver beskåret, så brug en almindelig Row til indhold, der kan være der.
Tilføj vandret rulning
Ved bredt indhold skal du knytte horizontalScroll til Rows modifier, så hele rækken kan stryges fra side til side.
Row(modifier = Modifier.horizontalScroll(rememberScrollState())) {
Text("Wide content")
}Rows i Columns
De fleste skærme kombinerer begge dele. En Column stabler sektioner lodret, mens hver sektion bruger en Row til at placere sine dele side om side.
Hurtigt tjek
Lad os bekræfte, hvordan en Row placerer sine underordnede elementer.
Opsummering: Row
Du har lært om Row: den placerer underordnede elementer fra venstre mod højre, bruger placering og justering til at positionere dem og deler bredden med weight for fleksible layouts.
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 “Row: Placér ting side om side” gratis?
Ja — hele teksten til “Row: Placér ting side om side” 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 “Row: Placér ting side om side”?
Placér underordnede elementer fra venstre mod højre. 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 2 af 4.
Hvor lang tid tager lektionen “Row: Placér ting side om side”?
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
- Column: Stabl ting lodret
- Row: Placér ting side om side
- Box: Lag og overlap
- Arrangement og justering