Question

我在将我的语义缩放绑定正确地绑定到我的CollectionViewSource时遇到了一些麻烦。我对MVVM很新，所以我不确定我的设置是否正确。

查看模型

    private async void GetData()
    {
        // Simulate pulling data from api
        string response;
        StorageFile file = await StorageFile.GetFileFromApplicationUriAsync(new Uri(@"ms-appx:///DesignData/GetLive.json"));
        using (StreamReader sRead = new StreamReader(await file.OpenStreamForReadAsync()))
            response = await sRead.ReadToEndAsync();

        // Deserialize data to class
        LiveStreamModel liveGames = JsonConvert.DeserializeObject<LiveStreamModel>(response);
        Schedules = liveGames.schedule;

        // Group data by event
        var groupData = liveGames.schedule.GroupBy(a => a.@event);

        // Set cvs source to grouped data
        ScheduleSource = new CollectionViewSource() { IsSourceGrouped = true, Source = groupData };
    }

    private CollectionViewSource scheduleSource;
    public CollectionViewSource ScheduleSource
    {
        get
        {
            return scheduleSource;
        }
        set
        {
            scheduleSource = value;
            RaisePropertyChanged("ScheduleSource");
        }
    }

查看

Page.Resources>
    <DataTemplate x:Key="ZoomedInTemplate">
        <StackPanel Orientation="Horizontal" MinWidth="200" Margin="12,6,0,6">
            <!--<Image Source="{Binding ImagePath}" Height="80" Width="80"/>-->
            <StackPanel Margin="20,0,0,0">
                <TextBlock Text="{Binding homeTeam}" Style="{StaticResource BaseTextBlockStyle}"/>
                <TextBlock Text="{Binding awayTeam}" TextWrapping="Wrap" HorizontalAlignment="Left" Width="300" 
                           Style="{StaticResource BodyTextBlockStyle}"/>
            </StackPanel>
        </StackPanel>
    </DataTemplate>

    <DataTemplate x:Key="ZoomedInGroupHeaderTemplate">
        <TextBlock Text="{Binding event}" Foreground="{ThemeResource ApplicationForegroundThemeBrush}" 
                   Style="{StaticResource SubtitleTextBlockStyle}"/>
    </DataTemplate>

    <DataTemplate x:Key="ZoomedOutTemplate">
        <TextBlock Text="{Binding event}" Style="{StaticResource SubtitleTextBlockStyle}"/>
    </DataTemplate>
</Page.Resources>

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <SemanticZoom x:Name="GetLiveZoom"  >
        <SemanticZoom.ZoomedInView>
            <GridView x:Name="GetLiveGrid" ItemsSource="{Binding ScheduleSource.View}" ItemTemplate="{StaticResource ZoomedInTemplate}" SelectionMode="Single"
                    ScrollViewer.IsHorizontalScrollChainingEnabled="False">
                <GridView.GroupStyle>
                    <GroupStyle HeaderTemplate="{StaticResource ZoomedInGroupHeaderTemplate}" />
                </GridView.GroupStyle>
            </GridView> 
        </SemanticZoom.ZoomedInView>
        <SemanticZoom.ZoomedOutView>
            <GridView x:Name="GetLiveList" ItemsSource="{Binding ScheduleSource.View.CollectionGroups}" ItemTemplate="{StaticResource ZoomedOutTemplate}" SelectionMode="None"
                    ScrollViewer.IsVerticalScrollChainingEnabled="False"/>
        </SemanticZoom.ZoomedOutView>
    </SemanticZoom>
</Grid>

调试时，我的数据被@event正确分组，但是将cvs的来源设置为分组数据并将其绑定到语义缩放控件会导致无法显示任何内容。

Answer 1

您需要修复以下数据绑定：

1）对于 ZoomedInGroupHeaderTemplate ，因为Source是分组数据，所以如果要在ZoomedInView中显示组名，请为键属性设置数据绑定：

<DataTemplate x:Key="ZoomedInGroupHeaderTemplate"> <TextBlock Text="{Binding Key}" Foreground="{ThemeResource ApplicationForegroundThemeBrush}" Style="{StaticResource SubtitleTextBlockStyle}"/> </DataTemplate>

2）对于 ZoomedOutTemplate ，来源是ICollectionView.CollectionGroups，ref MSDN - ＆gt; ICollectionViewGroup interface

我们需要使用ICollectionViewGroup.Group属性来获取ZoomedOutView中的组名：

<DataTemplate x:Key="ZoomedOutTemplate"> <TextBlock Text="{Binding Group.Key}" Style="{StaticResource SubtitleTextBlockStyle}"/> </DataTemplate>

在Github
中查看我已完成的示例
ZoomedInView的屏幕截图：

ZoomedOutView的屏幕截图：

将分组数据绑定到cvs以进行语义缩放

1 个答案: