Microsoft Technologies MVVM (Model-View-ViewModel) Pattern এর সাথে Data Binding গাইড ও নোট

MVVM (Model-View-ViewModel) একটি সফটওয়্যার আর্কিটেকচার প্যাটার্ন যা বিশেষভাবে WPF (Windows Presentation Foundation), UWP (Universal Windows Platform), Xamarin, এবং অন্যান্য .NET অ্যাপ্লিকেশনের জন্য ডিজাইন করা হয়েছে। এই প্যাটার্নটি ইউজার ইন্টারফেস এবং অ্যাপ্লিকেশন লজিকের মধ্যে স্পষ্ট বিভাজন তৈরি করতে সাহায্য করে, যা কোডকে আরও মেইনটেনেবল এবং টেস্টেবল করে তোলে। MVVM প্যাটার্নের মূল উপাদানগুলি হল:

• Model: ডেটা এবং বিজনেস লজিকের প্রতিনিধিত্ব।
• View: UI উপাদান বা ইন্টারফেস যা ব্যবহারকারীর সাথে সরাসরি ইন্টারঅ্যাক্ট করে।
• ViewModel: View এবং Model এর মধ্যে একটি আবস্ট্র্যাকশন লেয়ার, যা View কে Model থেকে ডেটা প্রদান এবং কন্ট্রোল করার জন্য দায়ী।

Data Binding হল MVVM প্যাটার্নের একটি গুরুত্বপূর্ণ ফিচার যা View এবং ViewModel এর মধ্যে ডেটা ট্রান্সফার সহজ এবং স্বয়ংক্রিয় করে। Data Binding এর মাধ্যমে আপনি ViewModel এর ডেটা ভ্যালুসমূহ সরাসরি View এর UI কন্ট্রোলসে প্রদর্শন করতে পারেন, এবং এতে ViewModel থেকে ডেটা ম্যানিপুলেট করতে পারে।

MVVM প্যাটার্নের উপাদান

১. Model

Model হল আপনার অ্যাপ্লিকেশনের ডেটা এবং বিজনেস লজিক। এটি সাধারণত ডেটাবেস বা API থেকে ডেটা আনে এবং কোনো লজিকাল প্রসেসিং করে থাকে। Model কোনো সরাসরি UI বা User Interaction এর সাথে সম্পর্কিত নয়।

উদাহরণ:

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

২. View

View হল UI উপাদান, যেমন বাটন, টেক্সটবক্স, লেবেল, এবং ইত্যাদি, যা ব্যবহারকারীর সাথে সরাসরি যোগাযোগ করে। View এ কোনো লজিক থাকে না, এটি শুধুমাত্র ইউজার ইন্টারফেস প্রদর্শন করে এবং ইন্টারঅ্যাকশনগুলি ViewModel এর সাথে যুক্ত হয়।

৩. ViewModel

ViewModel হল View এবং Model এর মধ্যে মধ্যস্থতাকারী। এটি Model থেকে ডেটা গ্রহণ করে এবং সেই ডেটা View এর জন্য উপযুক্ত ফরম্যাটে রূপান্তর করে। ViewModel এ লজিক থাকতে পারে, যেমন ডেটার পরিবর্তন, ফিল্টারিং, বা অ্যাপ্লিকেশন স্টেট ম্যানেজমেন্ট। ViewModel প্রাথমিকভাবে INotifyPropertyChanged ইন্টারফেস ব্যবহার করে ডেটা পরিবর্তনের সম্পর্কে View কে অবহিত করে।

Data Binding in MVVM

Data Binding হল MVVM প্যাটার্নে View এবং ViewModel এর মধ্যে যোগাযোগ স্থাপন করার একটি পদ্ধতি। Data Binding ব্যবহার করে, আপনি ViewModel এর প্রপার্টির মান সরাসরি UI কন্ট্রোল (যেমন TextBox, Button) এ প্রদর্শন করতে পারেন এবং UI কন্ট্রোলের ইভেন্টগুলোকে ViewModel এর মেথড বা প্রপার্টির সাথে যুক্ত করতে পারেন।

Binding Modes

XAML এ Binding Mode নির্ধারণ করে কিভাবে ViewModel এবং View এর মধ্যে ডেটা শেয়ার করা হবে। কিছু সাধারণ Binding Modes হল:

1. OneWay: শুধুমাত্র ViewModel থেকে View এ ডেটা ব্যাকআপ হয়।
2. TwoWay: View এবং ViewModel এর মধ্যে ডেটা দুদিক থেকে প্রবাহিত হয় (View থেকে ViewModel এবং ViewModel থেকে View)।
3. OneWayToSource: View থেকে ViewModel এ ডেটা প্রবাহিত হয় (এটি কম ব্যবহৃত হয়)।
4. OneTime: ডেটা শুধুমাত্র একবার ViewModel থেকে View এ প্রবাহিত হয় এবং পরে পরিবর্তন হলে তা রিফ্লেক্ট হয় না।

উদাহরণ:

<TextBox Text="{Binding Name, Mode=TwoWay}" />

এখানে, TextBox এর Text প্রপার্টি ViewModel এর Name প্রপার্টির সাথে TwoWay বাইন্ড করা হয়েছে। এর মানে, যদি ব্যবহারকারী TextBox এর মান পরিবর্তন করে, তবে ViewModel এর Name প্রপার্টি আপডেট হবে এবং তার বিপরীতে ViewModel থেকে View এ ডেটা আপডেট হবে।

Data Binding with Commands

Data Binding শুধুমাত্র ডেটার জন্য নয়, এটি কমান্ড (অথবা ইভেন্ট) সাপোর্ট করে। ICommand ইন্টারফেস ব্যবহার করে ViewModel এ যুক্ত মেথড বা কার্যক্রম View থেকে কল করা যায়।

উদাহরণ:

ViewModel এ একটি ICommand কমান্ড:

public class MyViewModel : INotifyPropertyChanged
{
    private string _name;
    public string Name
    {
        get { return _name; }
        set
        {
            _name = value;
            OnPropertyChanged(nameof(Name));
        }
    }

    public ICommand ChangeNameCommand { get; }

    public MyViewModel()
    {
        ChangeNameCommand = new RelayCommand(ChangeName);
    }

    private void ChangeName()
    {
        Name = "New Name";
    }

    public event PropertyChangedEventHandler PropertyChanged;

    protected virtual void OnPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

XAML এ Command Binding:

<Button Content="Change Name" Command="{Binding ChangeNameCommand}" />

এখানে, Button এর Command প্রপার্টি ViewModel এর ChangeNameCommand কমান্ডের সাথে বাইন্ড করা হয়েছে। যখন বাটনে ক্লিক করা হবে, তখন ChangeNameCommand এক্সিকিউট হবে এবং Name প্রপার্টি পরিবর্তন হবে।

Complete MVVM Example with Data Binding

Model:

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

ViewModel:

public class MainViewModel : INotifyPropertyChanged
{
    private UserModel _user;
    public string UserName
    {
        get { return _user.Name; }
        set
        {
            if (_user.Name != value)
            {
                _user.Name = value;
                OnPropertyChanged(nameof(UserName));
            }
        }
    }

    public MainViewModel()
    {
        _user = new UserModel { Name = "John", Age = 25 };
    }

    public event PropertyChangedEventHandler PropertyChanged;

    protected virtual void OnPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

View (XAML):

<Window x:Class="MVVMExample.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MVVM Example" Height="350" Width="525">
    <Grid>
        <TextBox Text="{Binding UserName, Mode=TwoWay}" Width="200" Height="30" Margin="10"/>
    </Grid>
</Window>

App.xaml.cs (ViewModel Binding):

public partial class App : Application
{
    public App()
    {
        var mainWindow = new MainWindow();
        var viewModel = new MainViewModel();
        mainWindow.DataContext = viewModel;
        mainWindow.Show();
    }
}

সারাংশ

• MVVM প্যাটার্নের মাধ্যমে, ViewModel UI এর লজিক এবং ডেটা পরিচালনা করে, View শুধুমাত্র ইউজার ইন্টারফেসকে রেন্ডার করে এবং Data Binding এই দুটির মধ্যে যোগাযোগ স্থাপন করে।
• Data Binding ব্যবহার করে, আপনি সহজেই ViewModel থেকে ডেটা View-এ এবং View থেকে ViewModel-এ পাঠাতে পারেন, এতে কোডের পুনঃব্যবহারযোগ্যতা এবং মেইনটেনেবিলিটি বাড়ে।
• ICommand ব্যবহার করে UI উপাদানগুলোর ইভেন্ট (যেমন বাটন ক্লিক) ViewModel এ হ্যান্ডল করা যায়।

এইভাবে, MVVM প্যাটার্ন এবং Data Binding ব্যবহার করে আপনি একটি পরিষ্কার, টেস্টেবল এবং পুনঃব্যবহারযোগ্য অ্যাপ্লিকেশন তৈরি করতে পারেন।