2017-03-17 67 views
2

我想創建一個包含TreeViewItems的WPF TreeView,它可以伸展以填充可用空間。我修改了TreeViewItem模板,並將其作爲指導:https://social.msdn.microsoft.com/Forums/vstudio/en-US/cabcb3ba-80c0-4367-85b7-9b55adc81e65/stretch-treeview-items?forum=wpf,這很有效,因爲我希望右側的一個字符網格組件可以右對齊,並且長TextBlock佔用可用空間 - 請參閱下面的代碼,我的一個TreeViewItems頭是一個網格。TreeViewItem With Stretch

但是,當我通過向左側拖動右側來調整窗口的大小時,當沒有足夠的空間用於所有網格組件時,我期待着長的TextBlock的內容爲「長,長,...「開始縮小寬度,而右側的TextBlocks被右側窗口邊緣切斷。

如果我創建一個以網格爲特徵的全新示例,並將上述網格放置在其中一個網格單元格內(實質上模擬TreeView模板中使用的網格),然後按照我的預期調整大小:TextBlock縮小我調整大小時的寬度。

任何想法可以對我指定的TreeViewItem模板或標題進行哪些更改以獲取我想要的調整大小行爲?

<Window x:Class="TreeViewSimple3.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:local="clr-namespace:TreeViewSimple3" 
    mc:Ignorable="d" 
    Title="MainWindow" Height="350" Width="525"> 

<Window.Resources> 
    <ControlTemplate x:Key="TreeViewItemStretchControlTemplate" 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" ClickMode="Press" IsChecked="{Binding IsExpanded, RelativeSource={RelativeSource TemplatedParent}}"> 
       <ToggleButton.Style> 
        <Style TargetType="{x:Type ToggleButton}"> 
         <Setter Property="Focusable" Value="False"/> 
         <Setter Property="Width" Value="16"/> 
         <Setter Property="Height" Value="16"/> 
         <Setter Property="Template"> 
          <Setter.Value> 
           <ControlTemplate TargetType="{x:Type ToggleButton}"> 
            <Border Background="Transparent" Height="16" Padding="5" Width="16"> 
             <Path x:Name="ExpandPath" Data="M0,0 L0,6 L6,0 z" Fill="Transparent" Stroke="#FF989898"> 
              <Path.RenderTransform> 
               <RotateTransform Angle="135" CenterY="3" CenterX="3"/> 
              </Path.RenderTransform> 
             </Path> 
            </Border> 
            <ControlTemplate.Triggers> 
             <Trigger Property="IsChecked" Value="True"> 
              <Setter Property="RenderTransform" TargetName="ExpandPath"> 
               <Setter.Value> 
                <RotateTransform Angle="180" CenterY="3" CenterX="3"/> 
               </Setter.Value> 
              </Setter> 
              <Setter Property="Fill" TargetName="ExpandPath" Value="#FF595959"/> 
              <Setter Property="Stroke" TargetName="ExpandPath" Value="#FF262626"/> 
             </Trigger> 
             <Trigger Property="IsMouseOver" Value="True"> 
              <Setter Property="Stroke" TargetName="ExpandPath" Value="#FF1BBBFA"/> 
              <Setter Property="Fill" TargetName="ExpandPath" Value="Transparent"/> 
             </Trigger> 
             <MultiTrigger> 
              <MultiTrigger.Conditions> 
               <Condition Property="IsMouseOver" Value="True"/> 
               <Condition Property="IsChecked" Value="True"/> 
              </MultiTrigger.Conditions> 
              <Setter Property="Stroke" TargetName="ExpandPath" Value="#FF262626"/> 
              <Setter Property="Fill" TargetName="ExpandPath" Value="#FF595959"/> 
             </MultiTrigger> 
            </ControlTemplate.Triggers> 
           </ControlTemplate> 
          </Setter.Value> 
         </Setter> 
        </Style> 
       </ToggleButton.Style> 
      </ToggleButton> 
      <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Grid.Column="1" Grid.ColumnSpan="2" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="True"> 
       <ContentPresenter x:Name="PART_Header" ContentSource="Header" 
       HorizontalAlignment="{TemplateBinding Control.HorizontalContentAlignment}" 
       SnapsToDevicePixels="{TemplateBinding UIElement.SnapsToDevicePixels}"/> 

      </Border> 
      <ItemsPresenter x:Name="ItemsHost" Grid.ColumnSpan="2" Grid.Column="1" Grid.Row="1"/> 
     </Grid> 
     <ControlTemplate.Triggers> 
      <Trigger Property="TreeViewItem.IsExpanded" Value="false"> 
       <Setter TargetName="ItemsHost" Property="UIElement.Visibility" Value="Collapsed"/> 
      </Trigger> 
      <Trigger Property="ItemsControl.HasItems" Value="false"> 
       <Setter TargetName="Expander" Property="UIElement.Visibility" Value="Hidden"/> 
      </Trigger> 
      <Trigger Property="TreeViewItem.IsSelected" Value="true"> 
       <Setter TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}" 
        Property="Border.Background"/> 
       <Setter Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}" 
        Property="Control.Foreground"/> 
      </Trigger> 
      <MultiTrigger> 
       <MultiTrigger.Conditions> 
        <Condition Property="TreeViewItem.IsSelected" Value="true"/> 
        <Condition Property="TreeViewItem.IsSelectionActive" Value="false"/> 
       </MultiTrigger.Conditions> 
       <Setter TargetName="Bd" 
        Value="{DynamicResource {x:Static SystemColors.InactiveSelectionHighlightBrushKey}}" 
        Property="Border.Background"/> 
       <Setter Value="{DynamicResource {x:Static SystemColors.InactiveSelectionHighlightTextBrushKey}}" 
        Property="Control.Foreground"/> 
      </MultiTrigger> 
      <Trigger Property="UIElement.IsEnabled" Value="false"> 
       <Setter Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" Property="Control.Foreground"/> 
      </Trigger> 
     </ControlTemplate.Triggers> 
    </ControlTemplate> 
