Android ऐप में RecyclerView और ViewBinding का उपयोग करके शॉपिंग लिस्ट बनाएं: बिगिनर ट्यूटोरियल

जब भी आप किसी Android ऐप में प्रोडक्ट्स, चैट्स या कॉन्टैक्ट्स की लंबी लिस्ट देखते हैं, तो बैकएंड में RecyclerView ही काम कर रहा होता है। एंड्रॉइड डेवलपमेंट की शुरुआती दिनों में डेवलपर्स ListView का उपयोग करते थे, लेकिन बड़ी लिस्ट्स के साथ वह ऐप की परफ़ॉर्मेंस को धीमा कर देता था। RecyclerView मेमोरी की बचत करते हुए केवल उन्हीं आइटम्स को लोड करता है जो स्क्रीन पर दिखते हैं।

इस बिगिनर ट्यूटोरियल में, हम Kotlin और ViewBinding का उपयोग करके एक सिंपल 'Shopping List App' का UI बनाना सीखेंगे। यह ट्यूटोरियल आपको सिर्फ़ थ्योरी समझाने के बजाय प्रैक्टिकल कोडिंग का रियल-वर्ल्ड अनुभव देगा।

RecyclerView और ViewBinding क्यों जरूरी हैं?

पुराने 'findViewById' तरीक़े में कोड में गलत ID टाइप होने पर ऐप क्रैश होने का डर रहता था। ViewBinding इस समस्या को हल करता है और कंपाइल-टाइम सेफ्टी देता है। दूसरी तरफ, RecyclerView स्क्रीन से बाहर चले गए व्यूज़ को नष्ट करने के बजाय उन्हें रीसायकल करता है, जिससे मेमोरी लीक और ऐप लैग की समस्या नहीं होती।

स्टेप 1: प्रोजेक्ट सेटअप और ViewBinding इनेबल करें

सबसे पहले Android Studio में एक नया 'Empty Views Activity' प्रोजेक्ट बनाएं। इसके बाद ViewBinding को एक्टिवेट करने के लिए अपने प्रोजेक्ट की build.gradle.kts (Module :app) फ़ाइल खोलें और निम्नलिखित कोड जोड़ें:

android {
    ...
    buildFeatures {
        viewBinding = true
    }
}

इसके बाद स्क्रीन के ऊपर दिख रहे 'Sync Now' बटन पर क्लिक करें।

स्टेप 2: डेटा मॉडल क्लास (ShoppingItem) बनाएं

हमारी शॉपिंग लिस्ट में कौन-कौन सा डेटा रहेगा, इसे डिफाइन करने के लिए एक Kotlin Data Class की आवश्यकता होती है। प्रोजेक्ट में ShoppingItem.kt नाम से एक नई फ़ाइल बनाएं:

data class ShoppingItem(
    val itemName: String,
    val quantity: String
)

स्टेप 3: सिंगल आइटम लेआउट (XML) तैयार करें

RecyclerView में लिस्ट का हर एक रो कैसा दिखेगा, इसके लिए एक अलग XML लेआउट की जरूरत होती है। res/layout फोल्डर में जाकर item_shopping.xml नाम से एक लेआउट फ़ाइल बनाएं:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:padding="16dp">

    <TextView
        android:id="@+id/tvItemName"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:textSize="18sp"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/tvQuantity"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="16sp"
        android:textColor="#555555" />
</LinearLayout>

स्टेप 4: RecyclerView Adapter और ViewHolder बनाएं

एडेप्टर ही वह पुल (Bridge) है जो डेटा लिस्ट को लेआउट व्यूज़ के साथ जोड़ता है। एक नई फ़ाइल ShoppingAdapter.kt बनाएं:

import android.view.LayoutInflater
import android.view.ViewGroup
import androidx.recyclerview.widget.RecyclerView
import com.example.shoppingapp.databinding.ItemShoppingBinding

