XAML in Xamarin.Forms 基礎篇 電子書

XAML in Xamarin.Forms 基礎篇 電子書
XAML in Xamarin.Forms 基礎篇 電子書

Xamarin.Forms 快速入門 電子書

Xamarin.Forms 快速入門 電子書
Xamarin.Forms 快速入門 電子書

2017/04/29

在 Xamarin.Forms 中,如何使用 Prism EventToCommandBehavior 提供的事件轉換到命令的行為

這是升級到 Prism 6.3 版本之後,Prism 開發框架提供了許多新的功能,其中一個那就是 EventToCommandBehavior 這個功能,它提供了將 XAML 控制項的指定事件,當這個事件觸發的時候,會執行所設定的命令。
在以往,我們要使用這樣功能的時候,都會使用其他的 NuGet 套件,其中,將利用 Blend SDK 做出來的套件,則是更加好用;可是,往往在進行企業內部跨平台應用開發專案的時候,其實,會用到的這些行為,EventToCommandBehavior 則是最多、最實用的一個。
現在,只要您有使用 Prism 開發框架,就可以直接使用這個功能。
在這篇文章中,將會設計一個頁面,這個頁面上會有兩個按鈕,分別會使用 Prism 的 EventToCommandBehavior 將按鈕的 Clicked 事件,設定當這個事件觸發的時候,會執行同一個命令。在這裡,為了要能夠區分出是哪個按鈕所按下的,因此,使用了命令綁定中的 CommandParameter 來做分辨。
這篇文章中所使用的專案範例原始檔案,您可以從這裡取得

頁面 XAML

頁面中的 XAML 內容相當的簡單,要使用 Prism 的 EventToCommandBehavior 功能,首先,您需要宣告一個命名空間,如此,才能夠在其他的 XAML 控制項中,將 Prism 所提供的 EventToCommandBehavior 行為,加入到控制項的 Behaviors 集合內。
xmlns:behavior="clr-namespace:Prism.Behaviors;
在 XAML 中的每個 視覺項目 Visual Element 都會有個 Behaviors 屬性,我們可以將您所要指定的行為,加入到這個屬性中即可。
在底下的兩個按鈕控制項中,我們使用了這個方式,將 Prism 的EventToCommandBehavior加入到這兩個按鈕中。
在按鈕1中,使用了
  • EventName
    指定何種事件要被觸發的時候,才會執行這個行為
  • Command
    事件被觸發之後,要執行 ViewModel 內的命令是哪個
  • CommandParameter
    執行這個命令的時候,是否要傳遞哪個引數到命令中
其中,在按鈕1 中的 CommandParameter,我們使用了資料綁定的方式,指定要傳遞過去的物件值為所指定被綁定的屬性。
                <behavior:EventToCommandBehavior
                    EventName="Clicked"
                    Command="{Binding 請按下我Command}"
                    CommandParameter="{Binding 請按下我1}"/>
其中,在按鈕1 中的 CommandParameter,我們將要傳送過去的內容,直接使用字串的方式寫在 XAML 上;在這裡要表達的是,CommandParameter 的內容,可以使用資料綁定或者直接設定的方式來提供命令所要接收的參數內容。
                <behavior:EventToCommandBehavior
                    EventName="Clicked"
                    Command="{Binding 請按下我Command}"
                    CommandParameter="請按下我2"/>

MainPage.xaml

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
             xmlns:behavior="clr-namespace:Prism.Behaviors;assembly=Prism.Forms"
             prism:ViewModelLocator.AutowireViewModel="True"
             x:Class="XFPrismBehavior.Views.MainPage"
             Title="MainPage">

    <StackLayout HorizontalOptions="Center" VerticalOptions="Center">
        <Label Text="{Binding Title}" />

        <Button
           Text="{Binding 請按下我1}"
           >
            <Button.Behaviors>
                <behavior:EventToCommandBehavior
                    EventName="Clicked"
                    Command="{Binding 請按下我Command}"
                    CommandParameter="{Binding 請按下我1}"/>
            </Button.Behaviors>
        </Button>

        <Button
           Text="{Binding 請按下我2}"
           >
            <Button.Behaviors>
                <behavior:EventToCommandBehavior
                    EventName="Clicked"
                    Command="{Binding 請按下我Command}"
                    CommandParameter="請按下我2"/>
            </Button.Behaviors>
        </Button>

    </StackLayout>
</ContentPage>

頁面所使用到的 ViewModel

在 ViewModel 中,我們需要定義綁定在 View 中的命令物件,在這裡,我們需要使用 DelegateCommand 的泛型型別來宣告,由於這個命令要傳送過來的參數型別為 string,因此,在泛型中就設定了 string 型別。
        public DelegateCommand<string> 請按下我Command { get; set; }
在定義與產生這個命令物件的時候,我們可以透過該 DelegateCommand 泛型型別,取得 XAML 命令中所指定的 CommandParameter 值;在這個範例中,我們使用了 Prism 的 IPageDialogService 服務,將內容顯示在螢幕上。
            請按下我Command = new DelegateCommand<string>(async x =>
            {
                await _dialogService.DisplayAlertAsync("資訊", $"你按下的按鈕是: {x}", "確定");
            });

其他說明

由於現在 Xamarin.Forms 中的 ListView 中,關於使用者點選某筆紀錄的時候,僅僅提供了事件觸發的方式,並沒有提供相對應的命令可供使用,因此,我們可以透過這篇文章所提到的作法,並且參考 ListView 文件中有的事件,將其對應到我們在 ViewModel 內建立的命令物件,就可以在 ViewModel 中處理使用者點選某筆紀錄後,要執行的各種程式邏輯。

沒有留言:

張貼留言