WPF Style.Trigger

Question

Hi,

Somebody can tell me why this trigger doesn't work:

<!--Style-->
<Style x:Key="Test" TargetType="{x:Type Expander}">
            <Style.Triggers>
                <Trigger Property="IsEnabled" Value="false">
                    <Setter Property="IsExpanded" Value="false"></Setter>
                </Trigger>
            </Style.Triggers>
        </Style>

<!-- Syle applyed in expander -->
<Expander Header="Expander" Margin="40,89,118,0" Name="expander1" Height="23" VerticalAlignment="Top" >
            <Grid>
                <Ellipse Height="100" Margin="86,0,-8,-58" Name="ellipse1" Stroke="Black" VerticalAlignment="Bottom" />        
            </Grid>
        </Expander>

<!-- Code Behind -->
        private void button1_Click(object sender, RoutedEventArgs e)
        {
            this.expander1.IsEnabled = false;
        }

I try in other ways, but without success.. Have another way to collapse content when expander is disabled.

Answer 1

You need to apply the style to the Expander like:

<Expander Header="Expander" Name="expander1" Style="{StaticResource Test}" >
...
</Expander>

If you don't want to explicitly apply the style, then don't declare x:Key="Test", and all Expanders in the same scope as that resource (i.e. all Expanders in that particular Page if you declared x:Key="Test" in <Page.Resources>) will inherit that style.

Answer 2

Hi, Thanks, but i forgot the block of code that you mentioned. I put a reference in Style tag, and, the problem persist.

Answer 3

The problem is that when the user clicks on the expander, the IsExpanded "local value" is set, which takes precedence over the trigger. See this msdn page for more information about dependency property value precedence.

A possible solution will be to rewrite the entire Expander control template, adding a trigger to the template's triggers that hides the "expanded" zone if IsEnabled is false (the default template only does this if IsExpanded is false). You can get the default template using Blend, by adding an expander on a Window, right click on it and select Edit Template > Edit a copy in the contextual menu.

Answer 4

i tried this, something like:

<ControlTemplate TargetType="{x:Type Expander}">
                    <Border SnapsToDevicePixels="true" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="3">
                        <DockPanel>
                            <ToggleButton x:Name="HeaderSite" FocusVisualStyle="{StaticResource ExpanderHeaderFocusVisual}" Margin="1" MinHeight="0" MinWidth="0" Style="{StaticResource ExpanderDownHeaderStyle}" 
                                  Content="{TemplateBinding Header}" ContentTemplate="{TemplateBinding HeaderTemplate}" ContentTemplateSelector="{TemplateBinding HeaderTemplateSelector}" 
                                  FontFamily="{TemplateBinding FontFamily}" FontSize="{TemplateBinding FontSize}" FontStretch="{TemplateBinding FontStretch}" FontStyle="{TemplateBinding FontStyle}" 
                                  FontWeight="{TemplateBinding FontWeight}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" 
                                  Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" IsChecked="{Binding IsExpanded, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" DockPanel.Dock="Top"/>

                            <ContentPresenter x:Name="ExpandSite" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                                  Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
                                  Focusable="false" Visibility="Collapsed" DockPanel.Dock="Bottom" />
                        </DockPanel>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsExpanded" Value="true">
                            <Setter Property="Visibility" TargetName="ExpandSite" Value="Visible"/>
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="Opacity" Value="0.4"/>                           
                            <Setter Property="Visibility" TargetName="ExpandSite" Value="Collapsed"/>
                        </Trigger>                        
                    </ControlTemplate.Triggers>
                </ControlTemplate>

But, the Collapse event not fires.