How to apply conditional GroupStyle

Emon Haque 3,176 Reputation points
2020-10-07T16:54:28.073+00:00

Here's what I've managed to do so far:

30706-capture.png

It shows summary of balances only when a tenant occupies more than one space. Those who occupies only one space, I want to have all information in a single line. For example: in case of Mr B, I want it to be in a single line like this:

Mr B - Bahrain 07 October, 2020 100,000 10,000 20,000

Here's the xaml for the ListBox:

<ListBox Grid.Row="2"   
        ItemsSource="{Binding CurrentBalance}"  
        HorizontalAlignment="Stretch"  
        ScrollViewer.HorizontalScrollBarVisibility="Disabled"  
        ScrollViewer.VerticalScrollBarVisibility="Auto"  
        BorderThickness="0">  
    <ListBox.GroupStyle>  
        <GroupStyle>  
            <GroupStyle.ContainerStyle>  
                <Style TargetType="GroupItem">  
                    <Setter Property="Template">  
                        <Setter.Value>  
                            <ControlTemplate TargetType="GroupItem">  
                                <Grid>  
                                    <Grid.RowDefinitions>  
                                        <RowDefinition Height="Auto"/>  
                                        <RowDefinition Height="*"/>  
                                        <RowDefinition Height="Auto"/>  
                                    </Grid.RowDefinitions>  
                                    <TextBlock Text="{Binding Name}" FontWeight="Bold"/>  
                                    <ItemsPresenter Grid.Row="1" Margin="10 0 0 0"/>  
                                    <ContentControl x:Name="footer" Grid.Row="2" Content="{Binding Items, Converter={StaticResource GSC}}"/>  
                                </Grid>  
                                <ControlTemplate.Triggers>  
                                    <DataTrigger Binding="{Binding Items.Count}" Value="1">  
                                        <Setter Property="Visibility" Value="Collapsed" TargetName="footer"/>  
                                    </DataTrigger>  
                                </ControlTemplate.Triggers>  
                            </ControlTemplate>  
                        </Setter.Value>  
                    </Setter>  
                </Style>  
            </GroupStyle.ContainerStyle>  
        </GroupStyle>  
    </ListBox.GroupStyle>  

    <ListBox.ItemContainerStyle>  
        <Style TargetType="ListBoxItem">  
            <Setter Property="Template">  
                <Setter.Value>  
                    <ControlTemplate TargetType="ListBoxItem">  
                        <Grid x:Name="panel" Margin="0 0 10 0">  
                            <Grid.ColumnDefinitions>  
                                <ColumnDefinition Width="3*"/>  
                                <ColumnDefinition Width="2*"/>  
                                <ColumnDefinition Width="*"/>  
                                <ColumnDefinition Width="*"/>  
                                <ColumnDefinition Width="*"/>  
                            </Grid.ColumnDefinitions>  
                            <TextBlock Grid.Column="0" Text="{Binding Space}" TextWrapping="Wrap"/>  
                            <TextBlock Grid.Column="1" Text="{Binding Date, StringFormat='dd MMMM, yyyy'}"/>  
                            <cc:NumReport Grid.Column="2" Text="{Binding Security}"/>  
                            <cc:NumReport Grid.Column="3" Text="{Binding Rent}"/>  
                            <cc:NumReport Grid.Column="4" Text="{Binding Due}"/>  
                        </Grid>  

                        <ControlTemplate.Triggers>  
                            <Trigger Property="IsMouseOver" Value="True">  
                                <Setter TargetName="panel" Property="Background" Value="LightGray"/>  
                            </Trigger>  
                            <Trigger Property="IsSelected" Value="True">  
                                <Setter TargetName="panel" Property="Background" Value="LightSkyBlue"/>  
                                <Setter TargetName="panel" Property="TextElement.FontWeight" Value="Bold"/>  
                            </Trigger>  
                            <DataTrigger Binding="{Binding IsExpired}" Value="True">  
                                <Setter Property="Background" Value="AliceBlue" TargetName="panel"/>  
                            </DataTrigger>  
                        </ControlTemplate.Triggers>  
                    </ControlTemplate>  

                </Setter.Value>  
            </Setter>  
        </Style>  
    </ListBox.ItemContainerStyle>  
</ListBox>  
Windows Presentation Foundation
Windows Presentation Foundation
A part of the .NET Framework that provides a unified programming model for building line-of-business desktop applications on Windows.
2,691 questions
0 comments No comments
{count} votes

Accepted answer
  1. Emon Haque 3,176 Reputation points
    2020-10-10T20:07:14.097+00:00

    Couldn't think of any better way than hide-and-seek using DataTrigger! The following works.

    <ControlTemplate TargetType="GroupItem">
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>
            <TextBlock x:Name="normalHeader" Text="{Binding Name}" FontWeight="Bold"/>
            <Grid x:Name="singleItem" Visibility="Collapsed" Margin="0 0 10 0">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="200"/>
                    <ColumnDefinition Width="100"/>
                    <ColumnDefinition Width="100"/>
                    <ColumnDefinition Width="100"/>
                </Grid.ColumnDefinitions>
                <TextBlock>
                    <Run Text="{Binding Name, Mode=OneWay}" FontWeight="Bold"/>
                    <Run Text=" - "/>
                    <Run Text="{Binding Items[0].Space}"/>
                </TextBlock>
                <TextBlock Grid.Column="1" Text="{Binding Items[0].Date, StringFormat='dd MMMM, yyyy'}" TextAlignment="Center"/>
                <cc:NumReport Grid.Column="2" Text="{Binding Items[0].Security}"/>
                <cc:NumReport Grid.Column="3" Text="{Binding Items[0].Rent}"/>
                <cc:NumReport Grid.Column="4" Text="{Binding Items[0].Due}"/>
            </Grid>
            <ItemsPresenter Grid.Row="1" Margin="10 0 0 0" x:Name="itemsPresenter"/>
            <ContentPresenter x:Name="footer" Grid.Row="2" Content="{Binding Items, Converter={StaticResource GSC}}"/>
        </Grid>
        <ControlTemplate.Triggers>
            <DataTrigger Binding="{Binding Items.Count}" Value="1">
                <Setter Property="Visibility" Value="Collapsed" TargetName="normalHeader"/>
                <Setter Property="Visibility" Value="Collapsed" TargetName="itemsPresenter"/>
                <Setter Property="Visibility" Value="Collapsed" TargetName="footer"/>
                <Setter Property="Visibility" Value="Visible" TargetName="singleItem"/>
            </DataTrigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
    

    The problem is I can't select group header! Is it possible to select the Line/Header on click? Is it possible to sort these by number of spaces occupied?

    0 comments No comments

0 additional answers

Sort by: Most helpful