2009-07-01 90 views
20

當使用WPF擴展控件時,它將以默認的「向上」和「向下」箭頭鍵顯示。有什麼辦法可以隱藏上下箭頭嗎?隱藏WPF擴展控件的箭頭

UPDATE:

我設法通過創建ControlTemplate刪除箭頭,但現在擴展能力也不見了:

<ContentPresenter Content="{TemplateBinding Expander.Header}"></ContentPresenter> 
      <ContentPresenter Content="{TemplateBinding Expander.Content}"></ContentPresenter> 



<Expander Template="{StaticResource ExpanderControlTemplate}" IsExpanded="False" Cursor="Hand">    

       <Expander.Header> 
       <Border Style="{StaticResource FeedTitleStyle}"> 
       <DockPanel Width="Auto"> 
        <TextBlock DockPanel.Dock="Left" FontSize="16" Text="IronRuby in Action!" />     
       </DockPanel>   

      </Border>     
       </Expander.Header> 
       <Expander.Content>      
        <TextBlock Text="This is the decriprion!" /> 
       </Expander.Content> 

      </Expander> 

回答

53

不幸的是,ContentPresenter的ExpanderTemplate內的頭在同一網格作爲箭頭,所以只需設置HeaderTemplate不會對我們有所幫助。

使用Mole我們可以看到ToggleButton有一個橢圓 - 表示圓,一個Path - 表示箭頭,ContentPresenter顯示您爲Header屬性設置的內容。

alt text http://i42.tinypic.com/2ihlzzr.jpg

現在我們知道的擴展的實際佈局,有幾種方法,我們可以去修改它。爲Expander創建一個全新的ControlTemplate,或者獲取我們想要移除的部分以及移除/隱藏它們。

更新:得到混合的保持,生成模板擴展器後,它非常簡單,只是需要經歷和從每個切換按鈕樣式刪除橢圓和路徑。

<Style x:Key="ExpanderHeaderFocusVisual"> 
    <Setter Property="Control.Template"> 
    <Setter.Value> 
     <ControlTemplate> 
      <Border> 
       <Rectangle SnapsToDevicePixels="true" 
          Margin="0" 
          Stroke="Black" 
          StrokeDashArray="1 2" 
          StrokeThickness="1" /> 
      </Border> 
     </ControlTemplate> 
    </Setter.Value> 
    </Setter> 
</Style> 

<Style x:Key="ExpanderDownHeaderStyle" 
     TargetType="{x:Type ToggleButton}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type ToggleButton}"> 
       <Border Padding="{TemplateBinding Padding}"> 
        <Grid SnapsToDevicePixels="False" 
          Background="Transparent"> 
         <ContentPresenter SnapsToDevicePixels="True" 
              HorizontalAlignment="Left" 
              VerticalAlignment="Center" 
              RecognizesAccessKey="True" /> 
        </Grid> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 
<Style x:Key="ExpanderRightHeaderStyle" 
     TargetType="{x:Type ToggleButton}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type ToggleButton}"> 
       <Border Padding="{TemplateBinding Padding}"> 
        <Grid SnapsToDevicePixels="False" 
          Background="Transparent"> 
         <ContentPresenter SnapsToDevicePixels="True" 
              HorizontalAlignment="Center" 
              VerticalAlignment="Top" 
              RecognizesAccessKey="True" /> 
        </Grid> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 
<Style x:Key="ExpanderUpHeaderStyle" 
     TargetType="{x:Type ToggleButton}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type ToggleButton}"> 
       <Border Padding="{TemplateBinding Padding}"> 
        <Grid SnapsToDevicePixels="False" 
          Background="Transparent"> 
         <ContentPresenter SnapsToDevicePixels="True" 
              HorizontalAlignment="Left" 
              VerticalAlignment="Center" 
              RecognizesAccessKey="True" /> 
        </Grid> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 
<Style x:Key="ExpanderLeftHeaderStyle" 
     TargetType="{x:Type ToggleButton}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type ToggleButton}"> 
       <Border Padding="{TemplateBinding Padding}"> 
        <Grid SnapsToDevicePixels="False" 
          Background="Transparent"> 
         <ContentPresenter SnapsToDevicePixels="True" 
              HorizontalAlignment="Center" 
              VerticalAlignment="Top" 
              RecognizesAccessKey="True" /> 
        </Grid> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 