</Window.Resources> 

<TreeView> 
    <TreeViewItem Header="Parent" Template="{StaticResource TreeViewItemStretchControlTemplate}" HorizontalContentAlignment="Stretch"> 
     <TreeViewItem Template="{StaticResource TreeViewItemStretchControlTemplate}" HorizontalContentAlignment="Stretch"> 
      <TreeViewItem.Header> 
       <Grid> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="*"/> 
         <ColumnDefinition Width="Auto"/> 
        </Grid.ColumnDefinitions> 
        <TextBlock Grid.Column="0" Text="A long, long, long, long, long, long, long label."/> 
        <StackPanel Grid.Column="1" Orientation="Horizontal"> 
         <TextBlock Text="A"/> 
         <TextBlock Text="B"/> 
         <TextBlock Text="C"/> 
         <TextBlock Text="D"/> 
        </StackPanel> 
       </Grid> 
      </TreeViewItem.Header> 
     </TreeViewItem> 
    </TreeViewItem> 
</TreeView> 

+0

當我嘗試代碼示例,並減少窗口大小TreeView顯示水平滾動條。因此,我添加了以下屬性:''禁用滾動和''啓用自動換行。它是你瞄準的效果嗎? – ASh

+0

完美 - 正是我的目標。謝謝。 – randusr836

回答

3

當我嘗試代碼示例,減少窗口大小,TreeView控件顯示水平滾動條(因爲它不僅電網也ScrollViewer中在其模板)

嘗試以下設置:

<TreeView ScrollViewer.HorizontalScrollBarVisibility="Disabled"> 

禁用滾動

<TextBlock TextWrapping="Wrap" Grid.Column="0" ...> 

啓用自動換行。