Audo Anzon
Audo Anzon

Reputation: 103

How to hide togglebutton in grouping expander wpf

I want to hide or remove the togglebutton which appears in my grouping headers without losing functionality (User can press anywhere on the group to expand/close it) but I can't figure out where I can edit it in my current code or how can I do it otherwise to maintain what I have. I posted an image and my group xaml style code below.

https://i.sstatic.net/x3plv.png

<Style x:Key="GroupHeaderStyle" TargetType="{x:Type GroupItem}">

        <Setter Property="Template">

            <Setter.Value >
                <ControlTemplate TargetType="{x:Type GroupItem}">

                    <Expander x:Name="exp" Background="Firebrick">


                        <Expander.Header>

                            <StackPanel Orientation="Horizontal" Height="40" >
                                <TextBlock Text="{Binding Name}" Margin="0,0,0,0" FontSize="23" VerticalAlignment="Center" Foreground="White" />
                                <TextBlock Text="{Binding ItemCount}" FontSize="25" FontWeight="Bold" Margin="10,0,0,0" VerticalAlignment="Center" Foreground="White" />
                                <TextBlock Text="item(s)" FontSize="25" Margin="10,0,0,0" Width="1000"  VerticalAlignment="Center" Foreground="White"/>


                            </StackPanel>
                        </Expander.Header>


                        <ItemsPresenter>


                        </ItemsPresenter>

                        <Expander.Style>
                            <Style TargetType="Expander">

                                <Setter Property="IsExpanded" Value="False"></Setter>
                                <Style.Triggers>

                                    <DataTrigger Binding="{Binding Name}" Value="Title" >
                                        <Setter Property="IsExpanded" Value="True"></Setter>
                                        <Setter Property="IsEnabled" Value="False" />

                                    </DataTrigger>

                                </Style.Triggers>
                            </Style>
                        </Expander.Style>
                    </Expander>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

Upvotes: 1

Views: 1714

Answers (1)

mm8
mm8

Reputation: 169400

There is no property that you simply can set to get rid of the arrow. You need to modify the template of the Expander. Try this:

<Style x:Key="GroupHeaderStyle" TargetType="{x:Type GroupItem}">
    <Setter Property="Template">
        <Setter.Value >
            <ControlTemplate TargetType="{x:Type GroupItem}">
                <Expander x:Name="exp" Background="Firebrick">
                    <Expander.Header>
                        <StackPanel Orientation="Horizontal" Height="40" >
                            <TextBlock Text="{Binding Name}" Margin="0,0,0,0" FontSize="23" VerticalAlignment="Center" Foreground="White" />
                            <TextBlock Text="{Binding ItemCount}" FontSize="25" FontWeight="Bold" Margin="10,0,0,0" VerticalAlignment="Center" Foreground="White" />
                            <TextBlock Text="item(s)" FontSize="25" Margin="10,0,0,0" Width="1000"  VerticalAlignment="Center" Foreground="White"/>
                        </StackPanel>
                    </Expander.Header>
                    <ItemsPresenter />
                    <Expander.Style>
                        <Style TargetType="Expander">
                            <Setter Property="IsExpanded" Value="False"></Setter>
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="{x:Type Expander}">
                                        <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="true">
                                            <DockPanel>
                                                <ToggleButton x:Name="HeaderSite" ContentTemplate="{TemplateBinding HeaderTemplate}" ContentTemplateSelector="{TemplateBinding HeaderTemplateSelector}" Content="{TemplateBinding Header}" DockPanel.Dock="Top" Foreground="{TemplateBinding Foreground}" FontWeight="{TemplateBinding FontWeight}" FontStyle="{TemplateBinding FontStyle}" FontStretch="{TemplateBinding FontStretch}" FontSize="{TemplateBinding FontSize}" FontFamily="{TemplateBinding FontFamily}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" IsChecked="{Binding IsExpanded, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Margin="1" MinWidth="0" MinHeight="0" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}">
                                                    <ToggleButton.Template>
                                                        <ControlTemplate TargetType="{x:Type ToggleButton}">
                                                            <Border Padding="{TemplateBinding Padding}">
                                                                <ContentPresenter Margin="0,4,0,0" Grid.Row="1" RecognizesAccessKey="True" SnapsToDevicePixels="True" VerticalAlignment="Top"/>
                                                            </Border>
                                                        </ControlTemplate>
                                                    </ToggleButton.Template>
                                                </ToggleButton>
                                                <ContentPresenter x:Name="ExpandSite" DockPanel.Dock="Bottom" Focusable="false" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" Visibility="Collapsed" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                                            </DockPanel>
                                        </Border>
                                        <ControlTemplate.Triggers>
                                            <Trigger Property="IsExpanded" Value="true">
                                                <Setter Property="Visibility" TargetName="ExpandSite" Value="Visible"/>
                                            </Trigger>
                                            <Trigger Property="ExpandDirection" Value="Right">
                                                <Setter Property="DockPanel.Dock" TargetName="ExpandSite" Value="Right"/>
                                                <Setter Property="DockPanel.Dock" TargetName="HeaderSite" Value="Left"/>
                                                <Setter Property="Style" TargetName="HeaderSite" Value="{StaticResource ExpanderRightHeaderStyle}"/>
                                            </Trigger>
                                            <Trigger Property="ExpandDirection" Value="Up">
                                                <Setter Property="DockPanel.Dock" TargetName="ExpandSite" Value="Top"/>
                                                <Setter Property="DockPanel.Dock" TargetName="HeaderSite" Value="Bottom"/>
                                                <Setter Property="Style" TargetName="HeaderSite" Value="{StaticResource ExpanderUpHeaderStyle}"/>
                                            </Trigger>
                                            <Trigger Property="ExpandDirection" Value="Left">
                                                <Setter Property="DockPanel.Dock" TargetName="ExpandSite" Value="Left"/>
                                                <Setter Property="DockPanel.Dock" TargetName="HeaderSite" Value="Right"/>
                                                <Setter Property="Style" TargetName="HeaderSite" Value="{StaticResource ExpanderLeftHeaderStyle}"/>
                                            </Trigger>
                                            <Trigger Property="IsEnabled" Value="false">
                                                <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                                            </Trigger>
                                        </ControlTemplate.Triggers>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                            <Style.Triggers>
                                <DataTrigger Binding="{Binding Name}" Value="Title" >
                                    <Setter Property="IsExpanded" Value="True"></Setter>
                                    <Setter Property="IsEnabled" Value="False" />
                                </DataTrigger>
                            </Style.Triggers>
                        </Style>
                    </Expander.Style>
                </Expander>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

You can copy the default style/template of a control into your XAML markup by right-clicking on it in design mode in Visual Studio or in Blend and choose Edit Template->Edit a copy and then edit it as per your requirements.

Upvotes: 3

Related Questions