重新想象 Windows 8 Store Apps (37) - 契约: Settings Contract

时间:2022-08-29 09:18:58

[源码下载]

重新想象 Windows 8 Store Apps (37) - 契约: Settings Contract

作者:webabcd

介绍
重新想象 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 = ; // 设置用于携带详细设置页的 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 = ;
_settingsPopup.IsOpen = true;
}
}
}
}

自定义的详细设置页
Contracts/SettingsContract/CustomSettingsPage.xaml

<Page
x:Class="XamlDemo.Contracts.SettingsContract.CustomSettingsPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:XamlDemo.Contracts.SettingsContract"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"> <Page.Resources>
<!--
详细设置页的左上角的返回按钮的样式
-->
<Style x:Key="SettingsBackButtonStyle" TargetType="Button">
<Setter Property="MinWidth" Value="0"/>
<Setter Property="FontFamily" Value="Segoe UI Symbol"/>
<Setter Property="FontWeight" Value="Normal"/>
<Setter Property="FontSize" Value="26.66667"/>
<Setter Property="AutomationProperties.AutomationId" Value="BackButton"/>
<Setter Property="AutomationProperties.Name" Value="Back"/>
<Setter Property="AutomationProperties.ItemType" Value="Navigation Button"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Grid x:Name="RootGrid" Width="30" Height="30">
<Grid Margin="-6,-6,0,0">
<TextBlock x:Name="BackgroundGlyph" Text="" Foreground="Transparent"/>
<TextBlock x:Name="NormalGlyph" Text="{StaticResource BackButtonSnappedGlyph}" Foreground="White"/>
<TextBlock x:Name="ArrowGlyph" Text="" Foreground="#00b2f0" Opacity="0"/>
</Grid>
<Rectangle x:Name="FocusVisualWhite" IsHitTestVisible="False" Stroke="{StaticResource FocusVisualWhiteStrokeThemeBrush}" StrokeEndLineCap="Square" StrokeDashArray="1,1" Opacity="0" StrokeDashOffset="1.5" />
<Rectangle x:Name="FocusVisualBlack" IsHitTestVisible="False" Stroke="{StaticResource FocusVisualBlackStrokeThemeBrush}" StrokeEndLineCap="Square" StrokeDashArray="1,1" Opacity="0" StrokeDashOffset="0.5" />
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
<VisualState x:Name="PointerOver">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGlyph" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource BackButtonPointerOverBackgroundThemeBrush}"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Pressed">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="BackgroundGlyph" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="White"/>
</ObjectAnimationUsingKeyFrames>
<DoubleAnimation Storyboard.TargetName="ArrowGlyph" Storyboard.TargetProperty="Opacity" To="1" Duration="0"/>
<DoubleAnimation Storyboard.TargetName="NormalGlyph" Storyboard.TargetProperty="Opacity" To="0" Duration="0"/>
</Storyboard>
</VisualState>
<VisualState x:Name="Disabled">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="RootGrid" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
<VisualStateGroup x:Name="FocusStates">
<VisualState x:Name="Focused">
<Storyboard>
<DoubleAnimation Storyboard.TargetName="FocusVisualWhite" Storyboard.TargetProperty="Opacity" To="1" Duration="0"/>
<DoubleAnimation Storyboard.TargetName="FocusVisualBlack" Storyboard.TargetProperty="Opacity" To="1" Duration="0"/>
</Storyboard>
</VisualState>
<VisualState x:Name="Unfocused" />
<VisualState x:Name="PointerFocused" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Page.Resources> <Grid Background="Transparent" Name="root">
<Border BorderBrush="Red" BorderThickness="1,0,0,0">
<Grid Background="White">
<Grid.RowDefinitions>
<RowDefinition Height="80"/>
<RowDefinition Height="*" />
</Grid.RowDefinitions> <Grid Background="#00b2f0" Grid.Row="0">
<StackPanel Orientation="Horizontal" Margin="40, 32, 17, 13">
<!--返回按钮-->
<Button Name="btnBack" Click="btnBack_Click_1" Margin="0,3,0,0" Style="{StaticResource SettingsBackButtonStyle}"/>
<!--详细设置页的标题-->
<TextBlock Margin="10,0,0,0" FontFamily="Segoe UI" FontWeight="SemiLight" FontSize="24.6667" Text="Defaults" Foreground="White"/>
</StackPanel>
</Grid> <ScrollViewer Grid.Row="1">
<!--详细设置页内的全部内容-->
<StackPanel>
<!--为详细设置页内的内容增加 EntranceThemeTransition 效果-->
<StackPanel.ChildrenTransitions>
<TransitionCollection>
<PaneThemeTransition Edge="Right" />
</TransitionCollection>
</StackPanel.ChildrenTransitions>
<TextBlock FontSize="56" Foreground="Black" LineHeight="100">
<Run>设置1</Run>
<LineBreak />
<Run>设置2</Run>
<LineBreak />
<Run>设置3</Run>
<LineBreak />
<Run>设置4</Run>
<LineBreak />
<Run>设置5</Run>
<LineBreak />
<Run>设置6</Run>
<LineBreak />
<Run>设置7</Run>
<LineBreak />
<Run>设置8</Run>
<LineBreak />
<Run>设置9</Run>
</TextBlock>
</StackPanel>
</ScrollViewer>
</Grid>
</Border>
</Grid>
</Page>

