WPF: कस्टम + - TreeView

Question

वृक्ष दृश्य नियंत्रण (+ -) के अंतर्निहित पतन-विस्तारित आइकन को अपने स्वयं के आइकन में बदलना संभव है?

अग्रिम धन्यवाद!

Answer 1

आपको बहुत धन्यवाद, केंट!

<Style x:Key="styleTreeViewExpandCollapse" TargetType="{x:Type ToggleButton}"> 
    <Setter Property="OverridesDefaultStyle" Value="True"/> 
    <Setter Property="Template"> 
    <Setter.Value> 
     <ControlTemplate TargetType="{x:Type ToggleButton}"> 
     <Image x:Name="image" Source="images/img1.ico" /> 
     <ControlTemplate.Triggers> 
      <Trigger Property="IsChecked" Value="true"> 
      <Setter TargetName="image" Property="Source" Value="images/img2.ico" /> 
      </Trigger> 
     </ControlTemplate.Triggers> 
     </ControlTemplate> 
    </Setter.Value> 
    </Setter> 
</Style> 
<Style x:Key="styleTreeView" TargetType="{x:Type TreeViewItem}"> 
    <Setter Property="Template"> 
    <Setter.Value> 
     <ControlTemplate TargetType="{x:Type TreeViewItem}"> 
     <Grid> 
      <Grid.ColumnDefinitions> 
      <ColumnDefinition MinWidth="19" Width="Auto"/> 
      <ColumnDefinition Width="Auto"/> 
      <ColumnDefinition Width="*"/> 
      </Grid.ColumnDefinitions> 
      <Grid.RowDefinitions> 
      <RowDefinition Height="Auto"/> 
      <RowDefinition/> 
      </Grid.RowDefinitions> 
      <ToggleButton Grid.Column="0" x:Name="Expander" 
         Style="{StaticResource styleTreeViewExpandCollapse}" 
         IsChecked="{Binding Path=IsExpanded, 
          RelativeSource={RelativeSource TemplatedParent}}" 
         ClickMode="Press" 
         Width="16" Height="16"/> 
      <ContentPresenter Grid.Column="1" x:Name="PART_Header" 
          ContentSource="Header" 
          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"/> 
      <ItemsPresenter x:Name="ItemsHost" 
          Grid.Row="1" 
          Grid.Column="1" Grid.ColumnSpan="2"/> 
     </Grid> 
     <ControlTemplate.Triggers> 
      <Trigger Property="IsExpanded" Value="false"> 
      <Setter TargetName="ItemsHost" Property="Visibility" 
        Value="Collapsed"/> 
      </Trigger> 
      <Trigger Property="HasItems" Value="false"> 
      <Setter TargetName="Expander" Property="Visibility" 
        Value="Hidden"/> 
      </Trigger> 
      <MultiTrigger> 
      <MultiTrigger.Conditions> 
       <Condition Property="HasHeader" Value="false"/> 
       <Condition Property="Width" Value="Auto"/> 
      </MultiTrigger.Conditions> 
      <Setter TargetName="PART_Header" Property="MinWidth" Value="75"/> 
      </MultiTrigger> 
      <MultiTrigger> 
      <MultiTrigger.Conditions> 
       <Condition Property="HasHeader" Value="false"/> 
       <Condition Property="Height" Value="Auto"/> 
      </MultiTrigger.Conditions> 
      <Setter TargetName="PART_Header" Property="MinHeight" Value="19"/> 
      </MultiTrigger> 
     </ControlTemplate.Triggers> 
     </ControlTemplate> 
    </Setter.Value> 
    </Setter> 
</Style> 

प्रतीक img1.ico और img2.ico एक तीर हैं: यहाँ मेरे मामले के लिए समाधान है।

Answer 2

दुर्भाग्यवश, आपको इसे प्राप्त करने के लिए TreeViewItem को फिर से दिखाना होगा। यह डिफ़ॉल्ट शैली आपको प्रारंभ करने में मदद कर सकती है। उन पथों पर ध्यान दें जिन्हें आपकी छवियों के लिए प्रतिस्थापित करने की आवश्यकता होगी।

<Style x:Key="TreeViewItemFocusVisual"> 
    <Setter Property="Control.Template"> 
    <Setter.Value> 
     <ControlTemplate> 
     <Rectangle/> 
     </ControlTemplate> 
    </Setter.Value> 
    </Setter> 
