Jetpack Compose के लिए Kotlin

Jetpack Compose, Kotlin के आधार पर बनाई गई है. कुछ मामलों में, Kotlin में खास तरह के आइडियम उपलब्ध होते हैं. इनकी मदद से, Compose का अच्छा कोड आसानी से लिखा जा सकता है. अगर आपको लगता है कि किसी अन्य और मैन्युअल रूप से उस भाषा का Kotlin में अनुवाद करें, तो ऐसा हो सकता है कि वे कंपोज़ की सुविधाओं का इस्तेमाल न कर पाएं. ऐसे में, आपको मुहावरेदार ढंग से लिखे गए Kotlin कोड को समझना मुश्किल है. ज़्यादा रेवेन्यू पाना Kotlin की स्टाइल को अच्छी तरह से समझने से, आपको इन खतरों से बचने में मदद मिल सकती है.

डिफ़ॉल्ट आर्ग्युमेंट

Kotlin फ़ंक्शन लिखते समय, फ़ंक्शन के लिए डिफ़ॉल्ट वैल्यू तय की जा सकती है आर्ग्युमेंट, का उपयोग तब किया जाता है, जब कॉलर स्पष्ट रूप से उन मानों को पास नहीं करता है. इस सुविधा की मदद से, ओवरलोड किए गए फ़ंक्शन की ज़रूरत कम हो जाती है.

उदाहरण के लिए, मान लें कि आपको एक ऐसा फ़ंक्शन लिखना है जो स्क्वेयर बनाता है. उस फ़ंक्शन में एक ज़रूरी पैरामीटर, sideLength हो सकता है, जो हर तरफ़ की लंबाई बताता है. इसमें कई वैकल्पिक पैरामीटर हो सकते हैं, जैसे कि thickness, edgeColor वगैरह. अगर कॉलर इन पैरामीटर की जानकारी नहीं देता है, तो फ़ंक्शन डिफ़ॉल्ट वैल्यू का इस्तेमाल करता है. दूसरी भाषाओं में, आपको कई फ़ंक्शन लिखने पड़ सकते हैं:

// We don't need to do this in Kotlin!
void drawSquare(int sideLength) { }

void drawSquare(int sideLength, int thickness) { }

void drawSquare(int sideLength, int thickness, Color edgeColor) { }

Kotlin में, एक फ़ंक्शन लिखा जा सकता है और तर्क:

fun drawSquare(
    sideLength: Int,
    thickness: Int = 2,
    edgeColor: Color = Color.Black
) {
}

इस सुविधा की मदद से, आपको कई ग़ैर-ज़रूरी फ़ंक्शन लिखने की ज़रूरत नहीं पड़ती. साथ ही, इससे आपके कोड को पढ़ना ज़्यादा आसान हो जाता है. अगर कॉलर किसी आर्ग्युमेंट के लिए कोई वैल्यू नहीं तय करता है, तो इसका मतलब है कि वह डिफ़ॉल्ट वैल्यू का इस्तेमाल करना चाहता है. इसके अलावा, नाम वाले पैरामीटर की मदद से यह देखना आसान हो जाता है कि क्या हो रहा है. अगर आपको कोड में इस तरह का फ़ंक्शन कॉल दिखता है, तो हो सकता है कि drawSquare() कोड देखे बिना, आपको पैरामीटर का मतलब न पता चले:

drawSquare(30, 5, Color.Red);

इसके उलट, यह कोड खुद दस्तावेज़ बना रहा है:

drawSquare(sideLength = 30, thickness = 5, edgeColor = Color.Red)

ज़्यादातर Compose की लाइब्रेरी डिफ़ॉल्ट आर्ग्युमेंट का इस्तेमाल करती हैं. साथ ही, यह फ़ॉर्मैट, कंपोज़ेबल फ़ंक्शन के लिए भी इस्तेमाल किया जा सकता है. इस तरीके से, आपके कॉम्पोनेंट को पसंद के मुताबिक बनाया जा सकता है. हालांकि, डिफ़ॉल्ट व्यवहार को लागू करना अब भी आसान है. उदाहरण के लिए, इस तरह का आसान टेक्स्ट एलिमेंट बनाया जा सकता है:

Text(text = "Hello, Android!")

उस कोड का नीचे दिए गए इफ़ेक्ट जैसा ही है, जो कि बहुत ज़्यादा वर्बोस कोड होता है, जिसमें ज़्यादा से ज़्यादा Text पैरामीटर अलग से सेट किए गए हों:

