Binding Dictionary with Listview item and header

Question

I am trying to bind a Dictionary> with the list view. Setting the header as the key of Idictionary and List of appointment object as items. But the data is not getting bound.

The string (key) needs to be bound with the header element and the inner list list contains the objects under that header.

Output planned:

How can i fix this?

<ListView ScrollViewer.VerticalScrollBarVisibility="Hidden"        ScrollViewer.VerticalScrollMode="Auto" ScrollViewer.HorizontalScrollMode="Auto"
                         ItemsSource="{Binding Source={StaticResource   EventsObj}}">      
<ListView.ItemsPanel>
    <ItemsPanelTemplate>
        <VirtualizingStackPanel Orientation="Horizontal" />
    </ItemsPanelTemplate>
</ListView.ItemsPanel>

<ListView.ItemTemplate>
    <DataTemplate>
        <Textblock Text="{Binding EventsObj.Value.UserName}"/>
        <Textblock Text="{Binding EventsObj.Value.VisitorFor}"/>
    </DataTemplate>
</ListView.ItemTemplate>
<ListView.HeaderTemplate>
    <DataTemplate>
        <Grid Margin="5,10,0,10"  Background="Black">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="68*"/>
                <ColumnDefinition Width="21*"/>
            </Grid.ColumnDefinitions>
            <TextBlock Foreground="White" Text="{Binding EventsObj.Key}">
            </TextBlock>
        </Grid>
    </DataTemplate>
</ListView.HeaderTemplate>

Object in C# is

public class Appointment
{
   public Dictionary<DateTime, List<Appointments>> Data {get; set;}
}

public class Appointments
{
 public string UserName {get; set;}
 public string VisitorFor {get; set;}
}


        List<Appointments> Datas = new List<Appointments>();
        Datas = new List<Aprio.Appointments>();
        Datas.Add(new Appointments { UserName = "Pradeep", VisitorFor = "John Sam" });
        Datas.Add(new Appointments { UserName = "Danny", VisitorFor = "John Sam" });
        Datas.Add(new Appointments { UserName = "Ram", VisitorFor = "John Sam" });
        Datas.Add(new Appointments { UserName = "Siva", VisitorFor = "John Sam" });
        Datas.Add(new Appointments { UserName = "Ragu", VisitorFor = "John Sam" });
        this.Appointment.Add("John", Datas);

        List<Appointments> Datas2 = new List<Appointments>();
        Datas2 = new List<Appointments>();
        Datas2.Add(new Appointments { UserName = "Guru", VisitorFor = "Sam Hilferg" });
        Datas2.Add(new Appointments { UserName = "Jack", VisitorFor = "Sam Hilferg" });
        Datas2.Add(new Appointments { UserName = "Bob", VisitorFor = "Sam Hilferg" });
        this.Appointment.Add("Sam", Datas2);

Answer 1

I have moved the header to the right. Found this answer in MSDN. It worked for me.

 <GridView.ItemsPanel>
    <ItemsPanelTemplate>
    <ItemsWrapGrid GroupHeaderPlacement="Left"/>
    </ItemsPanelTemplate>
 </GridView.ItemsPanel>