Jetpack Compose Academy · पाठ

Enabled, Disabled और Loading States

अपने buttons में उपलब्धता दर्शाइए।

पाठ 3, कुल 4 में से13 चरण

Enabled, Disabled और Loading States, CoddyKit पर Jetpack Compose Academy का एक निःशुल्क पाठ है। यह 4 में से 3वाँ पाठ है। आप नीचे पूरा पाठ निःशुल्क पढ़ सकते हैं—फिर अंतर्निहित कोड संपादक और 24/7 एआई ट्यूटर के साथ ब्राउज़र में इसका व्यावहारिक अभ्यास कर सकते हैं। यह Jetpack Compose Academy सीखने के मार्ग का हिस्सा है और आपकी प्रगति वेब तथा CoddyKit ऐप पर सिंक होती रहती है। Jetpack Compose Academy पाठ्यक्रम में कुल 4 पाठ शामिल हैं।

बटनों की अलग-अलग अवस्थाएँ होती हैं

अच्छा बटन वास्तविक स्थिति दर्शाता है: तैयार, अवरुद्ध या काम कर रहा। Compose आपको इन अवस्थाओं को दिखाने देता है, ताकि उपयोगकर्ताओं को हमेशा पता रहे कि क्या संभव है। 🚦

enabled पैरामीटर

हर बटन एक enabled फ़्लैग लेता है। इसे false करने पर बटन अपने-आप धुंधला हो जाता है और टैप अनदेखे करता है।

Button(
    onClick = { submit() },
    enabled = false
) { Text("Submit") }

स्थिति से enabled नियंत्रित करें

असली शक्ति enabled को स्थिति से जोड़ने में है। इसे सत्यापन से जोड़ें, ताकि बटन तभी सक्रिय हो जब इनपुट तैयार हो।

Button(
    onClick = { submit() },
    enabled = name.isNotBlank()
) { Text("Submit") }

अक्षम का अर्थ अवरुद्ध है

अक्षम बटन फिर भी दिखाई देता है, इसलिए उपयोगकर्ताओं को पता रहता है कि कार्रवाई मौजूद है। उसका फीका रूप बिना त्रुटि संदेश के संकेत देता है कि अभी क्यों नहीं।

काम करते समय प्रगति दिखाएँ

धीमी कार्रवाइयों के लिए लोड होने की अवस्था दिखाएँ। एक बूलियन का पता रखें और काम चलने के दौरान लेबल की जगह घूमता हुआ संकेतक दिखाएँ।

var loading by remember { mutableStateOf(false) }

लोड होने के दौरान अक्षम करें

लोड होते समय enabled = !loading सेट करें, ताकि उपयोगकर्ता दो बार टैप करके एक ही कार्रवाई दो बार शुरू न कर सकें।

Button(
    onClick = { loading = true },
    enabled = !loading
) { Text("Save") }

घूमता संकेतक दिखाएँ

सामग्री के अंदर फ़्लैग के आधार पर शाखा बनाएँ: लोड होते समय छोटा CircularProgressIndicator दिखाएँ, अन्यथा लेबल दिखाएँ।

Button(onClick = { }, enabled = !loading) {
    if (loading) CircularProgressIndicator(Modifier.size(18.dp))
    else Text("Save")
}

घूमते संकेतक का आकार घटाएँ

डिफ़ॉल्ट घूमता संकेतक बड़ा होता है। उसे Modifier.size से सीमित करें, ताकि वह लेबल की जगह अच्छी तरह फिट हो जाए।

CircularProgressIndicator(
    modifier = Modifier.size(18.dp),
    strokeWidth = 2.dp
)

काम पूरा होने पर रीसेट करें

काम पूरा होने पर loading को फिर false सेट करें। लेबल लौट आएगा और बटन दोबारा टैप करने योग्य हो जाएगा।

onResult = { loading = false }

अवस्थाएँ गलतियों से बचाती हैं

enabled और loading साथ मिलकर आपकी कार्रवाइयों की सुरक्षा करते हैं: इनपुट मान्य होने से पहले कोई टैप नहीं और काम चलने के दौरान दोबारा टैप नहीं।