class ShoppingAdapter(private val itemList: List<ShoppingItem>) :
    RecyclerView.Adapter<ShoppingAdapter.ShoppingViewHolder>() {

    class ShoppingViewHolder(val binding: ItemShoppingBinding) :
        RecyclerView.ViewHolder(binding.root)

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ShoppingViewHolder {
        val binding = ItemShoppingBinding.inflate(
            LayoutInflater.from(parent.context),
            parent,
            false
        )
        return ShoppingViewHolder(binding)
    }

    override fun onBindViewHolder(holder: ShoppingViewHolder, position: Int) {
        val currentItem = itemList[position]
        holder.binding.tvItemName.text = currentItem.itemName
        holder.binding.tvQuantity.text = currentItem.quantity
    }

    override fun getItemCount(): Int = itemList.size
}

स्टेप 5: MainActivity में RecyclerView को कनेक्ट करें

अब मुख्य लेआउट फ़ाइल activity_main.xml में RecyclerView विजेट जोड़ें:

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/rvShoppingList"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

अब अंत में MainActivity.kt में डेटा लिस्ट बनाएं और एडेप्टर सेट करें:

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import androidx.recyclerview.widget.LinearLayoutManager
import com.example.shoppingapp.databinding.ActivityMainBinding

class MainActivity : AppCompatActivity() {

    private lateinit var binding: ActivityMainBinding
    private lateinit var adapter: ShoppingAdapter

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(binding.root)

        val sampleShoppingList = listOf(
            ShoppingItem("दूध (Milk)", "1 लीटर"),
            ShoppingItem("ब्रेड (Bread)", "1 पैकेट"),
            ShoppingItem("सेब (Apples)", "1 किलो"),
            ShoppingItem("चावल (Rice)", "5 किलो")
        )

        adapter = ShoppingAdapter(sampleShoppingList)
        binding.rvShoppingList.layoutManager = LinearLayoutManager(this)
        binding.rvShoppingList.adapter = adapter
    }
}

इस शॉपिंग लिस्ट प्रोजेक्ट से आपने क्या सीखा?

इस सिंपल प्रोजेक्ट में आपने देखा कि कैसे RecyclerView डेटा को व्यू में बदलता है। जब आप स्क्रीन को स्क्रॉल करते हैं, तो onCreateViewHolder केवल कुछ बार कॉल होता है, जबकि onBindViewHolder नए डेटा को पुराने व्यूज़ में रीसायकल करके दिखाता रहता है।

एंड्रॉइड डेवलपर्स के लिए बेस्ट प्रैक्टिसेस

• DiffUtil का इस्तेमाल करें: अगर आपकी लिस्ट का डेटा बार-बार अपडेट होता है, तो पूरी लिस्ट रीफ्रेश करने के बजाय ListAdapter और DiffUtil का उपयोग करें।
• ScrollView से बचें: कभी भी RecyclerView को साधारण ScrollView के अंदर न रखें, इससे रीसायकल करने की क्षमता खत्म हो जाती है।
• ViewHolder को लाइट रखें: onBindViewHolder के अंदर हैवी लॉजिक या डेटाबेस कॉल्स करने से बचें, इससे UI फ्रीज हो सकता है।

अक्सर पूछे जाने वाले सवाल (FAQs)

1. ListView और RecyclerView में सबसे बड़ा अंतर क्या है?

ListView में स्क्रीन से बाहर जाने वाले व्यूज़ रीसायकल नहीं होते और `findViewById` बार-बार कॉल होता है। RecyclerView में ViewHolder पैटर्न अनिवार्य होता है जो मेमोरी और CPU की खपत घटाता है।

2. RecyclerView में LayoutManager का क्या काम है?

LayoutManager तय करता है कि लिस्ट कैसी दिखेगी - वर्टिकल (LinearLayoutManager), ग्रिड (GridLayoutManager), या स्टैगर्ड ग्रिड (StaggeredGridLayoutManager)।

3. ViewBinding का उपयोग करना क्यों बेहतर है?

ViewBinding सीधे XML व्यूज़ का टाइप-सेफ़ रिफ़रेंस देता है, जिससे Null Pointer Exception (NPE) और गलत View ID कनेक्ट होने का ख़तरा ख़त्म हो जाता है।