Windows App開發之整合設定、協助、搜尋和共用

標籤：XML   show   dsr   底部   關於   div   center   window   help   

應用設定和應用協助”設定“合約

上一節中我們學習了怎樣將應用設定儲存到本地。這樣的方式是通過在App內加入設定選項，這裡另一種方式。

微軟將其稱為設定協定，並且全部的Windows市集應用都將自己主動配合這樣的合約。

可是應用內建的這樣的設定假設不做不論什麼改動可謂毫無作用。而我們加入這些設定則能夠讓應用更加個人化哦。

SettingsFlyout

首先建立一個SettingsFlyout頁面，或許非常多童鞋會像我當初學這個一樣立刻就偵錯工具等著看看這個設定是長什麼樣。只是如今還用不了哦。

例如以下所看到的。我們能夠改動IconSource來改變”設定“中的表徵圖。

然後我將設定介面的布局設定例如以下咯。

<StackPanel VerticalAlignment="Stretch"  HorizontalAlignment="Stretch" Orientation="Vertical">    <StackPanel Orientation="Vertical" >         <TextBlock Text="Big Car 的美好一天" FontSize="28" Foreground="Red" Margin="12"/>         <TextBlock Text="購買一輛Big Car會讓你的生活充滿活力，充滿激情！" FontSize="20" Margin="12" TextWrapping="Wrap" Foreground="Black"/>         <TextBlock Text="想購買的話能夠直接發郵件 [email protected]" FontSize="20" Margin="12"  Foreground="Gold" TextWrapping="Wrap"/>    </StackPanel>    <StackPanel Orientation="Vertical" Margin="8">         <ToggleSwitch x:Name="toggleSwitch1" Header="每日更新Big Car的最新圖片"  OnContent="On" OffContent="Off" Toggled="ToggleSwitch_Toggled" />         <ToggleSwitch x:Name="toggleSwitch2" Header="向我推送相關的動態" OnContent="On" OffContent="Off" Toggled="ToggleSwitch_Toggled" IsOn="True"/>     </StackPanel>     <StackPanel Orientation="Vertical" Margin="0,12,0,12">         <Button Content="好評該應用唄" Margin="12"/>         <Button Content="清除全部緩衝" Margin="12"/>    </StackPanel></StackPanel>

App.xaml.cs

先在app.xaml.cs中加入以下這條命名空間，和以下3個方法

using Windows.UI.ApplicationSettings;

protected override void OnWindowCreated(WindowCreatedEventArgs args){    SettingsPane.GetForCurrentView().CommandsRequested += OnCommandsRequested;}private void OnCommandsRequested(SettingsPane sender,SettingsPaneCommandsRequestedEventArgs args){    args.Request.ApplicationCommands.Add(new SettingsCommand("BigCarMainSettings", "Big Car 的主要設定", (handler) => ShowCustomSettingFlyout()));}public void ShowCustomSettingFlyout(){    BigCarSettings CustomSettingFlyout = new BigCarSettings();    CustomSettingFlyout.Show();}

當然了，在那些控制項中的點擊啥的最後都要在後台代碼中加入的。就像上一篇部落格那樣來儲存設定就好啦。

以上就是關於應用設定相同的內容咯。而應用協助嘛。和這些都是一樣的呀。

建立相同的目標就好了。

然後在XAML中改動成自己喜歡的樣子就好啦。並且和應用設定一樣。我們也能夠在底部設定應用程式列的，關於應用程式列的內容能夠查看第三章的“應用程式列”一節。

protected override void OnWindowCreated(WindowCreatedEventArgs args){     SettingsPane.GetForCurrentView().CommandsRequested += OnCommandsRequested;}private void OnCommandsRequested(SettingsPane sender, SettingsPaneCommandsRequestedEventArgs args){      args.Request.ApplicationCommands.Add(new SettingsCommand("BigCarHelp", "Big Car 的協助", (handler) => ShowHelpSettingsFlyout()));}public void ShowHelpSettingsFlyout(){      BigCarHelphelpSF = new BigCarHelp();      helpSF.Show();}

在應用中整合搜尋

上一節是關於怎樣加入應用設定和協助，這一篇講的是和設定相似的搜尋。

So…… Let’s do it !

先從簡單的頁面配置開始。想想我們須要什麼，一個帶搜尋事件的Button。還須要一些TextBlock來提示使用者，核心部分自然是一個GridView咯。

<Grid Background="Wheat">        <Grid.RowDefinitions>            <RowDefinition Height="Auto" />            <RowDefinition />        </Grid.RowDefinitions>        <StackPanel Grid.Row="0" Orientation="Vertical">            <Button Grid.Row="0" Name="btnSearch" VerticalAlignment="Center" HorizontalAlignment="Left"                 Content="搜尋" FontFamily="華文行楷" Click="btnSearch_Click" Margin="12" FontSize="34" Foreground="Red"/>            <StackPanel Orientation="Horizontal">                <TextBlock Text="搜尋關鍵詞" Foreground="Green" FontSize="28" Margin="12"/>                <TextBlock FontSize="28" Foreground="Green" Name="tBlockKeyword" Margin="12"/>            </StackPanel>                           </StackPanel>        <GridView Grid.Row="1" Margin="12" x:Name="gridView">            <GridView.ItemsPanel>                <ItemsPanelTemplate>                    <WrapGrid Orientation="Horizontal"/>                </ItemsPanelTemplate>            </GridView.ItemsPanel>            <GridView.ItemTemplate>                <DataTemplate>                    <TextBlock Text="{Binding}" FontSize="24" Foreground="Pink" FontFamily="楷體"/>                </DataTemplate>            </GridView.ItemTemplate>        </GridView>    </Grid>

既然介面完畢了，就該去後台搗鼓咯。搜尋的核心在於SearchPane，所以先來執行個體化它。為了簡化。我們就將待搜尋的內容設定為一串字串數組好了，當然了。初始化數組的方式大家任意就好了。

SearchPane searchPane = null;string[] exampleStr = new string[100];public  void InitExampleStr(){     Random ran = new Random();     int exNumber;     for(int i=0;i<100;i++)     {          exNumber = ran.Next(1000, 9999);          exampleStr[i] = exNumber.ToString();                                   }                                                                                     }

當使用者在搜尋方塊中輸入的內容發生了更改時就會觸發searchPane_QueryChange事件。

當使用者在完畢輸入後按下Enter鍵或者點擊旁邊的搜尋確認button後就會觸發searchPane_QuerySubmitted事件。

        void searchPane_QueryChanged(SearchPane sender, SearchPaneQueryChangedEventArgs args)        {                                                 this.tBlockKeyword.Text = args.QueryText;        }        void searchPane_QuerySubmitted(SearchPane sender, SearchPaneQuerySubmittedEventArgs args)        {                   string key = args.QueryText;            var result = exampleStr.Where(s => s.Contains(key))Windows App開發之整合設定、協助、搜尋和共用