Contracts/SettingsContract/CustomSettingsPage.xaml.cs

/*
* 自定义的详细设置页
*/ using Windows.UI.ApplicationSettings;
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 CustomSettingsPage : Page
{
public CustomSettingsPage()
{
this.InitializeComponent();
} private void btnBack_Click_1(object sender, RoutedEventArgs e)
{
// 详细设置页的容器是 Popup,找到这个 Popup 并关闭它,从而关闭详细设置页
Popup parent = this.Parent as Popup;
if (parent != null)
{
parent.IsOpen = false;
} // 显示设置面板
if (Windows.UI.ViewManagement.ApplicationView.Value != Windows.UI.ViewManagement.ApplicationViewState.Snapped)
{
SettingsPane.Show();
}
}
}
}

OK
[源码下载]

重新想象 Windows 8 Store Apps (37) - 契约: Settings Contract的更多相关文章

  1. 重新想象 Windows 8 Store Apps &lpar;38&rpar; - 契约&colon; Search Contract

    [源码下载] 重新想象 Windows 8 Store Apps (38) - 契约: Search Contract 作者:webabcd 介绍重新想象 Windows 8 Store Apps 之 ...

  2. 重新想象 Windows 8 Store Apps &lpar;39&rpar; - 契约&colon; Share Contract

    [源码下载] 重新想象 Windows 8 Store Apps (39) - 契约: Share Contract 作者:webabcd 介绍重新想象 Windows 8 Store Apps 之  ...

  3. 重新想象 Windows 8 Store Apps 系列文章索引

    [源码下载][重新想象 Windows 8.1 Store Apps 系列文章] 重新想象 Windows 8 Store Apps 系列文章索引 作者:webabcd 1.重新想象 Windows ...

  4. 重新想象 Windows 8 Store Apps &lpar;34&rpar; - 通知&colon; Toast Demo&comma; Tile Demo&comma; Badge Demo

    [源码下载] 重新想象 Windows 8 Store Apps (34) - 通知: Toast Demo, Tile Demo, Badge Demo 作者:webabcd 介绍重新想象 Wind ...

  5. 重新想象 Windows 8 Store Apps &lpar;35&rpar; - 通知&colon; Toast 详解

    [源码下载] 重新想象 Windows 8 Store Apps (35) - 通知: Toast 详解 作者:webabcd 介绍重新想象 Windows 8 Store Apps 之 通知 Toa ...

  6. 重新想象 Windows 8 Store Apps &lpar;36&rpar; - 通知&colon; Tile 详解

    [源码下载] 重新想象 Windows 8 Store Apps (36) - 通知: Tile 详解 作者:webabcd 介绍重新想象 Windows 8 Store Apps 之 通知 Tile ...

  7. 重新想象 Windows 8 Store Apps &lpar;40&rpar; - 剪切板&colon; 复制&sol;粘贴文本&comma; html&comma; 图片&comma; 文件

    [源码下载] 重新想象 Windows 8 Store Apps (40) - 剪切板: 复制/粘贴文本, html, 图片, 文件 作者:webabcd 介绍重新想象 Windows 8 Store ...

  8. 重新想象 Windows 8 Store Apps &lpar;41&rpar; - 打印

    [源码下载] 重新想象 Windows 8 Store Apps (41) - 打印 作者:webabcd 介绍重新想象 Windows 8 Store Apps 之 打印 示例1.需要打印的文档Pr ...

  9. 重新想象 Windows 8 Store Apps &lpar;42&rpar; - 多线程之线程池&colon; 延迟执行&comma; 周期执行&comma; 在线程池中找一个线程去执行指定的方法

    [源码下载] 重新想象 Windows 8 Store Apps (42) - 多线程之线程池: 延迟执行, 周期执行, 在线程池中找一个线程去执行指定的方法 作者:webabcd 介绍重新想象 Wi ...

