Question

I'm trying to data bind a collection ("Dashboard") that contains a ObservableCollection property.

I have managed to databind the dashboard class without any issues. I cant however work out how to databind to the Release collection that is contained within the dashboard class.

The issue seems to be on the GridView which is databound to the Releases property of the Dashboard class. The Stack Panel around the GridView is working correctly.

The classes

    public class Dashboard
{
    public Dashboard(String id, String projectName)
    {
        this.Id = id;
        this.ProjectName = projectName;
        this.Releases = new ObservableCollection<Release>();
    }

    public string Id { get; private set; }
    public string ProjectName { get; private set; }

    public ObservableCollection<Release> Releases { get; private set; }

    public override string ToString()
    {
        return this.ProjectName;
    }
}

public class Release
{
    public Release(string environmentName, string releaseVersion, string state, string releaseDate)
    {
        EnvironmentName = environmentName;
        ReleaseVersion = releaseVersion;
        State = state;
        ReleaseDate = releaseDate;
    }

    public string EnvironmentName { get; private set; }
    public string ReleaseVersion { get; private set; }
    public string State { get; private set; }
    public string ReleaseDate { get; private set; }
}

The XAML

   <HubSection x:Uid="Dashboard" x:Name="Dashboard" Header="Dashboard" DataContext="{Binding Dashboard}">
            <DataTemplate>
                <GridView x:Uid="DashboardGrid" x:Name="DashboardGrid" ItemsSource="{Binding}" ItemTemplate="{StaticResource Standard200x180TileItemTemplate}" >
                    <GridView.ItemsPanel>
                        <ItemsPanelTemplate>
                            <ItemsWrapGrid />
                        </ItemsPanelTemplate>
                    </GridView.ItemsPanel>
                </GridView>
            </DataTemplate>
        </HubSection>

The data template

<DataTemplate x:Key="Standard200x180TileItemTemplate">
        <StackPanel DataContext="{Binding}" >

            <TextBlock Text="{Binding ProjectName}" Grid.Column="0" Style="{ThemeResource BaseTextBlockStyle}" Typography.Capitals="SmallCaps" Grid.Row="0" IsTextScaleFactorEnabled="False"/>

            <GridView Grid.Row="1"  DataContext="{Binding Releases}">

                <TextBlock Text="{Binding EnvironmentName}" />
                <TextBlock Text="{Binding ReleaseVersion}" />
                <TextBlock>hello</TextBlock>

                <Border Background="#FF0CB90C" Height="110" Width="110" HorizontalAlignment="Left" Margin="0,0,10,0">

                </Border>
            </GridView>

        </StackPanel>
    </DataTemplate>
Was it helpful?

Solution

Set ItemsSource of GridView not DataContext and then use another DataTemplate

<StackPanel>
        <TextBlock Text="{Binding ProjectName}" Grid.Column="0" Style="{ThemeResource BaseTextBlockStyle}" Typography.Capitals="SmallCaps" Grid.Row="0" IsTextScaleFactorEnabled="False"/>
        <GridView Grid.Row="1"  ItemsSource="{Binding Releases}">
            <GridView.ItemTemplate>
            <DataTemplate>
               <TextBlock Text="{Binding EnvironmentName}" />
               <TextBlock Text="{Binding ReleaseVersion}" />
               <TextBlock>hello</TextBlock>
               <Border Background="#FF0CB90C" Height="110" Width="110"    HorizontalAlignment="Left" Margin="0,0,10,0">
               </Border>
             </DataTemplate>
             </GridView.ItemTemplate>
        </GridView>
    </StackPanel>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top