کار با Dialog ها درWPF
پنجشنبه 24 تیر 1395در این مقاله، توضیحات جامع و کاملی پیرامون Dialog ها و همچنین نحوه ی استفاده از آن ها در تکنولوژی WPF ارائه می شود. در یک برنامه ساده، پیاده سازی Dialog ها نیز نمایش داده خواهد شد.
مقاله ها و راه حل های متفاوتی در رابطه با این موضوع وجود دارند. ساده ترین آنها بر مبنای static helper یا service classها هستند، حالت پیچیده تر آن ها نیز بر اساس صفات و ویژگی های WPF dependency فعالیت می کنند. هر کدام از این روش ها، مزایا و معایبی به همراه دارند. ما در این مقاله قصد نداریم مزایا و معایب این راه حل ها را مورد بررسی قرار دهیم، بلکه می خواهیم راه حل مورد علاقه خود را در رابطه با این موضوع به شما پیشنهاد کنیم. احتمالا این راه حل نیز نقاط قوت و ضعف خود را دارد. ما این راه حل را مرحله به مرحله برای شما توضیح خواهیم داد. این مراحل شامل مقدمات MVVM و همچنین dependency injection می باشند.
قسمت اول: MVVM
قدم اول: برای شروع یک پروژه از نوع WPF با نام WpfApplication1 ایجاد کنید.
قدم دوم : ما از الگوی MVVM (Model - View - ViewModel) برای توسعه برنامه ی ساده ی خود استفاده میکنیم. در این مرحله، می خواهیم پروژه را سازمان دهی کنیم و پوشه های جدید را اضافه کنیم. این پوشه ها عبارتند از : Model ها ، ViewModel ها ، View ها.
قدم سوم: فایل MainWindow.xaml را به پوشه Views می بریم و namespace ها را درxaml ویرایش میکنیم. فایل های code behind نیز در مکان جدیدی قرار میگیرند :
MainWindow.xaml: x:Class="WpfApplication1.Views.MainWindow";
MainWindow.xaml.cs: namespace WpfApplication1.Views.
قدم چهارم: صفت StartupUri را در App.xaml برای "Views/MainWindow.xaml" تنظیم میکنیم و سپس برنامه را اجرا می کنیم تا مطمئن شویم که این ویژگی درست کار میکند.
قدم پنجم : برای پیاده سازی درخواست های منطقی باید از کلاس RelayCommand استفاده کنیم. شما میتوانید این کلاس را دانلود کنید و آن را در root پروژه خود ذخیره کنید. RelayCommand.cs را به پروژه اضافه کنید و namespace را در WpfApplication1 تغییر دهید.
قدم ششم: ما باید RelayCommand را با پارامترهای بیشتری فراخوانی کنیم. برای این کار باید برخی تغییرات ایجاد کنیم :
_تمام “Action execute” ها را به “Action<object> execute” تغییر میدهیم.
_“this.execute();” را به “this.execute(parameter);” در متد public void Execute(object parameter) تغییر میدهیم.
شما می توانید از راه های دیگری نیز برای پیاده سازی RelayCommand همراه با پارامترها استفاده کنید.
قدم هفتم : در مراحل 7-11 ما تنها یک view model برای MainWindow پروژه خود ایجاد کردیم. یک public class جدید در پوشه ViewModels اضافه میکنیم و نام آن را MainWindowViewModel میگذاریم.
قدم هشتم : فضای نام System.Windows.Input را در MainWindowViewModel.cs اضافه کنید.
using System.Windows.Input;
قدم نهم : private field openDialogCommand را به همراه صفات آن به پروژه اضافه کنید .
private ICommand openDialogCommand = null; public ICommand OpenDialogCommand { get { return this.openDialogCommand; } set { this.openDialogCommand = value; } }
قدم دهم : متد private void method OnOpenDialog را اضافه کنید.
private void OnOpenDialog(object parameter) { }
قدم یازدهم : یک constructor بدون پارامتر در MainWindowViewModel ایجاد میکنیم و فیلد openDialogComand را با استفاده از RelayCommand ،مقدار دهی اولیه می کنیم .
public MainWindowViewModel() { this.openDialogCommand = new RelayCommand(OnOpenDialog); }
قدم دوازدهم: در مراحل 12-16 ، main window را با view model مربوط به خودش، مرتبط می کنیم. پروژه را Build میکنیم. App.xaml را باز میکنیم و فضای نام را به پوشه ی ViewModels اضافه میکنیم.
xmlns:viewModels="clr-namespace:WpfApplication1.ViewModels"
قدم سیزدهم : منبع مورد نیاز را برای MainWindowViewModel در بخش Application.Resources اضافه کنید.
<viewModels:MainWindowViewModel x:Key="MainWindowViewModel" />
قدم چهاردهم: فایل MainWindow.xaml را باز کنید و ویژگی DataContext مربوط به پنجره اصلی را مشخص کنید. (همراه با مشخصاتی مانند عنوان، عرض و ارتفاع )
DataContext="{StaticResource ResourceKey=MainWindowViewModel}"
قدم پانزدهم : یک دکمه به Grid node در MainWindow.xaml اضافه کنید و یک صفت Command برای bind کردن با صفت OpenDialogCommand در data context مشخص کنید.
<Button Content="Button" ... Command="{Binding OpenDialogCommand}" />
قدم شانزدهم : یک breakpoint در ابتدای متد OnOpenDialog در MainWindowViewModel بگذارید و پروژه را اجرا کنید. روی دکمه کلیک کنید و توجه کنید که اجرای پروژه بر روی breakpoint متوقف می شود.
قسمت دوم : DIALOG STRUCTURE
قدم هفدهم : در این قسمت می خواهیم یک modal dialog window ایجاد کنیم. یک پوشه جدید با نام Dialogs به پروژه اضافه کنید که دو subfolder با نام های DialogService و DialogYesNo در آن وجود دارد .
قدم هجدهم : همه ی dialogها باید آنچه را که توسط کاربر انتخاب شده است را به عنوان خروجی برگردانند. یک آیتم جدید با نام DialogResultEnum.cs به پوشه DialogService اضافه کنید، کلاس را با enum جایگزین کنید و ساختار آن را به همراه مقادیر dialog result تعریف کنید. برای مثال :
public enum DialogResult { Undefined, Yes, No }
قدم نوزدهم : یک پنجره جدید (WPF) در پوشه DialogService ایجاد کنید و نام آن را DialogWindow بگذارید.
قدم بیستم : یک صفت WindowStartupLocation به Window node اضافه کنید و قسمت Grid در DialogWindow را با ContentPresenter node جایگزین کنید.
<Window x:Class="WpfApplication1.Dialogs.DialogService.DialogWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="DialogWindow" Height="300" Width="300" WindowStartupLocation="CenterScreen"> <ContentPresenter x:Name="ContentPresenter" Content="{Binding}"></ContentPresenter> </Window>
قدم بیست و یک : یک کلاس public static جدید با نام DialogService.cs به پوشه DialogService اضافه کنید و public static method OpenDialog را تعریف کنید که DialogResult برگرداند.
public static DialogResult OpenDialog() { DialogWindow win = new DialogWindow(); win.ShowDialog(); return DialogResult.Undefined; }
قسمت بیست و دوم: به MainWindowViewModel باز گردید و متد OnOpenDialog را تغییر دهید.
private void OnOpenDialog(object parameter) { Dialogs.DialogService.DialogResult result = Dialogs.DialogService.DialogService.OpenDialog(); }
قدم بیست وسه : پروژه را اجرا کنید ، یک breakpoint در ابتدای متد OnOpenDialog بگذارید و روی دکمه موجود در پنجره اصلی (main window) کلیک کنید. Dialog window باید نمایش داده شود و بعد از بستن dialog ، متغیر باید مقداری از نوع DialogResult.Undefined را در خود ذخیره کرده باشد.
- WPF
- 2k بازدید
- 1 تشکر