Empêcher un expandeur WPF de se développer lorsque l'utilisateur clique sur l'en-tête

Comment puis-je empêcher l'extension d'un WPF Expander lorsque son en-tête est cliqué? Je voudrais que mon Expander se dilate ou se réduit uniquement lorsque le bouton d'expansion lui-même est cliqué. J'imagine que la réponse a quelque chose à voir avec l'annulation d'un événement bullé. Si possible, je voudrais implémenter la solution en XAML tout en évitant de retaper l'intégralité de Expander.Empêcher un expandeur WPF de se développer lorsque l'utilisateur clique sur l'en-tête

Source

2009-09-08 M. Dudley

Moi aussi! Qu'avez-vous fini par faire? –

Je n'ai pas trouvé de solution et j'ai laissé l'expanseur tel quel. –

La solution que j'ai utilisée est de placer un bouton à l'intérieur des balises et de le modéliser pour qu'il ne comporte aucun mouseenter, clique sur les événements et une valeur alpha de 1% (# 02000000). . Il va alors manger l'événement de clic d'en-tête expander. –

L'en-tête est le bouton qui crée l'événement, vous devez donc modifier le modèle de votre Expander pour avoir simplement l'icône Expander comme bouton. Il s'agit d'un article de how to change the expander.

Source

2009-11-30 08:27:03

J'ai modifié le modèle par défaut pour le contrôle Expander comme suggéré par Simeon.

Le ControlTemplate définit un expandeur qui réagit (se dilate/se rétracte) uniquement lorsque l'utilisateur clique sur l'icône d'en-tête.

Ceci est rapide et sale alors attendez-vous à casser.

