Jetpack Compose Academy · पाठ

Paths, Gradients और Blend Modes

जटिल fills और strokes बनाइए।

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

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

सरल आकृतियों से आगे

रेखाएँ और वृत्त अच्छे हैं, लेकिन वास्तविक ग्राफ़िक्स के लिए वक्रों और आकर्षक भरण की आवश्यकता होती है। अगले स्तर के लिए पाथ, ग्रेडिएंट और ब्लेंड मोड से परिचित हों।

पाथ क्या है

पाथ एक दर्ज की गई रूपरेखा है, जिसे आप बिंदु-दर-बिंदु बनाते हैं। आप इसके चारों ओर आगे बढ़ते हुए रेखाएँ खींचते हैं, फिर एक ही कॉल में तैयार आकृति बनाते हैं।

val path = Path()
path.moveTo(0f, 0f)
path.lineTo(100f, 0f)

moveTo और lineTo

पेन को शुरुआती बिंदु तक ले जाने के लिए moveTo का उपयोग करें, फिर सीधी रेखाखंड बनाने के लिए lineTo का उपयोग करें। अपनी पसंद का कोई भी बहुभुज बनाने के लिए इन्हें क्रम से जोड़ें।

path.moveTo(0f, 0f)
path.lineTo(80f, 120f)
path.lineTo(160f, 0f)
path.close()

quadraticBezierTo से वक्र

चिकने मोड़ों के लिए quadraticBezierTo का उपयोग करें। एक नियंत्रण बिंदु रेखा को वक्र में खींचता है, जो चार्ट के मुलायम किनारों के लिए उपयुक्त है।

path.quadraticBezierTo(50f, -40f, 100f, 0f)

पाथ बनाएं

बन जाने के बाद, पाथ को किसी रंग या ब्रश के साथ drawPath को दें। आप इसे ठोस रंग से भर सकते हैं या Stroke शैली से इसकी रूपरेखा बना सकते हैं।

drawPath(path = path, color = Color.Blue)

ब्रश से परिचित हों

ब्रश यह बताता है कि किसी क्षेत्र पर रंग कैसे लगाया जाएगा। सपाट रंग के बजाय, ब्रश आपकी आकृति पर चिकना ग्रेडिएंट फैला सकता है।

रैखिक ग्रेडिएंट

सीधी रेखा के साथ रंगों को मिलाने के लिए Brush.linearGradient का उपयोग करें। रंगों की सूची दें और देखें कि वे एक रंग से अगले रंग में धीरे-धीरे कैसे बदलते हैं।

val brush = Brush.linearGradient(
    listOf(Color.Cyan, Color.Magenta)
)
drawRect(brush = brush)

रेडियल ग्रेडिएंट

केंद्र से बाहर की ओर रंग मिलाने के लिए Brush.radialGradient का उपयोग करें। यह स्पॉटलाइट, मुलायम बटन और चमकते गोले बनाने के लिए आदर्श है।

val glow = Brush.radialGradient(
    listOf(Color.White, Color.Blue)
)

स्वीप ग्रेडिएंट

Brush.sweepGradient किसी केंद्र बिंदु के चारों ओर रंगों को घुमाता है। रंगीन प्रगति-वलयों और इंद्रधनुषी डायल के पीछे यही रहस्य है।

val sweep = Brush.sweepGradient(
    listOf(Color.Red, Color.Yellow, Color.Red)
)

ब्लेंड मोड से परिचित हों

BlendMode यह तय करता है कि नई आकृति पहले से बनाई गई सामग्री के साथ कैसे मिलेगी। Multiply रंगों को गहरा करता है, Screen उन्हें हल्का करता है और Plus प्रकाश जोड़ता है।

drawCircle(
    color = Color.Yellow,
    blendMode = BlendMode.Multiply
)

प्रभावों के लिए परत बनाएं

आकृतियाँ एक-दूसरे पर चढ़ने पर ब्लेंड मोड प्रभावशाली दिखते हैं। BlendMode.Plus के साथ दो पारदर्शी वृत्तों को एक-दूसरे पर रखें और उनका प्रतिच्छेदन अधिक चमकीला दिखाई देगा।

त्वरित जाँच

कौन-सा ब्रश किसी केंद्र बिंदु के चारों ओर रंगों को घुमाता है?

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

पुनरावलोकन

अब आप पाथ से वक्र बना सकते हैं, रैखिक, रेडियल और स्वीप ग्रेडिएंट से आकृतियों को भर सकते हैं, और ब्लेंड मोड का उपयोग करके उन्हें मिला सकते हैं। अब रचनात्मक बनने का समय है! ✨

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

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

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

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

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

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

क्या “Paths, Gradients और Blend Modes” पाठ निःशुल्क है?

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

“Paths, Gradients और Blend Modes” में मैं क्या सीखूँगा?

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

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

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

“Paths, Gradients और Blend Modes” पाठ पूरा करने में कितना समय लगता है?

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

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

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

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

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