Windows 8 Store Apps學習(37) 契約: Settings Contract

介紹

重新想象 Windows 8 Store Apps 之 契約

Settings Contract - 右側邊欄稱之為 Charm， 其中的“設定”稱之為 Settings Contract

樣本

示範 Settings Contract 的應用

Contracts/SettingsContract/Demo.xaml

<Page    x:Class="XamlDemo.Contracts.SettingsContract.Demo"    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"    mc:Ignorable="d">        <Grid Background="Transparent">        <StackPanel Margin="120 0 0 0">                <Button Name="btnAddSettings" Content="註冊 SettingsPane 的 CommandsRequested 事件" Click="btnAddSettings_Click_1" />                <Button Name="btnShowSettings" Content="開啟 SettingsPane" Click="btnShowSettings_Click_1" Margin="0 10 0 0" />                <TextBlock Name="lblMsg" FontSize="14.667" TextWrapping="Wrap" Margin="0 10 0 0" />                        </StackPanel>    </Grid></Page>

Contracts/SettingsContract/Demo.xaml.cs

/* * Settings Contract - 右側邊欄稱之為 Charm，其中的“設定”稱之為 Settings Contract *  * SettingsPane - 設定面板 *     GetForCurrentView() - 擷取當前的 SettingsPane *     Show() - 開啟 SettingsPane *     CommandsRequested - 每次開啟 SettingsPane 時所觸發的事件（兩個類型為 SettingsPane 和 SettingsPaneCommandsRequestedEventArgs 的參數） *      * UICommandInvokedHandler - 單擊設定面板中的設定項時引發的事件的回呼函數，是一個委託（一個類型為 IUICommand 的參數，SettingsCommand 實現了此介面） *  * SettingsCommand - 設定面板中的設定項 *     Id - 設定項的 ID，標識用 *     Label - 設定項的名稱，顯示用 *     Invoked - 指定單機設定項後，引發的事件的處理常式 *      * SettingsPaneCommandsRequestedEventArgs - CommandsRequested 事件中的事件參數 *     Request - 返回 SettingsPaneCommandsRequest 類型的資料 *      * SettingsPaneCommandsRequest - 包含了 CommandsRequested 事件中的可用屬性 *     ApplicationCommands - SettingsCommand 集合 */    using System;using Windows.UI.ApplicationSettings;using Windows.UI.Popups;using Windows.UI.Xaml;using Windows.UI.Xaml.Controls;using Windows.UI.Xaml.Controls.Primitives;using Windows.UI.Xaml.Media.Animation;using Windows.UI.Xaml.Navigation;    namespace XamlDemo.Contracts.SettingsContract{    public sealed partial class Demo : Page    {        // 彈出自訂的詳細設定頁時，所用到的彈出框        private Popup _settingsPopup = new Popup();        // 是否註冊了 SettingsPane 的 CommandsRequested 事件        private bool _commandsRequestedRegistered = false;            public Demo()        {            this.InitializeComponent();        }            protected override void OnNavigatedFrom(NavigationEventArgs e)        {            base.OnNavigatedFrom(e);                // 離開此頁則去掉 CommandsRequested 監聽            if (this._commandsRequestedRegistered)            {                SettingsPane.GetForCurrentView().CommandsRequested -= onCommandsRequested;                _commandsRequestedRegistered = false;            }        }            // 添加設定項，即初始化自訂的設定項        private void btnAddSettings_Click_1(object sender, RoutedEventArgs e)        {            if (!_commandsRequestedRegistered)            {                // 註冊 SettingsPane 的 CommandsRequested 事件                SettingsPane.GetForCurrentView().CommandsRequested += onCommandsRequested;                _commandsRequestedRegistered = true;            }            else            {                lblMsg.Text += "已經為 SettingsPane 註冊了 CommandsRequested 事件";                lblMsg.Text += Environment.NewLine;            }        }            // 顯示 SettingsPane        private void btnShowSettings_Click_1(object sender, RoutedEventArgs e)        {            SettingsPane.Show();        }            void onCommandsRequested(SettingsPane settingsPane, SettingsPaneCommandsRequestedEventArgs eventArgs)        {            // 初始化 SettingsPane 中的設定項            UICommandInvokedHandler handler = new UICommandInvokedHandler(onSettingsCommand);                SettingsCommand aboutCommand = new SettingsCommand("about", "關於", handler);            eventArgs.Request.ApplicationCommands.Add(aboutCommand);                SettingsCommand contactCommand = new SettingsCommand("contactUs", "聯絡我們", handler);            eventArgs.Request.ApplicationCommands.Add(contactCommand);                SettingsCommand flyoutCommand = new SettingsCommand("flyout", "彈出一個類“設定”風格的詳細設定頁", handler);            eventArgs.Request.ApplicationCommands.Add(flyoutCommand);        }            // 響應 SettingsPane 中的各個自訂設定項的命令        void onSettingsCommand(IUICommand command)        {            SettingsCommand settingsCommand = (SettingsCommand)command;            lblMsg.Text += string.Format("commandId:{0} - label:{1}", settingsCommand.Id.ToString(), settingsCommand.Label);            lblMsg.Text += Environment.NewLine;                // 通過 SettingsCommand.Id 來判斷使用者單機了哪個設定項            if (settingsCommand.Id.ToString() == "flyout")            {                // 詳細設定頁的寬度                double settingsPageWidth = 600;                    // 設定用於攜帶詳細設定頁的 Popup 的基本屬性                _settingsPopup.IsLightDismissEnabled = true;                _settingsPopup.Width = settingsPageWidth;                _settingsPopup.Height = Window.Current.Bounds.Height;                    // 為彈出框增加 PaneThemeTransition 的效果                _settingsPopup.ChildTransitions = new TransitionCollection();                _settingsPopup.ChildTransitions.Add(new PaneThemeTransition()                {                    Edge = EdgeTransitionLocation.Right                });                    // 執行個體化自訂的詳細設定頁，並將其放到 Popup 內                CustomSettingsPage mySettingsPage = new CustomSettingsPage();                mySettingsPage.Width = settingsPageWidth;                mySettingsPage.Height = Window.Current.Bounds.Height;                _settingsPopup.Child = mySettingsPage;                    // 指定 Popup 的顯示位置                _settingsPopup.HorizontalOffset = Window.Current.Bounds.Width - settingsPageWidth;                _settingsPopup.VerticalOffset = 0;                _settingsPopup.IsOpen = true;            }        }    }}