<ControlTemplate x:Key="LazyExpanderTemplate" TargetType="Expander"> 
     <Border BorderThickness="{TemplateBinding Border.BorderThickness}" CornerRadius="3,3,3,3" BorderBrush="{TemplateBinding Border.BorderBrush}" Background="{TemplateBinding Panel.Background}" SnapsToDevicePixels="True"> 
      <DockPanel> 
       <DockPanel DockPanel.Dock="Top" Name="HeaderSite"> 
        <ToggleButton 
         DockPanel.Dock="Left" 
         IsChecked="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsExpanded}" 
         Foreground="{TemplateBinding TextElement.Foreground}" 
         FontFamily="{TemplateBinding TextElement.FontFamily}" 
         FontSize="{TemplateBinding TextElement.FontSize}" 
         FontStretch="{TemplateBinding TextElement.FontStretch}" 
         FontStyle="{TemplateBinding TextElement.FontStyle}" 
         FontWeight="{TemplateBinding TextElement.FontWeight}" 
         HorizontalContentAlignment="{TemplateBinding Control.HorizontalContentAlignment}" 
         VerticalContentAlignment="{TemplateBinding Control.VerticalContentAlignment}" 
         Padding="{TemplateBinding Control.Padding}" 
         MinWidth="0" 
         MinHeight="0" 
         Margin="1,1,1,1" 
         > 
         <ToggleButton.Style> 
          <Style TargetType="ToggleButton"> 
           <Setter Property="Control.Template"> 
            <Setter.Value> 
             <ControlTemplate TargetType="ToggleButton"> 
              <Border Padding="{TemplateBinding Control.Padding}"> 
               <Grid Background="#00FFFFFF" SnapsToDevicePixels="False"> 
                <Grid.ColumnDefinitions> 
                 <ColumnDefinition Width="19" /> 
                 <ColumnDefinition Width="*" /> 
                </Grid.ColumnDefinitions> 
                <Ellipse Stroke="#FFA9A9A9" Name="circle" Width="19" Height="19" HorizontalAlignment="Center" VerticalAlignment="Center" /> 
                <Ellipse Name="shadow" Width="17" Height="17" HorizontalAlignment="Center" VerticalAlignment="Center" Visibility="Hidden" /> 
                <Path Data="M1,1.5L4.5,5 8,1.5" Stroke="#FF666666" StrokeThickness="2" Name="arrow" HorizontalAlignment="Center" VerticalAlignment="Center" SnapsToDevicePixels="False" /> 
               </Grid> 
              </Border> 
              <ControlTemplate.Triggers> 
               <Trigger Property="ToggleButton.IsChecked" Value="True" > 
                <Setter Property="Path.Data" TargetName="arrow"> 
                 <Setter.Value> 
                  <StreamGeometry>M1,4.5L4.5,1 8,4.5</StreamGeometry> 
                 </Setter.Value> 
                </Setter> 
               </Trigger> 
               <Trigger Property="UIElement.IsMouseOver" Value="True"> 
                <Setter Property="Shape.Stroke" TargetName="circle"> 
                 <Setter.Value> 
                  <SolidColorBrush>#FF666666</SolidColorBrush> 
                 </Setter.Value> 
                </Setter> 
                <Setter Property="Shape.Stroke" TargetName="arrow"> 
                 <Setter.Value> 
                  <SolidColorBrush>#FF222222</SolidColorBrush> 
                 </Setter.Value> 
                </Setter> 
                <Setter Property="UIElement.Visibility" TargetName="shadow"> 
                 <Setter.Value> 
                  <x:Static Member="Visibility.Visible" /> 
                 </Setter.Value> 
                </Setter> 
               </Trigger> 
              </ControlTemplate.Triggers> 
             </ControlTemplate> 
            </Setter.Value> 
           </Setter> 
          </Style> 
         </ToggleButton.Style> 
         <ToggleButton.FocusVisualStyle> 
          <Style TargetType="IFrameworkInputElement"> 
           <Setter Property="Control.Template"> 
            <Setter.Value> 
             <ControlTemplate> 
              <Border> 
               <Rectangle Stroke="#FF000000" StrokeThickness="1" StrokeDashArray="1 2" Margin="0,0,0,0" SnapsToDevicePixels="True" /> 
              </Border> 
             </ControlTemplate> 
            </Setter.Value> 
           </Setter> 
          </Style> 
         </ToggleButton.FocusVisualStyle> 
        </ToggleButton> 
        <ContentPresenter 
         RecognizesAccessKey="True" 
         Content="{TemplateBinding HeaderedContentControl.Header}" 
         ContentTemplate="{TemplateBinding HeaderedContentControl.HeaderTemplate}" 
         ContentStringFormat="{TemplateBinding HeaderedContentControl.HeaderStringFormat}" 
         Margin="4,0,0,0" 
         HorizontalAlignment="Left" 
         VerticalAlignment="Center" 
         SnapsToDevicePixels="True" 
         /> 
       </DockPanel> 
       <ContentPresenter Content="{TemplateBinding ContentControl.Content}" ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}" ContentStringFormat="{TemplateBinding ContentControl.ContentStringFormat}" Name="ExpandSite" Margin="{TemplateBinding Control.Padding}" HorizontalAlignment="{TemplateBinding Control.HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding Control.VerticalContentAlignment}" Visibility="Collapsed" Focusable="False" DockPanel.Dock="Bottom" /> 
      </DockPanel> 
     </Border> 
     <ControlTemplate.Triggers> 
      <Trigger Property="Expander.IsExpanded"> 
       <Setter Property="UIElement.Visibility" TargetName="ExpandSite"> 
        <Setter.Value> 
         <x:Static Member="Visibility.Visible" /> 
        </Setter.Value> 
       </Setter> 
       <Trigger.Value> 
        <s:Boolean>True</s:Boolean> 
       </Trigger.Value> 
      </Trigger> 
      <Trigger Property="Expander.ExpandDirection" Value="Right"> 
       <Setter Property="DockPanel.Dock" TargetName="ExpandSite" Value="Right"/> 
       <Setter Property="DockPanel.Dock" TargetName="HeaderSite" Value="Left"/> 
       <Setter Property="FrameworkElement.Style" TargetName="HeaderSite"> 
        <Setter.Value> 
         <Style TargetType="ToggleButton"> 
          <Setter Property="Control.Template"> 
           <Setter.Value> 
            <ControlTemplate TargetType="ToggleButton"> 
             <Border Padding="{TemplateBinding Control.Padding}"> 
              <Grid Background="#00FFFFFF" SnapsToDevicePixels="False"> 
               <Grid.RowDefinitions> 
                <RowDefinition Height="19" /> 
                <RowDefinition Height="*" /> 
               </Grid.RowDefinitions> 
               <Grid> 
                <Grid.LayoutTransform> 
                 <TransformGroup> 
                  <TransformGroup.Children> 
                   <RotateTransform Angle="-90" /> 
                  </TransformGroup.Children> 
                 </TransformGroup> 
                </Grid.LayoutTransform> 
                <Ellipse Stroke="#FFA9A9A9" Name="circle" Width="19" Height="19" HorizontalAlignment="Center" VerticalAlignment="Center" /> 
                <Ellipse Name="shadow" Width="17" Height="17" HorizontalAlignment="Center" VerticalAlignment="Center" Visibility="Hidden" /> 
                <Path Data="M1,1.5L4.5,5 8,1.5" Stroke="#FF666666" StrokeThickness="2" Name="arrow" HorizontalAlignment="Center" VerticalAlignment="Center" SnapsToDevicePixels="False" /> 
               </Grid> 
               <ContentPresenter RecognizesAccessKey="True" Content="{TemplateBinding ContentControl.Content}" ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}" ContentStringFormat="{TemplateBinding ContentControl.ContentStringFormat}" Margin="0,4,0,0" HorizontalAlignment="Center" VerticalAlignment="Top" SnapsToDevicePixels="True" Grid.Row="1" /> 
              </Grid> 
             </Border> 
             <ControlTemplate.Triggers> 
              <Trigger Property="ToggleButton.IsChecked"> 
               <Setter Property="Path.Data" TargetName="arrow"> 
                <Setter.Value> 
                 <StreamGeometry>M1,4.5L4.5,1 8,4.5</StreamGeometry> 
                </Setter.Value> 
               </Setter> 
               <Trigger.Value> 
                <s:Boolean>True</s:Boolean> 
               </Trigger.Value> 
              </Trigger> 
              <Trigger Property="UIElement.IsMouseOver"> 
               <Setter Property="Shape.Stroke" TargetName="circle"> 
                <Setter.Value> 
                 <SolidColorBrush>#FF666666</SolidColorBrush> 
                </Setter.Value> 
               </Setter> 
               <Setter Property="Shape.Stroke" TargetName="arrow"> 
                <Setter.Value> 
                 <SolidColorBrush>#FF222222</SolidColorBrush> 
                </Setter.Value> 
               </Setter> 
               <Setter Property="UIElement.Visibility" TargetName="shadow"> 
                <Setter.Value> 
                 <x:Static Member="Visibility.Visible" /> 
                </Setter.Value> 
               </Setter> 
               <Trigger.Value> 
                <s:Boolean>True</s:Boolean> 
               </Trigger.Value> 
              </Trigger> 
             </ControlTemplate.Triggers> 
            </ControlTemplate> 
           </Setter.Value> 
          </Setter> 
         </Style> 
        </Setter.Value> 
       </Setter> 
      </Trigger> 
      <Trigger Property="Expander.ExpandDirection"> 
       <Setter Property="DockPanel.Dock" TargetName="ExpandSite" Value="Top"/> 
       <Setter Property="DockPanel.Dock" TargetName="HeaderSite" Value="Bottom"/> 
       <Setter Property="FrameworkElement.Style" TargetName="HeaderSite"> 
        <Setter.Value> 
         <Style TargetType="ToggleButton"> 
          <Setter Property="Control.Template"> 
           <Setter.Value> 
            <ControlTemplate TargetType="ToggleButton"> 
             <Border Padding="{TemplateBinding Control.Padding}"> 
              <Grid Background="#00FFFFFF" SnapsToDevicePixels="False"> 
               <Grid.ColumnDefinitions> 
                <ColumnDefinition Width="19" /> 
                <ColumnDefinition Width="*" /> 
               </Grid.ColumnDefinitions> 
               <Grid> 
                <Grid.LayoutTransform> 
                 <TransformGroup> 
                  <TransformGroup.Children> 
                   <RotateTransform Angle="180" /> 
                  </TransformGroup.Children> 
                 </TransformGroup> 
                </Grid.LayoutTransform> 
                <Ellipse Stroke="#FFA9A9A9" Name="circle" Width="19" Height="19" HorizontalAlignment="Center" VerticalAlignment="Center" /> 
                <Ellipse Name="shadow" Width="17" Height="17" HorizontalAlignment="Center" VerticalAlignment="Center" Visibility="Hidden" /> 
                <Path Data="M1,1.5L4.5,5 8,1.5" Stroke="#FF666666" StrokeThickness="2" Name="arrow" HorizontalAlignment="Center" VerticalAlignment="Center" SnapsToDevicePixels="False" /> 
               </Grid> 
               <ContentPresenter RecognizesAccessKey="True" Content="{TemplateBinding ContentControl.Content}" ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}" ContentStringFormat="{TemplateBinding ContentControl.ContentStringFormat}" Margin="4,0,0,0" HorizontalAlignment="Left" VerticalAlignment="Center" SnapsToDevicePixels="True" Grid.Column="1" /> 
              </Grid> 
             </Border> 
             <ControlTemplate.Triggers> 
              <Trigger Property="ToggleButton.IsChecked"> 
               <Setter Property="Path.Data" TargetName="arrow"> 
                <Setter.Value> 
                 <StreamGeometry>M1,4.5L4.5,1 8,4.5</StreamGeometry> 
                </Setter.Value> 
               </Setter> 
               <Trigger.Value> 
                <s:Boolean>True</s:Boolean> 
               </Trigger.Value> 
              </Trigger> 
              <Trigger Property="UIElement.IsMouseOver"> 
               <Setter Property="Shape.Stroke" TargetName="circle"> 
                <Setter.Value> 
                 <SolidColorBrush>#FF666666</SolidColorBrush> 
                </Setter.Value> 
               </Setter> 
               <Setter Property="Shape.Stroke" TargetName="arrow"> 
                <Setter.Value> 
                 <SolidColorBrush>#FF222222</SolidColorBrush> 
                </Setter.Value> 
               </Setter> 
               <Setter Property="UIElement.Visibility" TargetName="shadow"> 
                <Setter.Value> 
                 <x:Static Member="Visibility.Visible" /> 
                </Setter.Value> 
               </Setter> 
               <Trigger.Value> 
                <s:Boolean>True</s:Boolean> 
               </Trigger.Value> 
              </Trigger> 
             </ControlTemplate.Triggers> 
            </ControlTemplate> 
           </Setter.Value> 
          </Setter> 
         </Style> 
        </Setter.Value> 
       </Setter> 
       <Trigger.Value> 
        <x:Static Member="ExpandDirection.Up" /> 
       </Trigger.Value> 
      </Trigger> 
      <Trigger Property="Expander.ExpandDirection"> 
       <Setter Property="DockPanel.Dock" TargetName="ExpandSite"> 
        <Setter.Value> 
         <x:Static Member="Dock.Left" /> 
        </Setter.Value> 
       </Setter> 
       <Setter Property="DockPanel.Dock" TargetName="HeaderSite"> 
        <Setter.Value> 
         <x:Static Member="Dock.Right" /> 
        </Setter.Value> 
       </Setter> 
       <Setter Property="FrameworkElement.Style" TargetName="HeaderSite"> 
        <Setter.Value> 
         <Style TargetType="ToggleButton"> 
          <Setter Property="Control.Template"> 
           <Setter.Value> 
            <ControlTemplate TargetType="ToggleButton"> 
             <Border Padding="{TemplateBinding Control.Padding}"> 
              <Grid Background="#00FFFFFF" SnapsToDevicePixels="False"> 
               <Grid.RowDefinitions> 
                <RowDefinition Height="19" /> 
                <RowDefinition Height="*" /> 
               </Grid.RowDefinitions> 
               <Grid> 
                <Grid.LayoutTransform> 
                 <TransformGroup> 
                  <TransformGroup.Children> 
                   <RotateTransform Angle="90" /> 
                  </TransformGroup.Children> 
                 </TransformGroup> 
                </Grid.LayoutTransform> 
                <Ellipse Stroke="#FFA9A9A9" Name="circle" Width="19" Height="19" HorizontalAlignment="Center" VerticalAlignment="Center" /> 
                <Ellipse Name="shadow" Width="17" Height="17" HorizontalAlignment="Center" VerticalAlignment="Center" Visibility="Hidden" /> 
                <Path Data="M1,1.5L4.5,5 8,1.5" Stroke="#FF666666" StrokeThickness="2" Name="arrow" HorizontalAlignment="Center" VerticalAlignment="Center" SnapsToDevicePixels="False" /> 
               </Grid> 
               <ContentPresenter RecognizesAccessKey="True" Content="{TemplateBinding ContentControl.Content}" ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}" ContentStringFormat="{TemplateBinding ContentControl.ContentStringFormat}" Margin="0,4,0,0" HorizontalAlignment="Center" VerticalAlignment="Top" SnapsToDevicePixels="True" Grid.Row="1" /> 
              </Grid> 
             </Border> 
             <ControlTemplate.Triggers> 
              <Trigger Property="ToggleButton.IsChecked"> 
               <Setter Property="Path.Data" TargetName="arrow"> 
                <Setter.Value> 
                 <StreamGeometry>M1,4.5L4.5,1 8,4.5</StreamGeometry> 
                </Setter.Value> 
               </Setter> 
               <Trigger.Value> 
                <s:Boolean>True</s:Boolean> 
               </Trigger.Value> 
              </Trigger> 
              <Trigger Property="UIElement.IsMouseOver"> 
               <Setter Property="Shape.Stroke" TargetName="circle"> 
                <Setter.Value> 
                 <SolidColorBrush>#FF666666</SolidColorBrush> 
                </Setter.Value> 
               </Setter> 
               <Setter Property="Shape.Stroke" TargetName="arrow"> 
                <Setter.Value> 
                 <SolidColorBrush>#FF222222</SolidColorBrush> 
                </Setter.Value> 
               </Setter> 
               <Setter Property="UIElement.Visibility" TargetName="shadow"> 
                <Setter.Value> 
                 <x:Static Member="Visibility.Visible" /> 
                </Setter.Value> 
               </Setter> 
               <Trigger.Value> 
                <s:Boolean>True</s:Boolean> 
               </Trigger.Value> 
              </Trigger> 
             </ControlTemplate.Triggers> 
            </ControlTemplate> 
           </Setter.Value> 
          </Setter> 
         </Style> 
        </Setter.Value> 
       </Setter> 
       <Trigger.Value> 
        <x:Static Member="ExpandDirection.Left" /> 
       </Trigger.Value> 
      </Trigger> 
      <Trigger Property="UIElement.IsEnabled"> 
       <Setter Property="TextElement.Foreground"> 
        <Setter.Value> 
         <DynamicResource ResourceKey="{x:Static SystemColors.GrayTextBrushKey}" /> 
        </Setter.Value> 
       </Setter> 
       <Trigger.Value> 
        <s:Boolean>False</s:Boolean> 
       </Trigger.Value> 
      </Trigger> 
     </ControlTemplate.Triggers> 
    </ControlTemplate>

