List — এটি কী, SwiftUI-তে তালিকা উপাদান

SwiftUI-তে List কী?

List একটি View যা আইটেমের ক্রম উল্লম্বভাবে স্ক্রোলযোগ্য তালিকায় প্রদর্শন করে। এটি iOS 13-এ SwiftUI-এর সাথে প্রবর্তিত হয়েছিল এবং এটি ডেটা তালিকা প্রদর্শনের প্রাথমিক উপায়, যা UIKit-এর UITableView-কে প্রতিস্থাপন করে। List স্বয়ংক্রিয়ভাবে সেল পুনঃব্যবহার, স্ক্রোলিং এবং কর্মক্ষমতা পরিচালনা করে।

List লেজি-লোডিং ব্যবহার করে: কোষগুলি স্ক্রোল করার সাথে সাথে তৈরি হয়, একবারে সব নয়। এটি এটিকে ScrollView-এর ভিতরে VStack এবং ForEach থেকে আলাদা করে, যেখানে রেন্ডার সময়ে সমস্ত কোষ তৈরি হয়। List সোয়াইপ অ্যাকশন, পুল-টু-রিফ্রেশ, এডিটিং (মুছুন/সরান) এবং সারি নির্বাচনের জন্য অন্তর্নির্মিত সমর্থনও প্রদান করে।

Apple WWDC 2021 (Session 10072) অনুসারে, iOS 15+-এ List সংগ্রহ স্তরে একটি নতুন ডিফিং মেকানিজমের কারণে উল্লেখযোগ্য কর্মক্ষমতা উন্নতি পেয়েছে। এটি ডেটা আপডেট করার সময় List-কে আরও দক্ষ করে তুলেছে, বিশেষ করে শত শত সারি বিশিষ্ট তালিকার জন্য।

List বনাম ScrollView + VStack

ডেভেলপাররা প্রায়শই Views-এর সেট প্রদর্শনের জন্য List এবং ScrollView-এর সাথে VStack-এর মধ্যে বেছে নেন। মূল পার্থক্য: List সেল পুনঃব্যবহার (UITableView-এর মতো) ব্যবহার করে, যেখানে ScrollView + VStack অবিলম্বে সমস্ত Views তৈরি করে। নির্দিষ্ট আকারের তালিকার জন্য (20টি আইটেম পর্যন্ত), পার্থক্য নগণ্য। 50+ সারি বিশিষ্ট ডায়নামিক তালিকার জন্য, কর্মক্ষমতার জন্য List পছন্দনীয়।

স্ট্যাটিক এবং ডাইনামিক তালিকা

স্ট্যাটিক তালিকা হল নির্দিষ্ট সংখ্যক সারি বিশিষ্ট একটি তালিকা যা সরাসরি List বডিতে উল্লেখ করা হয়। এটি মেনু, সেটিংস এবং পরিচিত আইটেম সেট সহ ফর্মের জন্য ব্যবহৃত হয়। প্রতিটি সারি লুপ বা ForEach ছাড়াই স্পষ্টভাবে ঘোষণা করা হয়।

// স্ট্যাটিক তালিকা (মেনু এবং সেটিংসের জন্য)
List {
    Text("প্রোফাইল")
    Text("সেটিংস")
    Text("সম্পর্কে")
}

// ডাইনামিক তালিকা (ডেটার জন্য)
struct UserList: View {
    let users: [User]

    var body: some View {
        List(users) { user in
            HStack {
                Text(user.name)
                Text(user.role)
                    .foregroundColor(.secondary)
            }
        }
    }
}

ডাইনামিক তালিকা List(data:rowContent:) ইনিশিয়ালাইজার বা List বডির ভিতরে ForEach ব্যবহার করে। প্রথম পদ্ধতিটি সুবিধাজনক যখন প্রতিটি সারি একটি ডেটা আইটেমের সাথে মিলে যায়। দ্বিতীয়টি উপযোগী যখন ডেটার মধ্যে সেকশন বা অতিরিক্ত আইটেম থাকে।

শনাক্তকরণ (Identifiable): ডায়নামিক তালিকার জন্য, ডেটা আইটেমগুলিকে Identifiable প্রোটোকল মেনে চলতে হবে, অথবা data:id টাপলে একটি অনন্য শনাক্তকারীতে KeyPath উল্লেখ করতে হবে। SwiftUI পরিবর্তনগুলি ট্র্যাক করতে শনাক্তকারী ব্যবহার করে: যোগ, মুছে ফেলা এবং সারি সরানো।

সেকশন এবং ডেটা গ্রুপিং

Section একটি View যা List-এ শিরোনাম এবং ঐচ্ছিক footer-সহ সারি গ্রুপ করে। Section header এবং footer-কে ViewBuilder হিসাবে গ্রহণ করে, যা সেকশন শিরোনামের জন্য শুধু টেক্সট নয়, কাস্টম Views ব্যবহার করার অনুমতি দেয়।

struct SettingsView: View {
    var body: some View {
        List {
            Section(header: Text("অ্যাকাউন্ট")) {
                Text("নাম")
                Text("ইমেল")
            }
            Section(header: Text("বিজ্ঞপ্তি")) {
                Toggle("Push", isOn: $pushEnabled)
                Toggle("Email", isOn: $emailEnabled)
            }
        }
        .listStyle(.insetGrouped)
    }
}

// ForEach-সহ ডাইনামিক সেকশন
List {
    ForEach(groupedData.keys.sorted(), id: \.self) { key in
        Section(header: Text(key)) {
            ForEach(groupedData[key]!) { item in
                Text(item.title)
            }
        }
    }
}

