locked
Binding design time data collections in Blend 2013 for Windows Store App RRS feed

  • Question

  • I'll try and provide as much information here as possible but let me prefix it by saying I'm not confident of my knowledge of regular data sources never mind design time data in Blend. My runtime works fine and displays grouped items in the grid view. When viewing in Blend I get nothing and I would like to display some sample data that does the same as the runtime. Is it possible to achieve this? Also if I've gone wrong and over complicated the runtime data sources please feel free to suggest changes.

    <common:LayoutAwarePage
    x:Name="pageRoot"
    x:Class="ScoreAlerts.ItemsPage"
    DataContext="{Binding DefaultViewModel, RelativeSource={RelativeSource Self}}"
    ...snip...>
    <CollectionViewSource x:Name="itemsViewSource" IsSourceGrouped="true" Source="{Binding Items}"/>


     <GridView
                x:Name="itemGridView"
                AutomationProperties.AutomationId="ItemsGridView"
                AutomationProperties.Name="Items"
                TabIndex="1"
                Grid.RowSpan="2"
                Padding="116,136,116,46"
                SelectionMode="None"
                IsSwipeEnabled="false"
                IsItemClickEnabled="True"
                ItemClick="ItemView_ItemClick" FontFamily="Global User Interface" FontWeight="Light" Margin="0,0,10,0">
                <GridView.Resources>
                <!-- Grid-appropriate 250 pixel square item template as seen in the GroupedItemsPage and ItemsPage -->
                    <DataTemplate x:Key="GridItem">
                        <Grid HorizontalAlignment="Left" Width="250" Height="250">
                            <Border Background="{x:Null}">
                                <Image Source="{Binding Image}" Stretch="UniformToFill" AutomationProperties.Name="{Binding Title}"/>
                            </Border>
                            <StackPanel VerticalAlignment="Bottom" Background="{StaticResource ListViewItemOverlayBackgroundThemeBrush}">
                                <TextBlock Text="{Binding Title}" Foreground="{StaticResource ListViewItemOverlayForegroundThemeBrush}" Style="{StaticResource TitleTextStyle}" Height="60" Margin="15,0,15,0"/>
                                <!-- <TextBlock Text="{Binding Subtitle}" Foreground="{StaticResource ListViewItemOverlaySecondaryForegroundThemeBrush}" Style="{StaticResource CaptionTextStyle}" TextWrapping="NoWrap" Margin="15,0,15,10"/> -->
                            </StackPanel>
                        </Grid>
                    </DataTemplate>
                </GridView.Resources>
                <GridView.ItemsSource>
                    <Binding Source="{StaticResource itemsViewSource}"/>
                </GridView.ItemsSource>
    
    
                <!-- Item Template -->
                <GridView.ItemTemplate>
                    <StaticResource ResourceKey="GridItem"/>
                </GridView.ItemTemplate>
    
                <!-- Item Panel Template -->
                <GridView.ItemsPanel>
                    <ItemsPanelTemplate>
                        <WrapGrid MaximumRowsOrColumns="4"
                            HorizontalAlignment="Left"
                            VerticalAlignment="Center" />
                    </ItemsPanelTemplate>
                </GridView.ItemsPanel>
    
                <GridView.GroupStyle>
                    <GroupStyle>
                        <GroupStyle.HeaderTemplate>
                            <DataTemplate>
                                <Grid Margin="0">
                                    <TextBlock Text="{Binding Key}"
                                        Style="{StaticResource PageSubheaderTextStyle}"
                                        Margin="8 4 0 10" />
                                </Grid>
                            </DataTemplate>
                        </GroupStyle.HeaderTemplate>
                        <GroupStyle.Panel>
                            <ItemsPanelTemplate>
                                <VariableSizedWrapGrid Orientation="Vertical" Margin="0 0 40 0"/>
                            </ItemsPanelTemplate>
                        </GroupStyle.Panel>
                    </GroupStyle>
                </GridView.GroupStyle>
    
            </GridView>
    In the code I have this
    this.DefaultViewModel["Items"] = ScoreDataSource.GetGroups("AllGroups")

    And my ScoreDataSource has the following

    public sealed class ScoreDataSource
    {
        public static ScoreDataSource _ScoreDataSource = new ScoreDataSource();
    
        private ObservableCollection<ScoreDataGroup> _allGroups = new ObservableCollection<ScoreDataGroup>();
        public ObservableCollection<ScoreDataGroup> AllGroups
        {
            get { return this._allGroups; }
        }
    
        public static IEnumerable<object> GetGroups(string uniqueId)
        {
            if ( uniqueId == "AllGroups" )
            {
                var query = from item in _ScoreDataSource.AllGroups
                            orderby item.Country
                            group item by item.Country into g
                            select g;
    
                return query;
            }
            else
            {
                return _ScoreDataSource.AllGroups;
            }
        }
    


    Sunday, July 28, 2013 6:21 PM