Source

2010-06-11 20:58:10

Ma solution était de laisser l'en-tête étiquette vierge et juste sur un contrôle qui agit comme l'en-tête (en utilisant une toile pour le positionnement absolu), de cette façon que l'icône élargit le contrôle:

<Grid Height="{Binding ElementName=exp, Path=ActualHeight}"> 
    <Canvas> 
     <Expander Name="exp"> 
     ... 
     </Expander> 
     <Control Style="{StaticResource ExpanderHeaderStyle}" Margin="20,0,0,0" /> 
    </Canvas> 
</Grid>

Source

2012-10-31 13:04:12 RobJohnson

Il existe une solution XAML beaucoup plus simple que la modification de modèles. N'utilisez simplement PAS la propriété d'en-tête d'Expander dans ce cas. Au lieu de cela, couvrir l'expandeur avec votre propre TextBlock stylé.

<Application.Resources> 
    <Style x:Key="ExpanderHeader" TargetType="{x:Type TextBlock}"> 
     <Setter Property="Height" Value="22" /> 
     <Setter Property="Margin" Value="21,0,0,0" /> 
     <Setter Property="Padding" Value="9,3,0,0" /> 
     <Setter Property="HorizontalAlignment" Value="Stretch" /> 
     <Setter Property="VerticalAlignment" Value="Top" /> 
    </Style> 
</Application.Resources> 

<Grid> 
    <Expander> 
     <TextBlock Text="I am some content. I have disowned my default header." Margin="10,5" /> 
    </Expander> 
    <TextBlock Text="I'm filling in for the default header. You'll like me better anyway." 
       Style="{StaticResource ResourceKey=ExpanderHeader}"/> 
</Grid>

Source

2012-11-19 18:51:45 bugged87

C'est une réponse tellement brillante. Je l'ai testé et ça fonctionne comme un charme. L'utiliser dans ma propre application maintenant. –

FYI, vous pouvez placer ce XAML dans un contrôle personnalisé qui peut être utilisé tout au long de votre projet. – bugged87

Empêcher un expandeur WPF de se développer lorsque l'utilisateur clique sur l'en-tête

Répondre

Questions connexes