WPF (Windows Presentation Foundation) - 06

অনেকেই বলে শুধু আঁকি-ঝুকি দিয়ে কি প্রোগ্রামিং হয়? লজিক কোথায় লিখব? ইভেন্ট হ্যান্ডেলার ছাড়া ভাল লাগে না। আসলে WPF হচ্ছে XAML দিয়ে ইউজার ইন্টারফেস তৈরি করা, তার পিছনে থাকে সি#। C# এ আগের মতই ইভেন্ট হ্যান্ডেলার রয়েছে। তাছাড়াও MVVM প্যাটার্ন ব্যাবহার করে কমান্ড বাইংডিং এর মাধ্যমে কাজ করা যায়। আমি আর দু-একটা পর্ব পরেই ইভেন্ট হ্যান্ডেলার ও কমান্ড বাইনডিং নিয়ে বিস্তারিত লিখার চিন্তা করতে ছিলাম। কিন্তু পারা গেল না। ইভেন্ট হ্যান্ডেলিং এখনই শুরু করতে হল।

আসুন জেনে নেই কি হয়, যখন আমরা একটা WPF এপ্লিকেশন তৈরি করি।

• একটা WPF এপ্লিকেশন তৈরি করুন, সাহায্য এখান থেকে
• VS-2010 এর View থেকে Solution Explorer এ ক্লিক করুন
• বাম পাশে দেখুন আপনার সলুশনে চারটা আইটেম দেখাচ্ছে (নিচের মত)
• এখানে App.xaml ও MainWindow.xaml নামে দুইটা এক্স.এ.এম.এল ফাইল আছে। এ দুটা ফাইলকে এক্সপান্ড করলে আরো দুটা ফাইল পাওয়া যাবে। নিচে দেখুন
• MainWindow.xaml.cs ফাইল হল MainWindow.xaml ফাইলের কোড বিহাইন্ড ফাইল। দুটো ফাইলেই একটা করে পার্শিয়াল ক্লাস রয়েছে। পার্শিয়াল ক্লাস হচ্ছে এমন একটা ক্লাস যেটা দুটা ভাবে বিভক্ত, কিন্তু কম্পাইলের সময় একটা ক্লাস হিসাবে কাজ করে। সহজ কথায় একটা ক্লাসকে দুই ভাগে ভাগ করে দু'জায়গায় রাখা।
• .xaml ফাইলে xaml এর ট্যাগ ব্যাবহার করে কোড করা যায়। নিচে xaml ফাইলের কোড দেখুন
• <Window x:Class="WpfApplication1.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="MainWindow" Height="350" Width="525"> <Grid> </Grid>
  

</Window>

• .cs ফাইলে c# দিয়ে কোড করা হয়। c# ফাইলে ভিতরের কোড দেখতে MainWindow.xaml.cs ডাবল ক্লিক করুন, নিচের মত কোড দেখতে পাবেন।
  

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace WpfApplication1
{
///

/// Interaction logic for MainWindow.xaml ///

public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
}
}

• এখন MainWindow ক্লাসে লজিক, লুপ বা ইভেন্ট হ্যান্ডেলিং এর জন্য আমরা MainWindow.xaml.cs ফাইল ব্যবহার করব
• আর ইউজার ইন্টারফেস তৈরির জন্য MainWindow.xaml এ কোড লিখব। এভাবেই আমরা ইউজার ইন্টারফেস থেকে কোডের লজিককে আলাদা রাখব।

সবচেয়ে সহজ একটা কাজ করব, যেখানে দুটা টেক্সট বক্স, একটা টেক্সট ব্লক এবং একটা বাটন থাকবে। প্রথমে টেক্সট বক্স দুটা থেকে আমরা দুইটা ইন্টেজার মান নিব, বাটনে ক্লিক করার সাথে সাথে তা যোগ হয়ে টেক্সট ব্লকে দেখাবে। এর জন্য যে ডিজাইন করা হবে তার বিস্তারিত বর্ণনা করা হবে না, শুধু কোড দেয়া হবে। নিচে ডিজাইন অংশের কোড দেখুন
<Window x:Class="WpfApplication1.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="MainWindow" Height="350" Width="525">

<Grid>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="166*" />
<ColumnDefinition Width="337*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>

<RowDefinition Height="48*" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="31" />
<RowDefinition Height="Auto" />
<RowDefinition Height="122*" />

</Grid.RowDefinitions>

<Label Content="First Number" Grid.Row="1" Name="lblFirst" Margin="5" HorizontalContentAlignment="Right" />

<Label Content="Second Number" Grid.Row="2" Name="lblSecond" Margin="5" HorizontalContentAlignment="Right" />

<TextBox Grid.Column="1" Grid.Row="1" Name="txtFirst" Margin="5,5,95,5" />

<TextBox Grid.Column="1" Grid.Row="2" Name="txtSecond" Margin="5,5,95,5" />

<Label Content="Result" Grid.Row="4" Name="lblResutl" HorizontalContentAlignment="Right" />
<TextBlock Grid.Column="1" Grid.Row="4" Name="txblkResult" />

<Button Content="ADD" Grid.Column="1" Grid.Row="3" Height="23" HorizontalAlignment="Left" Margin="5,5,0,0" Name="btnResult" VerticalAlignment="Top" Width="75" Click="btnResult_Click"/>

</Grid>
</Window>

• btnResult বাটনের ক্লিক ইভেন্ট হ্যান্ডেলার তৈরি করার জন্য btnResult_Click লেখার উপর রাইট ক্লিক করলে যে মেনু আসবে তার Navigate to Event Handler এ ক্লিক করলেই MainWindow.xaml.cs ফাইলে ইভেন্ট হ্যান্ডেলার তৈরি হয়ে যাবে।
• 
• নিচের কোডে MainWindow.xaml.cs এর পরিবর্তন দেখি

namespace WpfApplication1
{
///

/// Interaction logic for MainWindow.xaml
///

public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}

private void btnResult_Click(object sender, RoutedEventArgs e)
{

}
}
}

• এখন এই ডিজাইন অংশে যে সমস্ত কন্টেইনার নেয়া হয়েছে যেমন Text Box, Level, Text Block ইত্যাদি তার সবগুলিই MainWindow.xaml.cs ক্লাসে পাওয়া যাবে কমপ্লিট করতে হবে। কোডে দেখুন

namespace WpfApplication1
{
///

/// Interaction logic for MainWindow.xaml
///

public partial class MainWindow : Window
{
int
first,
second,
result;

public MainWindow()
{
InitializeComponent();
}

private void btnResult_Click(object sender, RoutedEventArgs e)
{
first = Convert.ToInt32(txtFirst.Text);
second = Convert.ToInt32(txtSecond.Text);
result = first + second;

txblkResult.Text = result.ToString();
}
}
}
আউটপুট দেখুন


এভাবেই WPF এ ইভেন্ট হ্যান্ডেলিং এর কাজ করা হয়।