2012年12月7日 星期五

自定對話框按鍵內容

在 Windows Phone 上面若想要顯示訊息對話框,常常會遇到沒辦法自訂按鍵文字的限制,這在對話框的文案設計過程會造成困擾,我們必須設計答案為 "確定"、"取消" 的這種疑問句,或是寫出 "喜歡狗請按 OK,喜歡貓請按 Cancel" 這種不合常理的操作流程。

其他平台如 Android 預設就可以自訂按鍵上的文字,對軟體企劃者或用戶都比較友善。但現在 Windows Phone 上可以使用新版 Silverlight Toolkit 中所提供的 CustomMessageBox 也可以達到這個需求了,同樣的例子使用 CustomMessageBox 的範例如下

CustomMessageBox messageBox = new CustomMessageBox()
{
    Caption = "AppTitle",
    Message = "Which do you like?",
    LeftButtonContent = "dog",
    RightButtonContent = "cat"
};

messageBox.Show();

CustomMessageBox 之所以為 CustomMessageBox 是因為內部還有一個 Content 成員可以指定為任何的 UIElement 包括 Image、HyperlinkButton 等,當然也可以是 Grid、StackPanel 等容器,而 Content 會顯示在對話框的 Message 與 Button 中間,例如我們可以塞一個紅色的矩型進去

Rectangle rect = new Rectangle();
rect.Fill = new SolidColorBrush(Colors.Red);
rect.Width = 200;
rect.Height = 80;

CustomMessageBox messageBox = new CustomMessageBox()
{
    Caption = "AppTitle",
    Message = "Which do you like?",
    LeftButtonContent = "dog",
    RightButtonContent = "cat",
    Content = rect,
};

messageBox.Show();

雖然 CustomMessageBox 使用上很直覺,但需要特別注意 MessageBox.Show 為 static 方法,不需要建構一個 MessageBox 的 Instance,直接在 Show Method 中傳入訊息字串、標題,即可等待回傳值。而 CustomMessageBox 的 Show 不是 static 方法,所以必須宣告一個 CustomMessageBox 的 Instance 再使用 Show() 來將該對話框顯示出來。再來因為原本的 MessageBox 顯示訊息文字的區塊其實是有 ScrollView 包起來的,所以過長的文字可以提供垂直捲動的功能,而 CustomMessageBox 的訊息文字沒提供垂直捲動的功能,但可以針對將 ScrollView 塞到 Content 的方式取代。

在接對話框回傳值的行為及流程方面也有差異,MessageBox 的 回傳值只有 MessageBoxResult 所列舉出來的幾種,直接等待 Show Method 的回傳值即可。而 CustomMessageBox 必須在 Dismissed 事件中針對 DismissedEventArgs 參數做處理。除了流程的差異之外,行為上 MessageBox 是會卡住 UIThread 直到接獲回傳值,而 CustomMessageBox 是不會卡住 UIThread 直接往下繼續執行的,處理回傳值的範例如下

private void Button_Click(object sender, RoutedEventArgs e)
{
    CustomMessageBox messageBox = new CustomMessageBox()
    {
        Caption = "AppTitle",
        Message = "Which do you like?",
        LeftButtonContent = "dog",
        RightButtonContent = "cat",
    };

    messageBox.Dismissed += OnMessageBoxDismissed;

    messageBox.Show();
}

private void OnMessageBoxDismissed(object sender, DismissedEventArgs e)
{
    if (CustomMessageBoxResult.LeftButton == e.Result)
    {
    }
    else if (CustomMessageBoxResult.RightButton == e.Result)
    {
    }
    else
    {
    }
}


沒有留言:

張貼留言