</Style> 
<Style x:Key="ExpandCollapseToggleStyle" TargetType="{x:Type ToggleButton}"> 
    <Setter Property="Focusable" Value="False"/> 
    <Setter Property="Width" Value="19"/> 
    <Setter Property="Height" Value="13"/> 
    <Setter Property="Template"> 
    <Setter.Value> 
     <ControlTemplate TargetType="{x:Type ToggleButton}"> 
     <Border Width="19" Height="13" Background="Transparent"> 
      <Border SnapsToDevicePixels="true" Width="9" Height="9" 
        BorderBrush="#FF7898B5" BorderThickness="1" CornerRadius="1"> 
      <Border.Background> 
       <LinearGradientBrush EndPoint="1,1" StartPoint="0,0"> 
       <GradientStop Color="White" Offset=".2"/> 
       <GradientStop Color="#FFC0B7A6" Offset="1"/> 
       </LinearGradientBrush> 
      </Border.Background> 
      <Path x:Name="ExpandPath" 
        Margin="1,1,1,1" 
        Fill="Black" 
        Data="M 0 2 L 0 3 L 2 3 L 2 5 L 3 5 L 3 3 L 5 3 L 5 2 L 3 2 L 3 0 L 2 0 L 2 2 Z"/> 
      </Border> 
     </Border> 
     <ControlTemplate.Triggers> 
      <Trigger Property="IsChecked" Value="True"> 
      <Setter Property="Data" TargetName="ExpandPath" 
        Value="M 0 2 L 0 3 L 5 3 L 5 2 Z"/> 
      </Trigger> 
     </ControlTemplate.Triggers> 
     </ControlTemplate> 
    </Setter.Value> 
    </Setter> 
</Style> 
<Style x:Key="TreeViewItemStyle1" TargetType="{x:Type TreeViewItem}"> 
    <Setter Property="Background" Value="Transparent"/> 
    <Setter Property="HorizontalContentAlignment" 
      Value="{Binding Path=HorizontalContentAlignment, 
       RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/> 
    <Setter Property="VerticalContentAlignment" 
      Value="{Binding Path=VerticalContentAlignment, 
       RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/> 
    <Setter Property="Padding" Value="1,0,0,0"/> 
    <Setter Property="Foreground" 
      Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
    <Setter Property="FocusVisualStyle" Value="{StaticResource TreeViewItemFocusVisual}"/> 
    <Setter Property="Template"> 
    <Setter.Value> 
     <ControlTemplate TargetType="{x:Type TreeViewItem}"> 
     <Grid> 
      <Grid.ColumnDefinitions> 
      <ColumnDefinition MinWidth="19" Width="Auto"/> 
      <ColumnDefinition Width="Auto"/> 
      <ColumnDefinition Width="*"/> 
      </Grid.ColumnDefinitions> 
      <Grid.RowDefinitions> 
      <RowDefinition Height="Auto"/> 
      <RowDefinition/> 
      </Grid.RowDefinitions> 
      <ToggleButton x:Name="Expander" 
         Style="{StaticResource ExpandCollapseToggleStyle}" 
         ClickMode="Press" 
         IsChecked="{Binding Path=IsExpanded, 
          RelativeSource={RelativeSource TemplatedParent}}"/> 
      <Border Grid.Column="1" x:Name="Bd" 
        SnapsToDevicePixels="true" 
        Background="{TemplateBinding Background}" 
        BorderBrush="{TemplateBinding BorderBrush}" 
        BorderThickness="{TemplateBinding BorderThickness}" 
        Padding="{TemplateBinding Padding}"> 
      <ContentPresenter x:Name="PART_Header" 
           SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" 
           HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
           ContentSource="Header"/> 
      </Border> 
      <ItemsPresenter x:Name="ItemsHost" Grid.Column="1" Grid.ColumnSpan="2" Grid.Row="1"/> 
     </Grid> 
     <ControlTemplate.Triggers> 
      <Trigger Property="IsExpanded" Value="false"> 
      <Setter Property="Visibility" TargetName="ItemsHost" Value="Collapsed"/> 
      </Trigger> 
      <Trigger Property="HasItems" Value="false"> 
      <Setter Property="Visibility" TargetName="Expander" Value="Hidden"/> 
      </Trigger> 
      <Trigger Property="IsSelected" Value="true"> 
      <Setter Property="Background" TargetName="Bd" 
        Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/> 
      <Setter Property="Foreground" 
        Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/> 
      </Trigger> 
      <MultiTrigger> 
      <MultiTrigger.Conditions> 
       <Condition Property="IsSelected" Value="true"/> 
       <Condition Property="IsSelectionActive" Value="false"/> 
      </MultiTrigger.Conditions> 
      <Setter Property="Background" TargetName="Bd" 
        Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/> 
      <Setter Property="Foreground" 
        Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
      </MultiTrigger> 
      <Trigger Property="IsEnabled" Value="false"> 
      <Setter Property="Foreground" 
        Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/> 
      </Trigger> 
     </ControlTemplate.Triggers> 
     </ControlTemplate> 
    </Setter.Value> 
    </Setter> 
</Style>