Windows App開發之集成設置、幫助、搜索和共享

應用設置和應用幫助

」設置「合約

上一節中咱們學習了怎樣將應用設置保存到本地。這樣的方式是經過在App內加入設置選項,這裏另外一種方式。javascript

微軟將其稱爲「設置」合約,而且所有的Windows應用商店應用都將本身主動配合這樣的合約。java

但是應用自帶的這樣的設置假設不作不論什麼改動可謂毫無做用。而咱們加入這些設置則可以讓應用更加個性化哦。數組

SettingsFlyout

首先新建一個SettingsFlyout頁面,或許很是多童鞋會像我當初學這個同樣馬上就調試程序等着看看這個設置是長什麼樣。只是現在還用不了哦。緩存

例如如下所看到的。咱們可以改動IconSource來改變」設置「中的圖標。markdown

這裏寫圖片描寫敘述

而後我將設置界面的佈局設置例如如下咯。app

<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="想購買的話可以直接發郵件 nomasp@outlook.com" 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個方法dom

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();
}

這裏寫圖片描寫敘述

這裏寫圖片描寫敘述

這裏寫圖片描寫敘述

固然了,在那些控件中的點擊啥的最後都要在後臺代碼中加入的。就像上一篇博客那樣來保存設置就好啦。async

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

建立相同的目標就行了。佈局

而後在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)) 
 
    
相關文章
相關標籤/搜索