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>

<Stylex:Key="t1" TargetType="TextBlock">

<SetterProperty="FontSize"Value="20"/>

<SetterProperty="FontWeight"Value="Bold"/>

<SetterProperty="VerticalAlignment"Value="Top"/>

<SetterProperty="Margin"Value="3,2,6,2"/>

</Style>

<Stylex:Key="t2" TargetType="TextBlock">

<SetterProperty="FontSize"Value="19"/>

<SetterProperty="Margin"Value="3.2,2,3,2"/>

<SetterProperty="TextWrapping"Value="Wrap"/>

</Style>

<Stylex:Key="jlipviewItemStyle"TargetType="FlipViewItem">

<SetterProperty="HorizontalContentAlignment"Value="Center"/>

<SetterProperty="VerticalContentAlignment"Value="Center"/>

</Style>

</Page.Resources>

<GridBackground="{StaticResource ApplicationPageBackgroundThemeBrush}">

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

<FlipView.ItemTemplate>

<DataTemplate>

<Grid>

<Grid.ColumnDefinitions>

<ColumnDefinitionWidth="auto"/>

<ColumnDefinitionWidth="*"/>

</Grid.ColumnDefinitions>

<Grid.RowDefinitions>

<RowDefinitionHeight="auto"/>

<RowDefinitionHeight="auto"/>

<RowDefinitionHeight="auto"/>

<RowDefinitionHeight="auto"/>

<RowDefinitionHeight="auto"/>

</Grid.RowDefinitions>

<TextBlockStyle="{StaticResource t1}"Grid.Column="0"Grid.Row="0" Text="姓名:"/>

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

<TextBlockStyle="{StaticResource t1}"Grid.Column="0"Grid.Row="1" Text="年龄:"/>

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

<TextBlockStyle="{StaticResource t1}"Grid.Column="0"Grid.Row="2" Text="性别:"/>

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

<TextBlockStyle="{StaticResource t1}"Grid.Column="0"Grid.Row="3" Text="电邮:"/>

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

<TextBlockStyle="{StaticResource t1}"Grid.Column="0"Grid.Row="4" Text="备注:"/>

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

</Grid>

</DataTemplate>

</FlipView.ItemTemplate>

</FlipView>

</Grid>

</Page>

posted @ 2012-12-20 19:43  刘祎  阅读(122)  评论(0编辑  收藏  举报