बताएँ, छिपाएँ नहीं

बटन छिपाने के बजाय उसे अक्षम करना बेहतर है। दिखाई देने वाला लेकिन अक्षम नियंत्रण उपयोगकर्ताओं को उसे सक्रिय करने का तरीका सिखाता है।

त्वरित जाँच

आपकी सहेजने की कार्रवाई में दो सेकंड लगते हैं और उपयोगकर्ता उसे बार-बार दो बार टैप करते रहते हैं।

इंटरैक्टिव पाठ में इसका उत्तर दें

पुनरावलोकन: स्थिति वाले बटन

आपने वास्तविक स्थिति दर्शाना सीखा: enabled मान्यता के आधार पर कार्रवाई को अनुमति देता है, जबकि loading फ़्लैग प्रगति दिखाता और दोहराव रोकता है। ईमानदार बटन, प्रसन्न उपयोगकर्ता। 🎯

शुरुआत निःशुल्क

एआई शिक्षक के साथ Kotlin सीखें — निःशुल्क

अपने ब्राउज़र में वास्तविक कोड लिखें और चलाएँ, चौबीसों घंटे एआई शिक्षक से तुरंत सहायता पाएँ, और वेब या ऐप पर वहीं से शुरू करें जहाँ आपने छोड़ा था।

पाठ्यक्रम: 30
पाठ: 120

निःशुल्क सीखना शुरू करें पूरा पाठ्यक्रम देखें

अक्सर पूछे जाने वाले प्रश्न

क्या “Enabled, Disabled और Loading States” पाठ निःशुल्क है?

हाँ—“Enabled, Disabled और Loading States” का पूरा पाठ यहाँ वेब पर निःशुल्क पढ़ा जा सकता है। इंटरैक्टिव अभ्यास (अंतर्निहित कोड संपादक और 24/7 एआई ट्यूटर) करने और Jetpack Compose Academy पाठ्यक्रम का बाकी हिस्सा अनलॉक करने के लिए CoddyKit PRO लें। Jetpack Compose Academy पाठ्यक्रम में कुल 4 पाठ शामिल हैं।

“Enabled, Disabled और Loading States” में मैं क्या सीखूँगा?

अपने buttons में उपलब्धता दर्शाइए। आप ब्राउज़र में सीधे चलाए जाने वाले व्यावहारिक कोड के साथ Jetpack Compose Academy का अभ्यास करते हैं, और पाठ पूरा करते समय 24/7 एआई ट्यूटर आपके प्रश्नों के उत्तर देता है।

क्या Jetpack Compose Academy शुरू करने के लिए मुझे किसी अनुभव की आवश्यकता है?

पहले के अनुभव की आवश्यकता नहीं है। CoddyKit पर Jetpack Compose Academy शुरुआती से लेकर उन्नत शिक्षार्थियों तक सभी के लिए व्यवस्थित किया गया है, इसलिए आप यहीं से या शुरुआत से सीखना शुरू कर सकते हैं और अपनी गति से आगे बढ़ सकते हैं। यह 4 में से 3वाँ पाठ है।

“Enabled, Disabled और Loading States” पाठ पूरा करने में कितना समय लगता है?

CoddyKit का अधिकांश पाठ लगभग 5–10 मिनट में पूरा हो जाता है। हर पाठ छोटा और संवादात्मक है, इसलिए आप लगातार प्रगति करते हैं और वेब या ऐप पर वहीं से सीखना जारी रख सकते हैं जहाँ आपने छोड़ा था।

क्या मैं इस Jetpack Compose Academy पाठ में कोड लिख और चला सकता हूँ?

हाँ। हर Jetpack Compose Academy पाठ में एक अंतर्निर्मित कोड संपादक शामिल है, जिससे आप सीधे अपने ब्राउज़र में वास्तविक कोड लिख और चला सकते हैं और तुरंत एआई प्रतिक्रिया पा सकते हैं—स्थानीय सेटअप की आवश्यकता नहीं है।

इस पाठ्यक्रम के सभी पाठ

← Jetpack Compose Academy पर वापस जाएँ