Silverlight for Windows Phone Toolkit中的ExpanderView控件
文章信息
Contents |
说明
ExpanderView 来自于Silverlight for Windows Phone Toolkit. 它有一个头部，用户可以切换以展开/折叠额外内容（这种类型的控件有时被作为可折叠面板，或者作为一个可折叠面板控件）。 它有一个用户可以进行切换以展开/折叠额外内容的头（这种类型的控件有时指可折叠面板，或者作为一个可折叠面板控件）。 这篇文章简要概述了如何包括并在您的项目中使用该控件。该示例使用两个ExpanderView： 第一次显示的小组参与一个游戏，而第二个允许您从列表中选择一个特定的游戏列表。
带有“关闭”扩展器的示例应用程序
"组" 头部展开: 在板球组中查看组列表
"选择比赛" 展开: 查看比赛列表(可选的)
带有已选定比赛的示例应用程序
添加控件到你的项目
首先创建一个Windows Phone应用程序:
- 打开 Visual Studio 并在已经安装的模板中选择Windows Phone Application。
- 选择Windows Phone 7.1 作为目标版本.
- 在项目中右键单击 “参考” ，然后单击“添加参考”。浏览“Microsoft.Phone.Controls.Toolkit.dll” 然后添加到项目.* 在* MainPage.xaml中添加命名空间Microsoft.Phone.Controls.Toolkit.
xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
通过XAML定义ExpanderView控件
下面的XAML 展示如何创建一个名为"Header 1"的ExpanderView ，它由8个TextBlock 项目组成。
<toolkit:ExpanderView x:Name="Header1" Header="Teams " FontSize="40" Expanded="Header1_Expanded"/>
<toolkit:ExpanderView.Items>
<TextBlock FontSize="20" Text="Afganistan"/>
<TextBlock FontSize="20" Text="Australia"/>
<TextBlock FontSize="20" Text="Bangladesh"/>
<TextBlock FontSize="20" Text="Ireland"/>
<TextBlock FontSize="20" Text="New Zealand"/>
<TextBlock FontSize="20" Text="South Africa"/>
<TextBlock FontSize="20" Text="Sri Lanka"/>
<TextBlock FontSize="20" Text="Zimbabwe"/>
</toolkit:ExpanderView.Items>
</toolkit:ExpanderView>
使用CSharp 定义ExpanderView控件
同样的控件可以像如下代码那样用C#创建: 首先我们创建实例 ExpanderView (在Header1中):
ExpanderView Header1 = new ExpanderView();
然后我们设置头部文本, 添加扩展器到 stackpanel, 然后设置扩展器的内容作为一个列表。
public MainPage()
{
InitializeComponent();
Header1.Header = "Expander Header";
stackpanel.Children.Add(Header1);
this.Header1.ItemsSource = new List<string>() { "Afganistan", "Australia", "Bangladesh",
"Ireland", "New Zealand", "South Africa", "Sri Lanka", "Zimbabwe" };
}
展开和折叠状态的事件
ExpanderView 有两个的关键事件Expanded 和 Collapsed， ExpanderView 的状态更改时被触发。 当头部的ExpanderView 被展开，它展开的handler 被调用:
private void Header1_Expanded(object sender, RoutedEventArgs e)
{
// can define any specific action we want to take when the ExpanderView expands
}
同样，当它处于折叠状态，折叠处理程序被调用:
private void Header1_Collapsed(object sender, RoutedEventArgs e)
{
// can define any specific action we want to take when the ExpanderView collapses
}
ExpanderView 有 IsNonExpandable 属性， 它是ExpanderView， 不可扩展. 这很有用，如果展开器只可在某些情况下使用-也许在内容被完全填充以后。
下载
你可以从这个文件下载样本项目代码 File:ExpanderControl.zip.
(no comments yet)