Row: disporre gli elementi affiancati
Disponga gli elementi figli da sinistra a destra.
Row: disporre gli elementi affiancati è una lezione Jetpack Compose Academy gratuita su CoddyKit. Questa è la lezione 2 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento Jetpack Compose Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso Jetpack Compose Academy include 4 lezioni in totale.
Parti di questa lezione non sono ancora state tradotte e vengono mostrate in inglese.
Side by Side
When you want children in a horizontal line, you use a Row. It is the sideways sibling of Column. ➡️
Your First Row
A Row takes a trailing lambda just like Column. Each child you call inside lands next to the previous one, left to right.
Row {
Text("Left")
Text("Right")
}Order Is Left to Right
Children flow in source order across the screen. The first Composable sits at the start, the next beside it, and so on.
A Classic Icon Plus Label
Rows shine for small pairs, like an Icon next to a Text label. That side-by-side combo is everywhere in real apps.
Row {
Icon(Icons.Default.Star, null)
Text("Favorite")
}Spacing Between Children
Use horizontalArrangement with spacedBy to drop an even gap between each child instead of padding them one by one.
Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) {
Text("A")
Text("B")
}Aligning Children Vertically
Set verticalAlignment to line children up across the row's height. CenterVertically keeps an icon and tall text neatly centered.
Row(verticalAlignment = Alignment.CenterVertically) {
Icon(Icons.Default.Star, null)
Text("Centered")
}Pushing Items Apart
Arrangement.SpaceBetween pins the first child to the start and the last to the end, spreading any extra space between them.
Row(horizontalArrangement = Arrangement.SpaceBetween) {
Text("Start")
Text("End")
}Sharing Space with Weight
Give a child weight in its modifier to make it claim the leftover width. Two equal weights split the row evenly.
Row {
Text("Half", Modifier.weight(1f))
Text("Half", Modifier.weight(1f))
}Rows Don't Scroll Yet
A plain Row does not scroll. Children that overflow the width get clipped, so keep a basic Row to content that fits.
Adding Horizontal Scroll
For wide content, attach horizontalScroll to the Row's modifier and the whole strip becomes swipeable sideways.
Row(modifier = Modifier.horizontalScroll(rememberScrollState())) {
Text("Wide content")
}Rows Inside Columns
Most screens combine both. A Column stacks sections vertically while each section uses a Row to lay its pieces side by side.
Quick Check
Let's confirm how a Row lays out its children.
Recap: Row
You learned Row: it places children left to right, uses arrangement and alignment to position them, and shares width with weight for flexible layouts.
Domande Frequenti
La lezione «Row: disporre gli elementi affiancati» è gratuita?
Sì — il testo completo di «Row: disporre gli elementi affiancati» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso Jetpack Compose Academy, passa a CoddyKit PRO. Il corso Jetpack Compose Academy include 4 lezioni in totale.
Cosa imparerò in «Row: disporre gli elementi affiancati»?
Disponga gli elementi figli da sinistra a destra. Eserciti Jetpack Compose Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.
Ho bisogno di esperienza per iniziare Jetpack Compose Academy?
Non è richiesta alcuna esperienza precedente. Jetpack Compose Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 2 di 4.
Quanto tempo richiede la lezione «Row: disporre gli elementi affiancati»?
La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.
Posso scrivere ed eseguire codice in questa lezione Jetpack Compose Academy?
Sì. Ogni lezione Jetpack Compose Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.
Tutte le lezioni di questo corso
- Column: impilare verticalmente gli elementi
- Row: disporre gli elementi affiancati
- Box: sovrapporre e stratificare
- Disposizione e allineamento