一般我们在开发Winodws Phone APP 的时候往往需要使用照片浏览的功能,但是在Windows Phone 8 SDK 中的控制向并没有提供类似Gallery的元件(好比 Android 的 ViewPager),这对开发者来说是非常不方便的,因为如果要自己制作一个控制项是非常的颢时间,而且说不定还有修不完的Bug,所以我们可以透过修改WP8 SDK 的Pivot范本修改来达到类似的效果唷!
?
本文将引导您制作不循环 Pivot ,图片(Gallery)导览不求人!!
?
原理:
在头尾新增一个空白的页面,当一致空白页面时,将Pivot转跳至前一个。
?
?
步骤一:
开启Pivot的新专案
?
步骤二:
修改MainPage.xaml
1.将phone:Pivot的Title 删除
2.将phone:PivotItem的Header删除
?
步骤二:
将phone:PivotItem底下的phone:LongListSelector也都删除
并补上自订的内容,这边以图片为例,弄起来会像下面这样:
?
<phone:Pivot > <!--内容1--> <phone:PivotItem Margin="0" > <Grid> <Image Source="/Assets/1.jpg" /> </Grid> </phone:PivotItem> <!--内容2--> <phone:PivotItem Margin="0" > <Grid> <Image Source="/Assets/2.jpg" /> </Grid> </phone:PivotItem> <!--内容3--> <phone:PivotItem Margin="0" > <Grid> <Image Source="/Assets/3.jpg" /> </Grid> </phone:PivotItem> </phone:Pivot>
?
步骤三:
在头跟尾在各插入一个空白的PivotItem
结果就会像这样子:
?
步骤四:
我们需要帮Pivot命名,并且设定SelectionChanged的事件。
命名成MyPivot
?
<phone:Pivot x:Name="MyPivot" SelectionChanged="Pivot_SelectionChanged" >
?
步骤五:
打开MainPage.xaml.cs的Pivot_SelectionChanged方法底下键入以下程式码。
1: private void Pivot_SelectionChanged(object sender, SelectionChangedEventArgs e)
2: {
3: if (MyPivot.SelectedIndex == 0)
4: //如果目前页数为0,则跳到第一页
5: {
6: Dispatcher.BeginInvoke(() =>
7: {
8: MyPivot.SelectedIndex = 1;
9: });
10: }
11: if (MyPivot.SelectedIndex == (MyPivot.Items.Count - 1))
12: //如果目前页数=最後一页 则跳到倒数第二页
13: {
14: Dispatcher.BeginInvoke(() =>
15: {
16: MyPivot.SelectedIndex = (MyPivot.Items.Count - 2);
17: });
18: ?
19: }
20: ?
21: }
?
步骤六:
执行! 恩...完美运行!!? 突然觉得世界很美好
?
如此一来便可以制作不循环的Pivot罗!
?
文章中的叙述如有观念不正确错误的部分,欢迎告知指正 谢谢
转载请注明出处,并且附上本篇文章网址 !? 感谢。‘
HOLIESTAR
DotBlogs Tags: C#GalleryPivotVisual StudioWindows Phone 8Xaml
关连文章
Visual Studio 双栏查看程式码 快速掌握架构,加速开发必看 ! ! (内附影片教学)
Visual Studio 2013 新功能,程式码再长也不会迷路,全新卷轴地图模式 ! 加速开发必看 !! (内附影片展示)
C# Windows Phone 8 WP8 , 文字超连结到网页 免打程式码,Xaml就搞定 ! !
C# Windows Form 解决 Icon在开始工具列模糊的问题,字体大小150% 高解析度完美运行。
C# Windows Phone 8 WP8 高级开发,制作不循环 Pivot ,图片(Gallery)导览不求人! 内附图文教学!!,布布扣,bubuko.com
C# Windows Phone 8 WP8 高级开发,制作不循环 Pivot ,图片(Gallery)导览不求人! 内附图文教学!!