<Style x:Key="ArrowlessExpanderTemplate" 
     TargetType="{x:Type Expander}"> 
    <Setter Property="Foreground" 
      Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" /> 
    <Setter Property="Background" 
      Value="Transparent" /> 
    <Setter Property="HorizontalContentAlignment" 
      Value="Stretch" /> 
    <Setter Property="VerticalContentAlignment" 
      Value="Stretch" /> 
    <Setter Property="BorderBrush" 
      Value="Transparent" /> 
    <Setter Property="BorderThickness" 
      Value="1" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type Expander}"> 
       <Border SnapsToDevicePixels="true" 
         Background="{TemplateBinding Background}" 
         BorderBrush="{TemplateBinding BorderBrush}" 
         BorderThickness="{TemplateBinding BorderThickness}" 
         CornerRadius="3"> 
        <DockPanel> 
         <ToggleButton 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}" 
             FocusVisualStyle="{StaticResource ExpanderHeaderFocusVisual}" 
             Margin="1" 
             MinHeight="0" 
             MinWidth="0" 
             x:Name="HeaderSite" 
             Style="{StaticResource ExpanderDownHeaderStyle}" 
             Content="{TemplateBinding Header}" 
             ContentTemplate="{TemplateBinding HeaderTemplate}" 
             ContentTemplateSelector="{TemplateBinding HeaderTemplateSelector}" 
             DockPanel.Dock="Top" 
             IsChecked="{Binding Path=IsExpanded, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" /> 
         <ContentPresenter Focusable="false" 
              Visibility="Collapsed" 
              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
              Margin="{TemplateBinding Padding}" 
              x:Name="ExpandSite" 
              VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
              DockPanel.Dock="Bottom" /> 
        </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> 

此外,我們還可以創建一個AttachedProperty並設置箭頭和圓圈部分而不是崩潰。

這裏是我們的AttachedProperty:

public class AttachedProperties 
{ 
    #region HideExpanderArrow AttachedProperty 

    [AttachedPropertyBrowsableForType(typeof(Expander))] 
    public static bool GetHideExpanderArrow(DependencyObject obj) 
    { 
     return (bool)obj.GetValue(HideExpanderArrowProperty); 
    } 

    [AttachedPropertyBrowsableForType(typeof(Expander))] 
    public static void SetHideExpanderArrow(DependencyObject obj, bool value) 
    { 
     obj.SetValue(HideExpanderArrowProperty, value); 
    } 

    // Using a DependencyProperty as the backing store for HideExpanderArrow. This enables animation, styling, binding, etc... 
    public static readonly DependencyProperty HideExpanderArrowProperty = 
     DependencyProperty.RegisterAttached("HideExpanderArrow", typeof(bool), typeof(AttachedProperties), new UIPropertyMetadata(false, OnHideExpanderArrowChanged)); 

    private static void OnHideExpanderArrowChanged(DependencyObject o, DependencyPropertyChangedEventArgs e) 
    { 
     Expander expander = (Expander)o; 

     if (expander.IsLoaded) 
     { 
      UpdateExpanderArrow(expander, (bool)e.NewValue); 
     } 
     else 
     { 
      expander.Loaded += new RoutedEventHandler((x, y) => UpdateExpanderArrow(expander, (bool)e.NewValue)); 
     } 
    } 

    private static void UpdateExpanderArrow(Expander expander, bool visible) 
    { 
     Grid headerGrid = 
      VisualTreeHelper.GetChild(
       VisualTreeHelper.GetChild(
         VisualTreeHelper.GetChild(
          VisualTreeHelper.GetChild(
           VisualTreeHelper.GetChild(
            expander, 
            0), 
           0), 
          0), 
         0), 
        0) as Grid; 

     headerGrid.Children[0].Visibility = visible ? Visibility.Collapsed : Visibility.Visible; // Hide or show the Ellipse 
     headerGrid.Children[1].Visibility = visible ? Visibility.Collapsed : Visibility.Visible; // Hide or show the Arrow 
     headerGrid.Children[2].SetValue(Grid.ColumnProperty, visible ? 0 : 1); // If the Arrow is not visible, then shift the Header Content to the first column. 
     headerGrid.Children[2].SetValue(Grid.ColumnSpanProperty, visible ? 2 : 1); // If the Arrow is not visible, then set the Header Content to span both rows. 
     headerGrid.Children[2].SetValue(ContentPresenter.MarginProperty, visible ? new Thickness(0) : new Thickness(4,0,0,0)); // If the Arrow is not visible, then remove the margin from the Content. 
    } 

    #endregion 
} 

我只是直接前往包含「箭頭」和標題內容的網格,而不是試圖找到名字的控制,所以這是不行的完全如果您也將擴展器重新模板化爲不同的結構。找到包含網格後,我們可以將箭頭和圓圈設置爲摺疊狀態,並確保將標題內容一直移動到左側。

要使用附加屬性,我們可以設置它的元素在XAML:

<StackPanel> 
    <Expander x:Name="uiExpander" 
       local:AttachedProperties.HideExpanderArrow="True"> 
     <Expander.Header> 
      <Border> 
       <DockPanel Width="Auto"> 
        <TextBlock DockPanel.Dock="Left" 
           FontSize="16" 
           Text="IronRuby in Action!" /> 
       </DockPanel> 
      </Border> 
     </Expander.Header> 
     <Expander.Content> 
      <TextBlock Text="This is the decriprion!" /> 
     </Expander.Content> 
    </Expander> 

    <Button Content="Click to Show/Hide Expander Arrow" 
      Click="Button_Click" /> 

</StackPanel> 

而在代碼:

void Button_Click(object sender, RoutedEventArgs e) 
{ 
    uiExpander.SetValue(
     AttachedProperties.HideExpanderArrowProperty, 
     !(bool)uiExpander.GetValue(AttachedProperties.HideExpanderArrowProperty)); 
} 
+0

真棒回覆的人!還要感謝我不瞭解鼴鼠的鼴鼠工具! – azamsharp 2009-07-02 02:46:09