×
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 10:22.
118 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.

 

Thank you!

We appreciate your feedback.

×