Text(
    text = "Hello, Android!",
    color = Color.Unspecified,
    fontSize = TextUnit.Unspecified,
    letterSpacing = TextUnit.Unspecified,
    overflow = TextOverflow.Clip
)

पहला कोड स्निपेट, पढ़ने में आसान होने के साथ-साथ, अपने-आप दस्तावेज़ बनने की सुविधा भी देता है. सिर्फ़ text पैरामीटर की जानकारी देकर, यह बताया जाता है कि आपको बाकी सभी पैरामीटर के लिए डिफ़ॉल्ट वैल्यू का इस्तेमाल करना है. इसके उलट, दूसरे स्निपेट का मतलब है कि आप उनके लिए अन्य पैरामीटर, हालांकि आपके द्वारा सेट किए गए मान डिफ़ॉल्ट मान के रूप में होते हैं .

हाई-ऑर्डर फ़ंक्शन और Lambda एक्सप्रेशन

Kotlin में हाई-ऑर्डर फ़ंक्शन काम करते हैं. ये ऐसे फ़ंक्शन होते हैं जिनमें अन्य फ़ंक्शन को पैरामीटर के तौर पर इस्तेमाल किया जाता है. Compose, इस तरीके पर आधारित है. इसके लिए उदाहरण के लिए, Button कंपोज़ेबल फ़ंक्शन में onClick लैम्डा पैरामीटर दिया गया है. उस पैरामीटर की वैल्यू एक फ़ंक्शन होती है. जब उपयोगकर्ता उस पर क्लिक करता है, तो बटन उस फ़ंक्शन को कॉल करता है:

Button(
    // ...
    
)
// ...

हाई-ऑर्डर फ़ंक्शन, लैम्डा एक्सप्रेशन के साथ अपने-आप जुड़ जाते हैं. ये ऐसे एक्सप्रेशन होते हैं जिनका आकलन करके फ़ंक्शन बनाया जाता है. अगर आपको फ़ंक्शन की ज़रूरत सिर्फ़ एक बार है, तो आपको उसे हाई-ऑर्डर फ़ंक्शन में पास करने के लिए, कहीं और तय करने की ज़रूरत नहीं है. इसके बजाय, आप यह कर सकते है: फ़ंक्शन को ठीक वहीं पर लैम्डा एक्सप्रेशन के साथ परिभाषित करें. पिछले उदाहरण में यह माना गया है कि myClickFunction() को कहीं और परिभाषित किया गया है. हालांकि, अगर सिर्फ़ यहां उस फ़ंक्शन का इस्तेमाल किया जाता है, तो लैम्डा एक्सप्रेशन के साथ फ़ंक्शन को इनलाइन में तय करना आसान होता है:

Button(
    // ...
    
        // do something
        // do something else
    }
) { /* ... */ }

आखिर में मौजूद लैम्ब्डा

Kotlin में, हाई-ऑर्डर फ़ंक्शन को कॉल करने के लिए एक खास सिंटैक्स उपलब्ध है. यह सिंटैक्स उन फ़ंक्शन के लिए इस्तेमाल किया जाता है जिनका आखिरी पैरामीटर लैम्डा होता है. अगर आपको उस पैरामीटर के तौर पर कोई lambda एक्सप्रेशन पास करना है, तो ट्रेलिंग lambda सिंटैक्स का इस्तेमाल किया जा सकता है. लैम्डा एक्सप्रेशन को कोष्ठक में रखने के बजाय, आप इसे उससे बचा जा सकता है. Compose में यह आम बात है. इसलिए, आपको यह जानना होगा कि कोड कैसा दिखता है.

उदाहरण के लिए, सभी लेआउट का अंतिम पैरामीटर, जैसे कि Column() कंपोज़ेबल फ़ंक्शन, content है, जो चाइल्ड यूज़र इंटरफ़ेस (यूआई) उत्सर्ज करता है एलिमेंट. मान लें कि आपको तीन टेक्स्ट एलिमेंट वाला कॉलम बनाना है और आपको उसमें कुछ फ़ॉर्मैटिंग लागू करनी है. यह कोड काम करेगा, लेकिन यह बहुत जटिल:

Column(
    modifier = Modifier.padding(16.dp),
    content = {
        Text("Some text")
        Text("Some more text")
        Text("Last text")
    }
)

content पैरामीटर, फ़ंक्शन सिग्नेचर में आखिरी पैरामीटर है और हम इसकी वैल्यू को लैम्डा एक्सप्रेशन के तौर पर पास कर रहे हैं. इसलिए, हम इसे ब्रैकेट से बाहर निकाल सकते हैं:

