枢轴控件Pivot

28-UWP开发-枢轴控件Pivot

枢轴控件 Pivot 提供一种快捷的方式来管理应用中的视图和页面，通过一种类似页签的方式来将视图分类，这样就可以在一个页面上通过切换页签来浏览多个数据集。

语法

<Pivot>
    <PivotItem>
    </PivotItem>
    <PivotItem>
    </PivotItem>
</Pivot>Code language: HTML, XML (xml)

Pivot 控件分为两部分，分别是标题部分和内容部分：

1. 标题部分：主要包含 Pivot 的标题，通过 Pivot 标签的 Title 属性设置；还有 PivotItem 的标题，通过 PivotItem 的 Header 属性设置。标题支持文本还支持带图标的富文本，它们支持 Object 类型，支持 UI 元素。
2. 内容部分：显示在枢轴视图页面的控件都需要放在 PivotItem 中，你可以把 PivotItem 当做一个容器控件，将要显示的控件都放置其中。

页签发生了切换则会触发 SelectionChanged 事件，通过 SelectedIndex 和 SelectedItem 可以获取当前选中的页签的索引和对象。

练一练

添加带三个页签的枢轴控件：

<Pivot Title="课程详情">
    <PivotItem Header="课时">
        <Rectangle Width="300" Height="200" Fill="Red"/>
    </PivotItem>
    <PivotItem Header="资料">
        <Rectangle Width="300" Height="200" Fill="Green"/>
    </PivotItem>
    <PivotItem Header="评论">
        <Rectangle Width="300" Height="200" Fill="Blue"/>
    </PivotItem>
</Pivot>Code language: HTML, XML (xml)

private void Pivot_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    int index = this.pivot.SelectedIndex;
    object o = this.pivot.SelectedItem;
}Code language: JavaScript (javascript)