Android Academy · पाठ

आपका पहला Composable

Composable फ़ंक्शन बनाएँ और उसका पूर्वावलोकन करें।

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

आपका पहला Composable, CoddyKit पर Android Academy का एक निःशुल्क पाठ है। यह 4 में से 2वाँ पाठ है। इस अध्ययन पथ के 3 तक कोई भी पाठ पूरा पढ़ना निःशुल्क है — इसके बाद CoddyKit PRO हर पाठ अनलॉक करता है, साथ ही अंतर्निर्मित कोड संपादक और चौबीसों घंटे एआई शिक्षक के साथ व्यावहारिक अभ्यास भी उपलब्ध कराता है। यह Android Academy सीखने के मार्ग का हिस्सा है और आपकी प्रगति वेब तथा CoddyKit ऐप पर सिंक होती रहती है। Android Academy पाठ्यक्रम में कुल 4 पाठ शामिल हैं।

आपका पहला कम्पोज़ेबल

कम्पोज़ेबल बस एक Kotlin फ़ंक्शन है, जिस पर @Composable लगा होता है। आइए ऐसा फ़ंक्शन लिखें, जो उपयोगकर्ता का नाम लेकर उसका अभिवादन करे।

@Composable
fun Greeting(name: String) {
    Text(text = "Hello, $name!")
}

@Composable एनोटेशन

@Composable एनोटेशन कंपाइलर को बताता है कि यह फ़ंक्शन यूआई उत्पन्न कर सकता है और अन्य कम्पोज़ेबल को कॉल कर सकता है। इसके बिना आप Text, Button या अन्य यूआई फ़ंक्शन को कॉल नहीं कर सकते।

नामकरण परंपरा

यूआई उत्पन्न करने वाले कम्पोज़ेबल के नाम PascalCase संज्ञाओं में रखे जाते हैं, जैसे Greeting या ProfileCard — यह किसी कक्षा के नाम जैसा है। इससे संकेत मिलता है कि "यह कुछ बनाता है", न कि "यह कोई मान लौटाता है"।

पैरामीटर यूआई को नियंत्रित करते हैं

कम्पोज़ेबल किसी भी फ़ंक्शन की तरह पैरामीटर लेते हैं। ये पैरामीटर आपके इनपुट होते हैं। अलग-अलग आर्ग्युमेंट से अलग यूआई बनता है।

@Composable
fun Greeting(name: String) {
    Text(text = "Welcome, $name")
}
// Greeting("Sam") and Greeting("Mia") render different text

कम्पोज़ेबल को कॉल करना

कम्पोज़ेबल को केवल अन्य कम्पोज़ेबल के भीतर से ही कॉल किया जा सकता है। कॉल को एक-दूसरे के अंदर रखकर आप स्क्रीन बनाते हैं।

@Composable
fun WelcomeScreen() {
    Greeting(name = "Ada")
    Greeting(name = "Grace")
}

setContent से होस्ट करना

कम्पोज़ेबल को वास्तव में दिखाने के लिए, कोई Activity onCreate में setContent { } को कॉल करती है। यह लैम्ब्डा आपके Compose यूआई का मूल होता है।

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            WelcomeScreen()
        }
    }
}

कम्पोज़ेबल Unit लौटाते हैं

ध्यान दें कि कम्पोज़ेबल यूआई ऑब्जेक्ट नहीं लौटाते। उनका रिटर्न प्रकार Unit होता है और कॉल किए जाने के साइड इफ़ेक्ट के रूप में यूआई उत्पन्न होता है। आप यूआई कॉल करके बनाते हैं, मान लौटाकर नहीं।

डिफ़ॉल्ट पैरामीटर

Kotlin के डिफ़ॉल्ट आर्ग्युमेंट यहाँ बहुत उपयोगी हैं। किसी पैरामीटर को डिफ़ॉल्ट मान दें, ताकि कॉल करने वाला उसे छोड़ सके।

@Composable
fun Greeting(name: String = "Guest") {
    Text(text = "Hello, $name!")
}
// Greeting() shows "Hello, Guest!"

कम्पोज़ेबल का पुनः उपयोग

क्योंकि कम्पोज़ेबल फ़ंक्शन होते हैं, इसलिए उनका पुनः उपयोग किया जा सकता है। Greeting को एक बार परिभाषित करें और अलग-अलग नामों के साथ कहीं भी कॉल करें। इसी तरह यूआई कोड की नकल करने से बचा जाता है।

उन्हें छोटा रखें

अच्छे कम्पोज़ेबल छोटे और केंद्रित होते हैं। एक कम्पोज़ेबल को यूआई के एक तार्किक हिस्से का वर्णन करना चाहिए। छोटे कम्पोज़ेबल को जोड़कर बड़ी स्क्रीन बनाएँ।

सब कुछ एक साथ जोड़ना

यहाँ किसी गतिविधि से जुड़ा हुआ एक पूरा पहला कम्पोज़ेबल है। इसे डिवाइस पर चलाने पर "Hello, Compose!" दिखाई देता है।

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            Greeting(name = "Compose")
        }
    }
}

@Composable
fun Greeting(name: String) {
    Text(text = "Hello, $name!")
}

त्वरित जाँच

@Composable एनोटेशन किसी फ़ंक्शन को क्या करने की अनुमति देता है?

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

पुनरावलोकन

आपने अपना पहला कम्पोज़ेबल लिखा। याद रखें:

यूआई फ़ंक्शन पर @Composable लगाएँ।
PascalCase नामों का उपयोग करें।
पैरामीटर वे इनपुट हैं जो यूआई का रूप तय करते हैं।
setContent { } किसी गतिविधि में कम्पोज़ेबल को होस्ट करता है।

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

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

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

पाठ्यक्रम: 36
पाठ: 152

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

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

क्या “आपका पहला Composable” पाठ निःशुल्क है?

हाँ — Android Academy अध्ययन पथ के 3 तक कोई भी पाठ, जिसमें “आपका पहला Composable” भी शामिल है, यहाँ वेब पर पूरा पढ़ना निःशुल्क है। इसके बाद CoddyKit PRO हर पाठ अनलॉक करता है, साथ ही अंतर्निर्मित कोड संपादक और चौबीसों घंटे एआई शिक्षक के साथ इंटरैक्टिव अभ्यास भी उपलब्ध कराता है। Android Academy पाठ्यक्रम में कुल 4 पाठ शामिल हैं।

“आपका पहला Composable” में मैं क्या सीखूँगा?

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

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

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

“आपका पहला Composable” पाठ पूरा करने में कितना समय लगता है?

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

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

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

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

← Android Academy पर वापस जाएँ