Column(modifier = Modifier.padding(16.dp)) {
    Text("Some text")
    Text("Some more text")
    Text("Last text")
}

दोनों उदाहरणों का एक ही मतलब है. ब्रैकेट, content पैरामीटर में पास किए गए lambda एक्सप्रेशन को तय करते हैं.

असल में, अगर आपने आखिर में जो पैरामीटर पास किया है वह सिर्फ़ lambda है, तो ब्रैकेट को छोड़ा जा सकता है. इसका मतलब है कि अगर आखिरी पैरामीटर lambda है और आपने कोई दूसरा पैरामीटर पास नहीं किया है, तो ब्रैकेट को छोड़ा जा सकता है. उदाहरण के लिए, मान लें कि आपको Column में कोई मॉडिफ़ायर पास करने की ज़रूरत नहीं है. आप कोड को इस तरह लिख सकते हैं शामिल करें:

Column {
    Text("Some text")
    Text("Some more text")
    Text("Last text")
}

यह सिंटैक्स Compose में काफ़ी आम है. खास तौर पर, इस तरह के लेआउट एलिमेंट के लिए Column. आखिरी पैरामीटर लैम्डा एक्सप्रेशन है, जो एलिमेंट के चाइल्ड शामिल हैं और उन बच्चों को फ़ंक्शन कॉल के बाद ब्रैकेट में दिखाया जाता है.

स्कोप और रिसीवर

कुछ तरीके और प्रॉपर्टी, सिर्फ़ किसी खास दायरे में उपलब्ध होती हैं. सीमित दायरे की मदद से, ज़रूरत के हिसाब से फ़ंक्शन उपलब्ध कराया जा सकता है और गलती से बचा जा सकता है जहां यह उचित न हो वहां उस सुविधा का इस्तेमाल करना.

'लिखें' विंडो में इस्तेमाल किया गया कोई उदाहरण देखें. Row layout composable को कॉल करने पर, आपका कॉन्टेंट lambda RowScope में अपने-आप शुरू हो जाता है. इससे Row को ऐसे फ़ंक्शन के बारे में पता चलता है जो सिर्फ़ Row में मान्य होती है. नीचे दिए गए उदाहरण से पता चलता है कि Row ने किस तरह align मॉडिफ़ायर:

Row {
    Text(
        text = "Hello world",
        // This Text is inside a RowScope so it has access to
        // Alignment.CenterVertically but not to
        // Alignment.CenterHorizontally, which would be available
        // in a ColumnScope.
        modifier = Modifier.align(Alignment.CenterVertically)
    )
}

कुछ एपीआई, Lambdas को स्वीकार करते हैं जिन्हें रिसीवर स्कोप में कॉल किया जाता है. पैरामीटर के एलान के आधार पर, उन लैम्ब्डा के पास उन प्रॉपर्टी और फ़ंक्शन का ऐक्सेस होता है जिन्हें कहीं और तय किया गया है:

