Data Template কী এবং কিভাবে এটি কাজ করে

Data Template হল WPF (Windows Presentation Foundation) এর একটি শক্তিশালী বৈশিষ্ট্য, যা ডেটা মডেল এবং UI কন্ট্রোলের মধ্যে সম্পর্ক স্থাপন করতে সহায়তা করে। Data Template ব্যবহার করে আপনি ডেটার কন্টেন্ট এবং প্রদর্শন (display) কাস্টমাইজ করতে পারেন, যাতে UI উপাদানগুলি ডেটার ভিত্তিতে প্রদর্শিত হয়।

WPF অ্যাপ্লিকেশনে, Data Template মূলত একটি UI কন্ট্রোলের কাস্টম লেআউট বা স্টাইলের টেমপ্লেট, যা একটি ডেটা অবজেক্টকে UI তে প্রদর্শন করার জন্য ব্যবহার করা হয়। এটি মূলত Collection বা ItemControl-এর জন্য ব্যবহৃত হয়, যেমন ListBox, ComboBox, ListView ইত্যাদি, যেখানে একাধিক আইটেম/ডেটা দেখানোর জন্য প্রয়োজন হয়।

Data Template এর মৌলিক ধারণা (Core Concept of Data Template)

Data Template একটি নির্দিষ্ট ডেটা টাইপের UI উপস্থাপনাকে কাস্টমাইজ করে, যা আপনার ডেটাকে একটি নির্দিষ্ট লেআউট এবং স্টাইল অনুসারে প্রদর্শন করতে সহায়তা করে। এটি UI কন্ট্রোলের স্টাইলের মতোই কাজ করে, কিন্তু এখানে আপনি কন্টেন্টের কাস্টম প্রদর্শন নির্ধারণ করতে পারেন।

Data Template এর বৈশিষ্ট্য (Features of Data Template)

• ডেটার কাস্টম ডিসপ্লে:
  Data Template আপনাকে ডেটার কাস্টম প্রদর্শন তৈরি করতে দেয়। উদাহরণস্বরূপ, আপনি একটি Person অবজেক্টকে একটি ListBox তে একটি বিশেষভাবে সাজানো UI তে প্রদর্শন করতে পারেন।
• বিভিন্ন ডেটা টাইপের জন্য কাস্টম লেআউট:
  আপনি একটি ডেটা টাইপের জন্য একটি নির্দিষ্ট UI লেআউট তৈরি করতে পারেন এবং সেই লেআউটটি নির্দিষ্ট ডেটার জন্য অ্যাপ্লাই করতে পারেন।
• UI কন্ট্রোলের সাথে বাইন্ডিং:
  Data Template UI কন্ট্রোলের সাথে ডেটা বাইন্ডিং করে কাজ করে। একে ItemsControl (যেমন ListBox, ListView, ComboBox) এর মধ্যে ডেটা কন্টেন্ট রেন্ডার করার জন্য ব্যবহার করা হয়।

Data Template এর উদাহরণ (Example of Data Template)

ধরা যাক, আমাদের কাছে একটি Person ক্লাস আছে, এবং আমরা একটি ListBox এ ব্যক্তির নাম এবং বয়স প্রদর্শন করতে চাই।

