在FlipView DataContext WPF中绑定不同的ItemSource

时间:2015-10-28 06:58:05

标签: c# wpf xaml windows-10-mobile flipview

我目前正在使用Windows 10移动应用。我有一个简单的DateTime列表,如下所示:

public DateTime NextDate { get; set;}
public DateTime PrevDate { get; set;}
// list of date
public List<DateTime> DateList { get; set; }

protected override void OnNavigatedTo(NavigationEventArgs e)
{
    base.OnNavigatedTo(e);
    DateTime beginDate = new DateTime(2015, 9, 22);
    DateTime endDate = DateTime.Today;
    DateList = new List<DateTime>();
    for (DateTime date = beginDate; date < endDate; date = date.AddDays(1))
    {
        DateList.Add(date);
    }
}

现在我想把它显示为翻转视图,不仅是一天而且是3天:当天,上一天和第二天。

这是我的XAML代码:

<FlipView x:Name="dateFlipView" BorderBrush="Azure" Height="100"
            ItemsSource="{Binding DateList}" SelectionChanged="dateFlipView_SelectionChanged">
    <FlipView.ItemTemplate>
        <DataTemplate>
            <!-- show previous date -->
            <Canvas Height="100" Width="100" Background="#FF7683FF">
                <StackPanel Width="100" HorizontalAlignment="Left">
                    <TextBlock Text="{Binding Day}" Style="{StaticResource HeaderTextBlockStyle}" HorizontalAlignment="Center"/>
                    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
                        <TextBlock Text="{Binding Month}" Margin="0,0,8,0" Style="{StaticResource CaptionTextBlockStyle}"/>
                        <TextBlock Text="{Binding Year}" HorizontalAlignment="Right" Style="{StaticResource CaptionTextBlockStyle}"/>
                    </StackPanel>
                    <StackPanel>
                        <TextBlock Text="{Binding Day}"/>
                    </StackPanel>
                </StackPanel>
            </Canvas>
            <!-- show next date -->
        </DataTemplate>
    </FlipView.ItemTemplate>
</FlipView>

上面的代码只显示了一个日期。

我找到了一个解决方案,我可以添加2个DateTime属性,NextDatePrevDate,并且在FlipView中,可以使用绑定RelativeSource={RelativeSource AncestorType={x:Type Window}}, Path=ColumnHeadInfo}。但我还不知道自己应该做些什么。

1 个答案:

答案 0 :(得分:0)

您可以通过自定义类型列表来实现此目的,该列表将保存您的数据,如下所示。

success: function (data) {
    $(".formDiv").append("Your input: " + data);
}

此处列表人口:

public class DateTimeModel
{
    public DateTime PreviousDate { get; set; }

    public DateTime NextDate { get; set; }

    public DateTime CurrentDate { get; set; }
}

您可以获取每个模型对象,在列表中添加到ItemTemplate上下文中。从DataContext,您可以访问这些属性,如下所示。

        DateTime beginDate = new DateTime(2015, 9, 22);
        DateTime endDate = DateTime.Today;
        DateList = new List<DateTimeModel>();
        DateTimeModel model; 

        for (DateTime date = beginDate; date < endDate; date =     date.AddDays(1))
        {
            model = new DateTimeModel();
            model.PreviousDate = date.AddDays(-1);
            model.CurrentDate = date;
            model.NextDate = date.AddDays(1);
            DateList.Add(model);
        }