日期:2014-05-16 浏览次数:21036 次
新建一个项目叫做TestFlip,拖动一个FlipView到MainPage.xaml上面。
和前面说到的控件ListView一样,我们可以在代码中设置FlipView控件的元素格式和内容。
完整的xaml代码如下:
<Page x:Class="TestFlip.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:TestFlip" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> <FlipView x:Name="myFlip" HorizontalAlignment="Center" VerticalAlignment="Center" Width="600" Height="400"> <FlipView.ItemTemplate> <DataTemplate> <TextBlock Text="{Binding}"/> </DataTemplate> </FlipView.ItemTemplate> </FlipView> </Grid> </Page>
接下来跳转到后台的代码处进行设置。
先将几张图片添加到项目中。新建一个文件夹:Images,然后将图片添加进去。
然后在后台代码里添加字符串数组用来存储这些图片的路径。
using System; using System.Collections.Generic; using System.IO; using System.Linq; using Windows.Foundation; using Windows.Foundation.Collections; using Windows.UI.Xaml; using Windows.UI.Xaml.Controls; using Windows.UI.Xaml.Controls.Primitives; using Windows.UI.Xaml.Data; using Windows.UI.Xaml.Input; using Windows.UI.Xaml.Media; using Windows.UI.Xaml.Navigation; // “空白页”项模板在 http://go.microsoft.com/fwlink/?LinkId=234238 上有介绍 namespace TestFlip { /// <summary> /// 可用于自身或导航至 Frame 内部的空白页。 /// </summary> public sealed partial class MainPage : Page { public MainPage() { this.InitializeComponent(); } /// <summary> /// 在此页将要在 Frame 中显示时进行调用。 /// </summary> /// <param name="e">描述如何访问此页的事件数据。Parameter /// 属性通常用于配置页。</param> protected override void OnNavigatedTo(NavigationEventArgs e) { if (e.NavigationMode == NavigationMode.New) { string[] myString = new string[] { "ms-appx:///Images/1.jpg", "ms-appx:///Images/2.jpg", "ms-appx:///Images/3.jpg", "ms-appx:///Images/4.jpg", "ms-appx:///Images/5.jpg", "ms-appx:///Images/6.jpg", }; myFlip.ItemsSource = myString; } } } }
这样可以看到在FlipView中会显示相应的路径,并且有按钮可以切换。
接下来我们要把这些图片在FlipView中显示出来。
新建一个类叫做Person.cs文件用来存储人物姓名和图片路径:
using System; using System.Collections.Generic; using System.ComponentModel; using System.Linq; using System.Text; using System.Threading.Tasks;