List শৈলী: SwiftUI .listStyle() মডিফায়ারের মাধ্যমে বেশ কয়েকটি অন্তর্নির্মিত শৈলী প্রদান করে। .insetGrouped — iOS Settings-এর জন্য মানক, .plain — ন্যূনতম, .inset — ইন্ডেন্টেশন সহ, .sidebar — iPad-এ Sidebar-এর জন্য।

SwiftUI Cookbook (2024) অনুসারে, ডায়নামিক সেকশন এবং ভিতরে ForEach-সহ Section জটিল কাঠামো সহ অ্যাপ্লিকেশনগুলিতে ডেটা গ্রুপিংয়ের জন্য একটি মানক প্যাটার্ন। মূল নিয়ম: Section-এর ভিতরে Section নেস্ট করবেন না, এবং Section-এর সাথে List(data:) ইনিশিয়ালাইজার ব্যবহার করবেন না — List বডির ভিতরে ForEach ব্যবহার করুন।

সোয়াইপ অ্যাকশন এবং পুল-টু-রিফ্রেশ

.swipeActions(edge:allowsFullSwipe:content:) — iOS 15+-এর জন্য একটি মডিফায়ার যা List সারিতে সোয়াইপ অ্যাকশন যুক্ত করে। এটি বামে (ডিফল্ট) বা ডানে সোয়াইপ করার সময় বিভিন্ন রঙ এবং ভূমিকা (destructive, cancel) সহ বোতাম প্রদর্শনের অনুমতি দেয়।

struct TaskList: View {
    @Binding var tasks: [Task]

    var body: some View {
        List {
            ForEach($tasks) { $task in
                Text(task.title)
                    .swipeActions(edge: .trailing) {
                        Button("মুছুন", role: .destructive) {
                            tasks.removeAll { $0.id == task.id }
                        }
                    }
                    .swipeActions(edge: .leading) {
                        Button(task.isDone ? "পূর্বাবস্থায় ফিরুন" : "সম্পন্ন") {
                            task.isDone.toggle()
                        }
                        .tint(.green)
                    }
            }
        }
        .refreshable {
            // এসিঙ্ক ডেটা লোডিং
            await loadTasks()
        }
    }
}

.refreshable — iOS 15+-এর জন্য একটি মডিফায়ার যা পুল-টু-রিফ্রেশ যুক্ত করে। এটি একটি async ক্লোজার গ্রহণ করে যা ব্যবহারকারী তালিকা নিচে টানলে কার্যকর হয়। SwiftUI স্বয়ংক্রিয়ভাবে একটি লোডিং ইন্ডিকেটর প্রদর্শন করে। অপারেশন শেষ হওয়ার পরে, ইন্ডিকেটর লুকিয়ে যায়।

.onDelete এবং .onMove — iOS 13+-এর জন্য মডিফায়ার যা সারি মুছে ফেলা এবং পুনর্বিন্যাসের জন্য সমর্থন যুক্ত করে। এগুলি ব্যবহার করতে, Binding-সহ ForEach-এ ডেটা মোড়ান বা List বা ForEach-এ .onDelete(perform:) এর মাধ্যমে ক্লোজার পাস করুন।

List-এর কর্মক্ষমতা এবং অপ্টিমাইজেশন

List-এর কর্মক্ষমতা সারির সংখ্যা, প্রতিটি কোষের জটিলতা এবং ডেটা আপডেটের ফ্রিকোয়েন্সির উপর নির্ভর করে। SwiftUI লেজি-লোডিং এবং সেল পুনঃব্যবহার (UITableView.dequeueReusableCell-এর অনুরূপ) ব্যবহার করে, কিন্তু 500+ সারি বিশিষ্ট তালিকার জন্য অতিরিক্ত অপ্টিমাইজেশনের প্রয়োজন হতে পারে।

সমস্যা 1: ঘন ঘন আপডেট. যদি তালিকার ডেটা ঘন ঘন আপডেট হয় (যেমন, প্রতি সেকেন্ডে), List প্রতিটি অবস্থা পরিবর্তনে দৃশ্যমান কোষ পুনরায় আঁকতে পারে। সমাধান: ডেটার জন্য স্ট্রাকচার (value types) ব্যবহার করুন — SwiftUI এগুলি মান দ্বারা তুলনা করে এবং শুধুমাত্র পরিবর্তিত সারিগুলি পুনরায় আঁকে।

সমস্যা 2: ভারী কোষ. যদি প্রতিটি সারিতে জটিল View শ্রেণিবিন্যাস, ছবি এবং অ্যানিমেশন থাকে, তাহলে স্ক্রোলিং ধীর হতে পারে। সমাধান: কোষগুলিকে আলাদা Views-এ বের করুন, অপ্রয়োজনীয় পুনরায় অঙ্কন প্রতিরোধে EquatableView ব্যবহার করুন। SwiftUI Lab (2024) অনুসারে, একটি জটিল সারিকে উপ-উপাদানে বিভক্ত করলে রেন্ডারিং সময় 30–50% কমে যায়।

সমস্যা 3: বিপুল সংখ্যক সারি. 1000+ সারির সাথে, List লেজি-লোডিংয়ের কারণে এখনও দক্ষতার সাথে কাজ করে, কিন্তু লেআউট গণনার কারণে প্রাথমিক লোডিং ধীর হতে পারে। সমাধান: শুধুমাত্র সমজাতীয় সারি বিশিষ্ট তালিকার জন্য LazyVStack ব্যবহার করুন যেখানে List বৈশিষ্ট্যের (সোয়াইপ, সেকশন) প্রয়োজন নেই। পূর্ণ-বৈশিষ্ট্যযুক্ত তালিকার জন্য, List সেরা পছন্দ হিসাবে থাকে।