Windows App开发之集成设置帮助搜索和共享

Posted 2020-10-01

应用设置和应用帮助

”设置“合约

上一节中我们学习了怎样将应用设置保存到本地。这样的方式是通过在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))