×
Namespaces

Variants
Actions

Silverlight for Windows Phone Toolkit中的ExpanderView控件

From Nokia Developer Wiki
Jump to: navigation, search
WP Metro Icon UI.png
WP Metro Icon Tools.png
SignpostIcon XAML 40.png
SignpostIcon WP7 70px.png
Article Metadata

兼容于
文章
翻译:
WS - OtomiiLu
最后由 hamishwillee 在 02 Jul 2013 编辑

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.

This page was last modified on 2 July 2013, at 13:22.
121 page views in the last 30 days.
×