Grouping ListBox with Date on same line as Data

70 Views Asked by At

I have a ListBox that binds to a ListCollectionView called "Schedules".

<ListBox Grid.Row="2" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ItemsSource="{Binding Schedules}">
    <ListBox.GroupStyle>
        <GroupStyle>
            <GroupStyle.HeaderTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Name}" />
                </DataTemplate>
            </GroupStyle.HeaderTemplate>
        </GroupStyle>
    </ListBox.GroupStyle>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel Background="Transparent">
                <Grid Background="Transparent">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition  Width="100"/>
                        <ColumnDefinition  Width="100"/>
                        <ColumnDefinition/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition/>
                    </Grid.RowDefinitions>
                    <!--I want my DateTime Grouping Here basically-->
                    <!--<TextBlock Grid.Column="0" Grid.Row="0"  Text="{Binding MyDateTime}" HorizontalAlignment="Left"  VerticalAlignment="Center"/>-->
                    <TextBlock Grid.Column="1" Grid.Row="0"  Text="{Binding MyDateTime, StringFormat='t'}" HorizontalAlignment="Left"  VerticalAlignment="Center"/>
                    <TextBlock Grid.Column="2" Grid.Row="0"  Text="{Binding SomeText}"  TextTrimming="WordEllipsis" LineStackingStrategy="MaxHeight" MaxHeight="20" HorizontalAlignment="Left"  VerticalAlignment="Center"/>
                </Grid>
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

And in my viewmodel I Group it by Date only (I use a ValueConverter that gives me back only a date:

Schedules.GroupDescriptions.Add(new PropertyGroupDescription("MyDateTime", new DateTimeToDateOnlyConverter()));

Is it possible to have the grouping but displaying it on the same line as the other data? Now you have a case where you get:

MyDateTime
-----------------Time | Sometext
-----------------Time | Sometext
-----------------Time | Sometext
MyDateTime2
-----------------Time | Sometext

I want it to display like this:

MyDateTime | Time | Sometext
                     | Time | Sometext
                     | Time | Sometext
MyDateTime | Time | Sometext
                     | Time | Sometext
                     | Time | Sometext

1

There are 1 best solutions below

0
Fineiwilldoitmyself On

Add grid.rowspan to your xaml to merge rows

<TextBlock Grid.Column="0" Grid.Row="0" Grid.RowSpan="2" Text="{Binding MyDateTime}" HorizontalAlignment="Left" VerticalAlignment="Center"/>