Jetpack Compose Academy · पाठ

Image Composable

screen पर drawable resource draw कीजिए।

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

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

Compose के तरीके से चित्र

हर ऐप में चित्र होते हैं, और Compose में उन्हें Image composable से प्रदर्शित किया जाता है। यह पुराने ImageView का घोषणात्मक विकल्प है। 🖼️

आपको Painter चाहिए

Image सीधे संसाधन आईडी नहीं लेता। यह एक painter लेता है, जो ऐसा छोटा ऑब्जेक्ट है जिसे स्क्रीन पर आपका चित्र बनाना आता है।

painterResource ड्रॉएबल लोड करता है

res में मौजूद ड्रॉएबल को painter में बदलने के लिए उसकी संसाधन आईडी के साथ painterResource कॉल करें। यह आपके PNG या वेक्टर एसेट को पढ़ता है।

val logo = painterResource(id = R.drawable.logo)

आपका पहला चित्र

उस painter को Image में भेजें और वह स्क्रीन पर दिखाई देगा। यह एक पंक्ति composable के स्थान पर आपके ड्रॉएबल को प्रदर्शित करती है।

Image(painter = painterResource(R.drawable.logo), contentDescription = null)

contentDescription आवश्यक है

Image हमेशा contentDescription माँगता है। स्क्रीन रीडर इसे ज़ोर से पढ़ते हैं, इसलिए चित्र का कुछ स्पष्ट शब्दों में वर्णन करें।

Image(painter = logo, contentDescription = "Company logo")

सजावटी चित्र? null दें

यदि कोई चित्र केवल सजावटी है और कोई अर्थ नहीं जोड़ता, तो contentDescription को null सेट करें, ताकि TalkBack उसे पढ़ने के बजाय छोड़ दे।

वेक्टर साफ़-सुथरे ढंग से स्केल होते हैं

Compose को वेक्टर ड्रॉएबल बहुत पसंद हैं। vector किसी भी आकार में बेहद स्पष्ट रहता है, क्योंकि यह निश्चित पिक्सेल नहीं बल्कि गणित पर आधारित होता है, इसलिए धुंधला नहीं दिखता।

Modifier से आकार दें

डिफ़ॉल्ट रूप से Image बिटमैप के आकार में प्रदर्शित होता है। अपने लेआउट के लिए आवश्यक सटीक आयाम देने हेतु Modifier.size जोड़ें।

Image(painter = logo, contentDescription = null, modifier = Modifier.size(96.dp))

नेटवर्क से बिटमैप

painterResource केवल स्थानीय एसेट संभालता है। दूरस्थ URL के लिए लोडर लाइब्रेरी का उपयोग करें; सबसे लोकप्रिय विकल्प Coil और rememberAsyncImagePainter हैं।

चित्र का रंग बदलना

आप colorFilter से साधारण चित्र का रंग बदल सकते हैं। यह उन एकरंगी आइकन के लिए उपयोगी है जिन्हें आप अपनी थीम के रंग से मिलाना चाहते हैं।

Image(painter = logo, contentDescription = null,
    colorFilter = ColorFilter.tint(Color.Blue))

Image बनाम Icon

फ़ोटो और विस्तृत कलाकृतियों के लिए Image का उपयोग करें। छोटे, थीम के अनुसार रंगे जाने वाले चिह्नों के लिए हल्का Icon composable आमतौर पर बेहतर विकल्प है।

त्वरित जाँच

Image composable को painter के साथ हमेशा किस तर्क की आवश्यकता होती है?

पुनरावलोकन: चित्र प्रदर्शित करना

आपने सीखा कि Image, painterResource से painter प्रदर्शित करता है, उसे हमेशा contentDescription चाहिए और उसका आकार modifier से तय होता है। अगला विषय: Material आइकन! ✨

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

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

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

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

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

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

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

“Image Composable” में मैं क्या सीखूँगा?

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

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

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

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

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

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

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

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

  1. Image Composable
  2. Icon के साथ Material Icons
  3. ContentScale और cropping
  4. Images को clip और shape करना
← Jetpack Compose Academy पर वापस जाएँ