Person.cs (C# Model):

public class Person
{
    public string Name { get; set; }
    public int Age { get; set; }
}

এখন, আমরা DataTemplate ব্যবহার করে Person ক্লাসের ডেটা UI তে কাস্টমভাবে প্রদর্শন করব।

MainWindow.xaml:

<Window x:Class="WPFApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="DataTemplate Example" Height="350" Width="525">
    <Window.Resources>
        <!-- Define the DataTemplate -->
        <DataTemplate x:Key="PersonTemplate">
            <StackPanel>
                <TextBlock Text="{Binding Name}" FontWeight="Bold" FontSize="16"/>
                <TextBlock Text="{Binding Age}" FontSize="14"/>
            </StackPanel>
        </DataTemplate>
    </Window.Resources>

    <Grid>
        <ListBox ItemsSource="{Binding People}" ItemTemplate="{StaticResource PersonTemplate}" />
    </Grid>
</Window>

MainWindow.xaml.cs (Code Behind):

using System.Collections.ObjectModel;
using System.Windows;

namespace WPFApp
{
    public partial class MainWindow : Window
    {
        public ObservableCollection<Person> People { get; set; }

        public MainWindow()
        {
            InitializeComponent();
            People = new ObservableCollection<Person>
            {
                new Person { Name = "John", Age = 30 },
                new Person { Name = "Jane", Age = 25 },
                new Person { Name = "Bob", Age = 40 }
            };
            DataContext = this; // Set DataContext to bind the People collection
        }
    }
}

এখানে:

• PersonTemplate নামের একটি DataTemplate তৈরি করা হয়েছে, যা Person অবজেক্টের Name এবং Age প্রপার্টি প্রদর্শন করতে ব্যবহৃত হবে।
• ListBox এর ItemTemplate প্রপার্টি ব্যবহার করে, PersonTemplate কাস্টম টেমপ্লেট হিসেবে সেট করা হয়েছে।
• People নামের একটি ObservableCollection তৈরি করা হয়েছে, যা বিভিন্ন Person অবজেক্ট ধারণ করে এবং তা ListBox তে প্রদর্শিত হয়।

Data Template এর আরো উদাহরণ

ধরা যাক, আপনি একটি ListView ব্যবহার করছেন এবং সেখানে Person অবজেক্টের নাম, বয়স এবং একটি ছবি প্রদর্শন করতে চান:

MainWindow.xaml:

<Window x:Class="WPFApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="DataTemplate Example" Height="350" Width="525">
    <Window.Resources>
        <!-- Define the DataTemplate -->
        <DataTemplate x:Key="PersonTemplate">
            <StackPanel>
                <Image Source="{Binding Photo}" Width="50" Height="50"/>
                <TextBlock Text="{Binding Name}" FontWeight="Bold" FontSize="16"/>
                <TextBlock Text="{Binding Age}" FontSize="14"/>
            </StackPanel>
        </DataTemplate>
    </Window.Resources>

    <Grid>
        <ListView ItemsSource="{Binding People}" ItemTemplate="{StaticResource PersonTemplate}">
            <ListView.View>
                <GridView>
                    <GridViewColumn Header="Name" DisplayMemberBinding="{Binding Name}" />
                    <GridViewColumn Header="Age" DisplayMemberBinding="{Binding Age}" />
                </GridView>
            </ListView.View>
        </ListView>
    </Grid>
</Window>

Person.cs (Updated):

public class Person
{
    public string Name { get; set; }
    public int Age { get; set; }
    public string Photo { get; set; }
}

এখানে, ListView তে একটি GridView ব্যবহার করা হয়েছে এবং DataTemplate এর মাধ্যমে Photo, Name, এবং Age প্রদর্শন করা হয়েছে। আপনি ListView এর মাধ্যমে বিভিন্ন ধরনের কন্টেন্ট কাস্টমাইজড ভাবে প্রদর্শন করতে পারবেন।

Data Template এর কার্যকারিতা (How Data Template Works)

1. Binding:
   Data Template ডেটার সাথে বাইন্ডিংয়ের মাধ্যমে UI উপাদানগুলিকে ডেটার প্রপার্টির সাথে সম্পর্কিত করে। যেমন, আপনি টেক্সট ব্লক বা ইমেজ কন্ট্রোলের মাধ্যমে ডেটার প্রপার্টি প্রদর্শন করতে পারেন।
2. ItemsControl:
   Data Template সাধারণত ItemsControl (যেমন ListBox, ComboBox, ListView) এর সাথে ব্যবহৃত হয়। ItemsControl গুলি ডেটা সোর্স হিসেবে একটি কালেকশন নেয় এবং Data Template এর মাধ্যমে প্রতিটি আইটেমের UI উপস্থাপন তৈরি করে।
3. Customization:
   আপনি Data Template এর মধ্যে বিভিন্ন UI উপাদান যেমন StackPanel, Grid, Image, TextBlock ইত্যাদি ব্যবহার করে কাস্টম UI তৈরি করতে পারেন, যা ডেটার কাস্টম লেআউট প্রদর্শন করবে।

সারাংশ (Summary)

• Data Template WPF তে একটি শক্তিশালী বৈশিষ্ট্য যা ডেটার কন্টেন্ট প্রদর্শন করার জন্য কাস্টম UI লেআউট তৈরি করতে সহায়তা করে।
• Data Template এর মাধ্যমে আপনি বিভিন্ন ডেটা টাইপের জন্য কাস্টম লেআউট তৈরি করতে পারেন এবং UI কন্ট্রোলগুলোর সাথে ডেটা বাইন্ডিং করতে পারেন।
• এটি মূলত ItemsControl (যেমন ListBox, ComboBox, ListView) এর সাথে ব্যবহৃত হয়, যেখানে একাধিক ডেটা আইটেমকে কাস্টমভাবে UI তে প্রদর্শন করা হয়।