随机推荐

  1. 获取URL最后一个 &OpenCurlyQuote;&sol;’ 之后的字符

    在开发项目的过程中,经常遇到需要解析论坛,博客等的URL的问题,比如:'abc/def/jkl' 或 'abc/def/jkl/',获取最后一个‘/’之后的所有字符‘jkl’,由于特殊字符'/'的个数 ...

  2. 【转载】Ansys中的阻尼

    原文地址:http://www.cnblogs.com/ylhome/archive/2009/08/26/1554195.html ANSYS动力学分析中提供了各种的阻尼形式,这些阻尼在分析中是如何 ...

  3. C语言 数组做函数参数不传数组个数的遍历方法

    //数组做函数参数不传数组个数的遍历方法 #include<stdio.h> #include<stdlib.h> #include<string.h> void ...

  4. SQL Server-删除表中重复的记录!

    比如现在有一人员表  (表名:peosons)若想将姓名.身份证号.住址这三个字段完全相同的记录查询出来 select   p1.*   from   persons   p1,persons   p ...

  5. linux yum install resource - epel

    首先现在如下rpm包,然后安装对应的rpm包centos5 32位epel源下载地址: www.lishiming.net/data/attachment/forum/epel-release-5-4 ...

  6. oracle全文检索笔记

    1.删除词法解析器 exec ctx_ddl.drop_preference('my_lexer'); 2.创建中文词法解析器 exec ctx_ddl.create_preference ('my_ ...

  7. &period;Net中的AOP系列之《AOP实现类型》

    返回<.Net中的AOP>系列学习总目录 本篇目录 AOP是如何跑起来的 运行时编织 复习代理模式 动态代理 编译时编织 后期编译(PostCompiling) 来龙去脉 运行时编织 VS ...

  8. 从零部署Spring boot项目到云服务器(正式部署)

    上一篇文章总结了在Linux云服务器上部署Spring Boot项目的准备过程,包括环境的安装配置,项目的打包上传等. 链接在这里:http://www.cnblogs.com/Lovebugs/p/ ...

  9. wireshark使用方法

    抓取报文: 下载和安装好Wireshark之后,启动Wireshark并且在接口列表中选择接口名,然后开始在此接口上抓包.例如,如果想要在无线网络上抓取流量,点击无线接口.点击Capture Opti ...

  10. OpenGL&period;Qt532&period;cube

    1.官方的例子(安装好代源码的Qt532就有该例子) E:\Project_Qt532\Official_Examples\opengl\cube E:\Project_Qt532\Official_ ...