Aktivierte, deaktivierte und ladende Zustände
Bilden Sie die Verfügbarkeit in Ihren Buttons ab.
Aktivierte, deaktivierte und ladende Zustände ist eine kostenlose Jetpack Compose Academy-Lektion auf CoddyKit. Dies ist Lektion 3 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.
Buttons Have Moods
Ein guter Button spiegelt die Realität wider: bereit, blockiert oder in Arbeit. Mit Compose können Sie diese Zustände ausdrücken, damit Benutzer immer wissen, was möglich ist. 🚦
The enabled Parameter
Jede Schaltfläche nimmt ein enabled-Flag entgegen. Setzen Sie es auf false, wird die Schaltfläche grau und ignoriert Berührungen automatisch.
Button(
onClick = { submit() },
enabled = false
) { Text("Submit") }Drive enabled From State
Die echte Stärke liegt darin, enabled an den State zu binden. Verknüpfen Sie es mit der Validierung, damit sich der Button erst aktiviert, wenn die Eingabe bereit ist.
Button(
onClick = { submit() },
enabled = name.isNotBlank()
) { Text("Submit") }Disabled Means Blocked
Ein deaktivierter Button wird weiterhin angezeigt, sodass Benutzer sehen, dass die Aktion existiert. Sein verblasstes Aussehen signalisiert warum noch nicht, ganz ohne Fehlermeldung.
Show Progress While Working
Zeigen Sie bei langsamen Aktionen einen Ladezustand an. Verfolgen Sie einen booleschen Wert und tauschen Sie die Beschriftung während der Ausführung gegen einen Ladekreis aus.
var loading by remember { mutableStateOf(false) }Disable During Loading
Setze während des Ladens enabled = !loading, damit Benutzer nicht doppelt tippen und dieselbe Aktion zweimal ausführen können.
Button(
onClick = { loading = true },
enabled = !loading
) { Text("Save") }Swap In a Spinner
Verzweigen Sie im Inhalt je nach Flagge: Zeigen Sie beim Laden einen kleinen CircularProgressIndicator an, andernfalls das Label.
Button(onClick = { }, enabled = !loading) {
if (loading) CircularProgressIndicator(Modifier.size(18.dp))
else Text("Save")
}Size the Spinner Down
Der Standard-Spinner ist groß. Schränke ihn mit einem Modifier.size ein, damit er genau dorthin passt, wo sich früher das Label befand.
CircularProgressIndicator(
modifier = Modifier.size(18.dp),
strokeWidth = 2.dp
)Reset When Done
Wenn die Arbeit beendet ist, setzen Sie loading wieder auf false. Das Label erscheint und die Schaltfläche wird wieder klickbar.
onResult = { loading = false }States Prevent Mistakes
Gemeinsam schützen aktiviert und Laden Ihre Aktionen: keine Eingaben, bevor die Eingabe gültig ist, keine doppelten Eingaben, während die Arbeit ausgeführt wird.
Communicate, Don't Hide
Deaktivieren Sie eine Schaltfläche lieber, anstatt sie auszublenden. Ein sichtbares, aber deaktiviertes Steuerelement zeigt Benutzern den Weg, wie sie es entsperren können.
Quick Check
Dein Speichervorgang dauert zwei Sekunden und die Nutzer tippen immer wieder doppelt darauf.
Recap: Stateful Buttons
Du hast gelernt, die Realität abzubilden: aktivierte Gates nach Gültigkeit, ein Ladeindikator zeigt den Fortschritt und blockiert Wiederholungen. Ehrliche Buttons, glückliche Nutzer. 🎯
Häufig gestellte Fragen
Ist die Lektion „Aktivierte, deaktivierte und ladende Zustände“ kostenlos?
Ja — der vollständige Text von „Aktivierte, deaktivierte und ladende Zustände“ 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 „Aktivierte, deaktivierte und ladende Zustände“?
Bilden Sie die Verfügbarkeit in Ihren Buttons ab. 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 3 von 4.
Wie lange dauert die Lektion „Aktivierte, deaktivierte und ladende Zustände“?
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
- Button und onClick
- Text-, Outlined- und Icon-Buttons
- Aktivierte, deaktivierte und ladende Zustände
- clickable für jede Composable