本文简单介绍Pivot(枢轴视图)控件,通过本文的介绍可以对Pivot的使用和效果有个初步的认识。
概述
枢轴(Pivot)控件提供了一种快捷的方式来管理应用中的视图或页面。枢轴视图可以用来过滤数据,将视图分类。枢轴视图控件水平放置独立的视图,同时处理左侧和右侧的导航,可以通过划动或者平移手势来切换枢轴控件中的视图。Pivot默认就支持了手势,不需要我们做任何工作。
它的外观如下图所示:
该图展示了一个有三个页面的枢轴视图,可以通过划动和平移手势切换页面,向左划动,就由当前页面(例如Item1)切换到下一个页面(Item2),如果切换到最后一个页面,同样操作会回到第一个页面,也就是说,枢轴视图的页面是循环的。另外也可以点击Item的标题来切换,在Item1中,点击其后面并列的灰色的item2或item3(它只显示了一部分),就可以切换到相应页面。
页面结构
上图红色区域就是Pivot Control。
Pivot分为两个部分:
上图黄色区域是Pivot的Header部分和绿色区域是PivotItem的Content部分。
Header:主要包含Pivot的Title,在图中为“PIVOT APPLICATION”,还有PivotItem的Header,在图中为“item1、item2和item3”。
可以设置Pivot的Title属性,改变文字;可以编辑TitleTemplate,来改变Title的样式,比如在Title加个小图标等等,但是建议不要改变它的高度,我会在之后的文章中来详细说明。
PivotItem的Header属性与Pivot的Title属性类似,可以设置它改变文字,但PivotItem没有提供Header的模板属性,因此目前不能改变它的外观。Header属性的文字不要设置太长,否则会导致其它PivotItem的Header无法显示出来。
PivotItem:显示在枢轴视图页面的控件都放到PivotItem中,可以把PivotItem当作一个容器控件,将要展示的控件都放置在其中。
Pivot的重要属性和事件
属性:
SelectedIndex:获取或设置当前选择的PivotItem的索引。
SelectedItem:获取或设置当前选择的PivotItem的对象。
Title:获取或设置Pivot的标题。
TitleTemplate:获取或设置Pivot标题的模板,通过设置它可以改变Pivot标题的外观。
事件:利用好这些事件被触发的时机,可以有效的实现数据的动态加载。
LoadedPivotItem:该事件在加载完成后被触发。
LoadingPivotItem:该事件在加载PivotItem时被触发,可以用来动态加载数据。
SelectionChanged:选择的PivotItem改变时该事件被触发。
UnloadedPivotItem:该事件在卸载PivotItem完成时被触发。
UnloadingPivotItem:该事件在卸载PivotItem开始时被触发。
使用建议
从性能方面考虑,尽量少用Pivot,使Pivot的PivotItem尽可能的少。
为了提高Pivot的启动速度,可以延迟加载一些数据。在初始化时只加载必要的数据,切换到相应的PivotItem时,再动态加载需要的数据。
确保Pivot只是用来显示同类的页面或数据,而不是因为喜欢它的展示效果就将很多不相关的数据和页面放到一个Pivot当中。
空的PivotItem一定要删除。
千万不要用Pivot来展示业务流程,就是说Pivot中的页面必须为并列关系,不能为相互依赖的关系。
在PivotItem中,不要使用具有水平Pan和Flick的手势的控件(例如水平的ScrollViewer或ListBox),因为这类控件会拦截手势的消息,阻碍Pivot页面的切换。
PivotItem中的控件宽度,不要超过一个屏幕,超出部分将无法显示。(注意:Panorama可不是这样)
可以编程实现切换到哪个PivotItem,设置Pivot的SelectedIndex和SelectedItem属性就可以。