Windows8:FlipView

FlipView数据绑定

public class Student

{

public string Name {get; set; }

public int Age { get; set; }

public string Sex { get; set; }

public string Email {get; set; }

public string Remark {get; set; }

}

public class TestDataSource : System.Collections.ObjectModel.ObservableCollection<Student>

{

public TestDataSource()

{

this.Add(new Student

{

Name = "小李",

Age = 20,

Sex = "男",

Email = "rubbish@163.com",

Remark = "活泼。"

});

this.Add(new Studen

{

Name = "小赵",

Age = 18,

Email = "kaozhu@163.com",

Sex = "女",

Remark = "阳光。"

});

this.Add(new Student

{

Name = "小刘",

Age = 22,

Email = "ak800@foxmail.com",

Sex = "女",

Remark = "上进。"

});

}

}  

MainPage类的构造函数中加入以下代码，设置FlipView的数据源:

public MainPage()

{

this.InitializeComponent();

TestDataSource source = new TestDataSource();

this.fv.ItemsSource = source;

}  

在XAML中进行绑定:

<Page

x:Class="FlipViewExample2.MainPage"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:local="using:FlipViewExample2"

xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

mc:Ignorable="d">

<Page.Resources>

<Style x:Key="t1" TargetType="TextBlock">

<Setter Property="FontSize" Value="20"/>

<Setter Property="FontWeight" Value="Bold"/>

<Setter Property="VerticalAlignment" Value="Top"/>

<Setter Property="Margin" Value="3,2,6,2"/>

</Style>

<Style x:Key="t2" TargetType="TextBlock">

<Setter Property="FontSize" Value="19"/>

<Setter Property="Margin" Value="3.2,2,3,2"/>

<Setter Property="TextWrapping" Value="Wrap"/>

</Style>

<Style x:Key="jlipviewItemStyle" TargetType="FlipViewItem">

<Setter Property="HorizontalContentAlignment"Value="Center"/>

<Setter Property="VerticalContentAlignment" Value="Center"/>

</Style>

</Page.Resources>

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">

<FlipView x:Name="fv" Width="500"Height="150" VerticalAlignment="Center" HorizontalAlignment="Center" ItemContainerStyle="{StaticResource jlipviewItemStyle}">

<FlipView.ItemTemplate>

<DataTemplate>

<Grid>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="auto"/>

<ColumnDefinition Width="*"/>

</Grid.ColumnDefinitions>

<Grid.RowDefinitions>

<RowDefinition Height="auto"/>

<RowDefinition Height="auto"/>

<RowDefinition Height="auto"/>

<RowDefinition Height="auto"/>

<RowDefinition Height="auto"/>

</Grid.RowDefinitions>

<TextBlock Style="{StaticResource t1}" Grid.Column="0" Grid.Row="0" Text="姓名："/>

<TextBlock Style="{StaticResource t2}" Grid.Column="1" Grid.Row="0" Text="{Binding Name}"/>

<TextBlock Style="{StaticResource t1}" Grid.Column="0" Grid.Row="1" Text="年龄："/>

<TextBlock Style="{StaticResource t2}" Grid.Column="1" Grid.Row="1" Text="{Binding Age}"/>

<TextBlock Style="{StaticResource t1}" Grid.Column="0" Grid.Row="2" Text="性别："/>

<TextBlock Style="{StaticResource t2}" Grid.Column="1" Grid.Row="2" Text="{Binding Sex}"/>

<TextBlock Style="{StaticResource t1}" Grid.Column="0" Grid.Row="3" Text="电邮："/>

<TextBlock Style="{StaticResource t2}" Grid.Column="1" Grid.Row="3" Text="{Binding Email}"/>

<TextBlock Style="{StaticResource t1}" Grid.Column="0" Grid.Row="4" Text="备注："/>

<TextBlock Style="{StaticResource t2}" Grid.Column="1" Grid.Row="4" Text="{Binding Remark}"/>

</Grid>

</DataTemplate>

</FlipView.ItemTemplate>

</FlipView>

</Grid>

</Page>