Box(
    modifier = Modifier.drawBehind {
        // This method accepts a lambda of type DrawScope.() -> Unit
        // therefore in this lambda we can access properties and functions
        // available from DrawScope, such as the `drawRectangle` function.
        drawRect(
            /*...*/
            /* ...
        )
    }
)

ज़्यादा जानकारी के लिए, Kotlin दस्तावेज़ में रिसीवर के साथ फ़ंक्शन लिटरल देखें.

दी गई प्रॉपर्टी

Kotlin, डेलिगेट की गई प्रॉपर्टी के साथ काम करता है. इन प्रॉपर्टी को फ़ील्ड की तरह ही कहा जाता है, लेकिन इनकी वैल्यू, एक्सप्रेशन का आकलन करके डाइनैमिक तरीके से तय की जाती है. आप इन्हें पहचान सकते हैं प्रॉपर्टी को इनके इस्तेमाल के आधार पर बनाया जाता है: by सिंटैक्स:

class DelegatingClass {
    var name: String by nameGetterFunction()

    // ...
}

अन्य कोड, इस तरह के कोड के साथ प्रॉपर्टी को ऐक्सेस कर सकते हैं:

val myDC = DelegatingClass()
println("The name property is: " + myDC.name)

जब println() काम करता है, तो वैल्यू पाने के लिए nameGetterFunction() को कॉल किया जाता है डालें.

ये प्रॉपर्टी, राज्य की ओर से मैनेज की जाने वाली प्रॉपर्टी के साथ काम करते समय खास तौर पर काम की होती हैं:

var showDialog by remember { mutableStateOf(false) }

// Updating the var automatically triggers a state change
showDialog = true

डेटा क्लास को बनाया जा रहा है

अगर आपने किसी ऐसे डेटा को क्लास, तो आप आसानी से डेटा को डिस्ट्रक्चरिंग एलान के बारे में ज़्यादा जानें. उदाहरण के लिए, मान लें कि आपने Person क्लास तय की है:

data class Person(val name: String, val age: Int)

अगर आपके पास उस तरह का कोई ऑब्जेक्ट है, तो उसकी वैल्यू को ऐक्सेस करने के लिए, शामिल करें:

val mary = Person(name = "Mary", age = 35)

// ...

val (name, age) = mary

आपको Compose फ़ंक्शन में अक्सर इस तरह के कोड दिखेंगे:

Row {

    val (image, title, subtitle) = createRefs()

    // The `createRefs` function returns a data object;
    // the first three components are extracted into the
    // image, title, and subtitle variables.

    // ...
}

डेटा क्लास कई अन्य काम की सुविधाएं भी देती हैं. उदाहरण के लिए, जब डेटा क्लास को परिभाषित करने की कोशिश करते हैं, तो कंपाइलर अपने-आप ही इस तरह के उपयोगी फ़ंक्शन को परिभाषित करता है equals() और copy(). ज़्यादा जानकारी के लिए, डेटा में क्लास के दस्तावेज़ देखें.

सिंगलटन ऑब्जेक्ट

Kotlin में सिंग्लटन, यानी ऐसी क्लास का एलान करना आसान है जिनका हमेशा एक और सिर्फ़ एक इंस्टेंस होता है. इन सिंगलटन को object कीवर्ड के साथ एलान किया जाता है. कॉम्पोज़ करने के लिए, अक्सर ऐसे ऑब्जेक्ट का इस्तेमाल किया जाता है. उदाहरण के लिए, MaterialTheme है सिंगलटन ऑब्जेक्ट के तौर पर परिभाषित किया जाएगा; MaterialTheme.colors, shapes, और typography प्रॉपर्टी में मौजूदा थीम की वैल्यू शामिल होती हैं.

टाइप-सेफ़ बिल्डर और डीएसएल

Kotlin की मदद से डोमेन के हिसाब से भाषाएं (डीएसएल) बनाई जा सकती हैं इस्तेमाल करने में आसान है. डीएसएल की मदद से, जटिल हैरारकी वाला डेटा बनाया जा सकता है रखरखाव और आसानी से पढ़ा जा सकता है.

Jetpack Compose कुछ एपीआई के लिए डीएसएल का इस्तेमाल करता है, जैसे कि LazyRow और LazyColumn.

@Composable
fun MessageList(messages: List<Message>) {
    LazyColumn {
        // Add a single item as a header
        item {
            Text("Message List")
        }

        // Add list of messages
        items(messages) { message ->
            Message(message)
        }
    }
}

Kotlin, रिसीवर के साथ फ़ंक्शन लिटरल का इस्तेमाल करके, टाइप-सेफ़ बिल्डर की गारंटी देता है. अगर Canvas composable को उदाहरण के तौर पर लिया जाता है, तो यह पैरामीटर के तौर पर एक फ़ंक्शन लेता है, जिसमें DrawScope को रिसीवर onDraw: DrawScope.() -> Unit के तौर पर इस्तेमाल किया जाता है. इससे कोड के ब्लॉक को DrawScope में तय किए गए सदस्य फ़ंक्शन को कॉल करने की अनुमति मिलती है.

Canvas(Modifier.size(120.dp)) {
    // Draw grey background, drawRect function is provided by the receiver
    drawRect(color = Color.Gray)

    // Inset content by 10 pixels on the left/right sides
    // and 12 by the top/bottom
    inset(10.0f, 12.0f) {
        val quadrantSize = size / 2.0f

        // Draw a rectangle within the inset bounds
        drawRect(
            size = quadrantSize,
            color = Color.Red
        )

        rotate(45.0f) {
            drawRect(size = quadrantSize, color = Color.Blue)
        }
    }
}

Kotlin के दस्तावेज़ में, टाइप-सेफ़ बिल्डर और डीएसएल के बारे में ज़्यादा जानें.

Kotlin कोरूटीन

कोरूटीन, Kotlin में भाषा के लेवल पर एसिंक्रोनस प्रोग्रामिंग की सुविधा देते हैं. कोरूटीन, थ्रेड को ब्लॉक किए बिना एक्ज़ीक्यूशन को निलंबित कर सकते हैं. रिस्पॉन्सिव यूज़र इंटरफ़ेस (यूआई) में, एपीआई के लेवल पर कॉलबैक के बजाय कोरूटीन का इस्तेमाल किया जाता है.

Jetpack Compose ऐसे एपीआई ऑफ़र करता है जो यूज़र इंटरफ़ेस (यूआई) लेयर में कोरूटीन के इस्तेमाल को सुरक्षित बनाते हैं. rememberCoroutineScope फ़ंक्शन, CoroutineScope रिटर्न करता है. इसकी मदद से, इवेंट हैंडलर में कोरूटीन बनाए जा सकते हैं और Compose के सस्पेंड एपीआई को कॉल किया जा सकता है. नीचे दिया गया उदाहरण देखें. ScrollState की animateScrollTo एपीआई.

// Create a CoroutineScope that follows this composable's lifecycle
val composableScope = rememberCoroutineScope()
Button(
    // ...
    
        // Create a new coroutine that scrolls to the top of the list
        // and call the ViewModel to load data
        composableScope.launch {
            scrollState.animateScrollTo(0) // This is a suspend function
            viewModel.loadData()
        }
    }
) { /* ... */ }

कोरूटीन, कोड के ब्लॉक को डिफ़ॉल्ट रूप से एक क्रम में एक्ज़ीक्यूट करते हैं. दौड़ने के लिए कोरूटीन, जो सस्पेंड फ़ंक्शन को कॉल करता है. यह तब तक निलंबित हो जाता है, जब तक सस्पेंड फ़ंक्शन रिटर्न. यह तब भी लागू होता है, जब निलंबन फ़ंक्शन भिन्न CoroutineDispatcher में चलाने के लिए. पिछले उदाहरण में, loadData तब तक लागू नहीं होगा, जब तक कि निलंबित करने वाला फ़ंक्शन animateScrollTo नतीजे के तौर पर न दिखे.

एक साथ कई कोड चलाने के लिए, नए कोरुटाइन बनाने होंगे. उदाहरण में का इस्तेमाल करें. इससे स्क्रीन के सबसे ऊपरी हिस्से तक स्क्रोल करने और viewModel, दो कोरूटीन की ज़रूरत होती है.

// Create a CoroutineScope that follows this composable's lifecycle
val composableScope = rememberCoroutineScope()
Button( // ...
    
        // Scroll to the top and load data in parallel by creating a new
        // coroutine per independent work to do
        composableScope.launch {
            scrollState.animateScrollTo(0)
        }
        composableScope.launch {
            viewModel.loadData()
        }
    }
) { /* ... */ }

कोरूटीन की मदद से एसिंक्रोनस एपीआई को जोड़ना आसान हो जाता है. निम्न में उदाहरण के लिए, हम pointerInput मॉडिफ़ायर को ऐनिमेशन एपीआई के साथ मिलाते हैं, ताकि जब उपयोगकर्ता स्क्रीन पर टैप करे, तब एलिमेंट की पोज़िशन ऐनिमेट करें.

@Composable
fun MoveBoxWhereTapped() {
    // Creates an `Animatable` to animate Offset and `remember` it.
    val animatedOffset = remember {
        Animatable(Offset(0f, 0f), Offset.VectorConverter)
    }

    Box(
        // The pointerInput modifier takes a suspend block of code
        Modifier
            .fillMaxSize()
            .pointerInput(Unit) {
                // Create a new CoroutineScope to be able to create new
                // coroutines inside a suspend function
                coroutineScope {
                    while (true) {
                        // Wait for the user to tap on the screen
                        val offset = awaitPointerEventScope {
                            awaitFirstDown().position
                        }
                        // Launch a new coroutine to asynchronously animate to
                        // where the user tapped on the screen
                        launch {
                            // Animate to the pressed position
                            animatedOffset.animateTo(offset)
                        }
                    }
                }
            }
    ) {
        Text("Tap anywhere", Modifier.align(Alignment.Center))
        Box(
            Modifier
                .offset {
                    // Use the animated offset as the offset of this Box
                    IntOffset(
                        animatedOffset.value.x.roundToInt(),
                        animatedOffset.value.y.roundToInt()
                    )
                }
                .size(40.dp)
                .background(Color(0xff3c1361), CircleShape)
        )
    }

कोरूटीन के बारे में ज़्यादा जानने के लिए, यहां जाएं: Android पर Kotlin कोरूटीन गाइड.