0Pricing
Jetpack Compose Academy · Lektion

weight und flexible Größen

Verteilen Sie Platz proportional in Zeilen und Spalten.

weight und flexible Größen ist eine kostenlose Jetpack Compose Academy-Lektion auf CoddyKit. Dies ist Lektion 4 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des Jetpack Compose Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der Jetpack Compose Academy-Kurs umfasst insgesamt 4 Lektionen.

Teile dieser Lektion wurden noch nicht übersetzt und werden auf Englisch angezeigt.

Flexible Space

Sometimes you want children to share space, not take fixed sizes. The weight modifier divides leftover room proportionally. ⚖️

Where weight Lives

weight works only inside a Row or Column. It is part of the layout scope those containers provide to their children.

Equal Split

Give two children the same weight and they share the space evenly, each taking half of what is available.

Box(Modifier.weight(1f))
Box(Modifier.weight(1f))

Uneven Split

Weights are ratios. A child with weight(2f) gets twice the space of a sibling with weight(1f).

Box(Modifier.weight(2f))
Box(Modifier.weight(1f))

Fixed Plus Flexible

Mix and match: give one child a fixed size and let another use weight to absorb whatever space remains.

Box(Modifier.width(80.dp))
Box(Modifier.weight(1f))

Push to the Edge

A single weight on a spacer acts like a push, sending the next child all the way to the far end of the row.

Text("Left")
Spacer(Modifier.weight(1f))
Text("Right")

Weights Run First

Compose measures fixed children first, then splits the leftover space among weighted ones. That is why weight needs siblings to push against.

The fill Flag

By default a weighted child fills its share. Pass fill = false to let it stay smaller than the space it was given.

Modifier.weight(1f, fill = false)

Weighted Columns

The same idea works vertically. In a Column, weight divides the leftover height instead of width.

Column {
  Box(Modifier.weight(1f))
  Box(Modifier.weight(1f))
}

Responsive by Design

Because weights are ratios, your layout scales gracefully across phone and tablet widths without hardcoded numbers.

A Common Pattern

Label on the left, value filling the rest: a weighted row is the classic recipe for clean settings and list rows.

Row {
  Text("Name")
  Text("Sam", Modifier.weight(1f))
}

Quick Check

Two children sit in a Row with weight(3f) and weight(1f). How is the space shared?

Recap

You can now share space flexibly. weight splits leftover room by ratio inside Rows and Columns for responsive layouts. 🎯

Häufig gestellte Fragen

Ist die Lektion „weight und flexible Größen“ kostenlos?

Ja — der vollständige Text von „weight und flexible Größen“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des Jetpack Compose Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der Jetpack Compose Academy-Kurs umfasst insgesamt 4 Lektionen.

Was lerne ich in „weight und flexible Größen“?

Verteilen Sie Platz proportional in Zeilen und Spalten. Du übst Jetpack Compose Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.

Brauche ich Erfahrung, um Jetpack Compose Academy zu starten?

Keine Vorkenntnisse erforderlich. Jetpack Compose Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 4 von 4.

Wie lange dauert die Lektion „weight und flexible Größen“?

Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.

Kann ich in dieser Jetpack Compose Academy-Lektion Code schreiben und ausführen?

Ja. Jede Jetpack Compose Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.

Alle Lektionen in diesem Kurs

  1. Padding, Größe und fillMaxWidth
  2. Hintergrund, Rahmen und Clip
  3. Warum die Reihenfolge von Modifikatoren wichtig ist
  4. weight und flexible Größen
← Zurück zu Jetpack Compose Academy