2017-10-13 183 views
-4

我试图让自己的图形样式的ListView,但我不明白的源代码。任何人都可以向我解释下面代码的各个部分吗?WPF自定义ListView控件模板

<!-- =========================================================== ListView ============================================================ --> 
<Style x:Key="{x:Static GridView.GridViewScrollViewerStyleKey}" TargetType="ScrollViewer"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="ScrollViewer"> 
       <Grid Background="{TemplateBinding Background}"> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="*"/> 
         <ColumnDefinition Width="Auto"/> 
        </Grid.ColumnDefinitions> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="*"/> 
         <RowDefinition Height="Auto"/> 
        </Grid.RowDefinitions> 

        <DockPanel Margin="{TemplateBinding Padding}"> 
         <ScrollViewer DockPanel.Dock="Top" 
             HorizontalScrollBarVisibility="Hidden" 
             VerticalScrollBarVisibility="Hidden" 
             Focusable="false"> 
          <GridViewHeaderRowPresenter Margin="2,0,2,0" 
                 Columns="{Binding Path=TemplatedParent.View.Columns, RelativeSource={RelativeSource TemplatedParent}}" 
                 ColumnHeaderContainerStyle="{Binding Path=TemplatedParent.View.ColumnHeaderContainerStyle, RelativeSource={RelativeSource TemplatedParent}}" 
                 ColumnHeaderTemplate="{Binding Path=TemplatedParent.View.ColumnHeaderTemplate, RelativeSource={RelativeSource TemplatedParent}}" 
                 ColumnHeaderTemplateSelector="{Binding Path=TemplatedParent.View.ColumnHeaderTemplateSelector, RelativeSource={RelativeSource TemplatedParent}}" 
                 AllowsColumnReorder="{Binding Path=TemplatedParent.View.AllowsColumnReorder, RelativeSource={RelativeSource TemplatedParent}}" 
                 ColumnHeaderContextMenu="{Binding Path=TemplatedParent.View.ColumnHeaderContextMenu, RelativeSource={RelativeSource TemplatedParent}}" 
                 ColumnHeaderToolTip="{Binding Path=TemplatedParent.View.ColumnHeaderToolTip, RelativeSource={RelativeSource TemplatedParent}}" 
                 SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
         </ScrollViewer> 

         <ScrollContentPresenter Name="PART_ScrollContentPresenter" 
               KeyboardNavigation.DirectionalNavigation="Local" 
               CanContentScroll="True" CanHorizontallyScroll="False" 
               CanVerticallyScroll="False"/> 
        </DockPanel> 

        <ScrollBar Name="PART_HorizontalScrollBar" 
           Orientation="Horizontal" 
           Grid.Row="1" 
           Maximum="{TemplateBinding ScrollableWidth}" 
           ViewportSize="{TemplateBinding ViewportWidth}" 
           Value="{TemplateBinding HorizontalOffset}" 
           Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"/> 

        <ScrollBar Name="PART_VerticalScrollBar" 
           Grid.Column="1" 
           Maximum="{TemplateBinding ScrollableHeight}" 
           ViewportSize="{TemplateBinding ViewportHeight}" 
           Value="{TemplateBinding VerticalOffset}" 
           Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"/> 

       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

<Style x:Key="GridViewColumnHeaderGripper" TargetType="Thumb"> 
    <Setter Property="Width" Value="18"/> 
    <Setter Property="Background" Value="{DynamicResource NormalBorderBrush}"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type Thumb}"> 
       <Border Padding="{TemplateBinding Padding}" 
         Background="Transparent"> 
        <Rectangle HorizontalAlignment="Center" 
           Width="1" 
           Fill="{TemplateBinding Background}"/> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

<Style x:Key="{x:Type GridViewColumnHeader}" TargetType="GridViewColumnHeader"> 
    <Setter Property="HorizontalContentAlignment" Value="Center"/> 
    <Setter Property="VerticalContentAlignment" Value="Center"/> 
    <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="GridViewColumnHeader"> 
       <Grid> 
        <Border Name="HeaderBorder" 
          BorderThickness="0,1,0,1" 
          BorderBrush="{DynamicResource NormalBorderBrush}" 
          Background="{DynamicResource LightBrush}" 
          Padding="2,0,2,0"> 
         <ContentPresenter Name="HeaderContent" 
              Margin="0,0,0,1" 
              VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
              RecognizesAccessKey="True" 
              SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
        </Border> 
        <Thumb x:Name="PART_HeaderGripper" 
          HorizontalAlignment="Right" 
          Margin="0,0,-9,0" 
          Style="{StaticResource GridViewColumnHeaderGripper}"/> 
       </Grid> 
       <ControlTemplate.Triggers> 
        <Trigger Property="IsMouseOver" Value="true"> 
         <Setter TargetName="HeaderBorder" Property="Background" Value="{DynamicResource NormalBrush}"/> 
        </Trigger> 
        <Trigger Property="IsPressed" Value="true"> 
         <Setter TargetName="HeaderBorder" Property="Background" Value="{DynamicResource PressedBrush}"/> 
         <Setter TargetName="HeaderContent" Property="Margin" Value="1,1,0,0"/> 
        </Trigger> 
        <Trigger Property="IsEnabled" Value="false"> 
         <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
    <Style.Triggers> 
     <Trigger Property="Role" Value="Floating"> 
      <Setter Property="Opacity" Value="0.7"/> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="GridViewColumnHeader"> 
         <Canvas Name="PART_FloatingHeaderCanvas"> 
          <Rectangle Fill="#60000000" 
             Width="{TemplateBinding ActualWidth}" 
             Height="{TemplateBinding ActualHeight}"/> 
         </Canvas> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Trigger> 
     <Trigger Property="Role" Value="Padding"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="GridViewColumnHeader"> 
         <Border Name="HeaderBorder" 
           BorderThickness="0,1,0,1" 
           BorderBrush="{DynamicResource NormalBorderBrush}" 
           Background="{DynamicResource LightBrush}"/> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Trigger> 
    </Style.Triggers> 
</Style> 

<Style TargetType="{x:Type local:VsListView}"> 
    <Setter Property="SnapsToDevicePixels" Value="true"/> 
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/> 
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/> 
    <Setter Property="ScrollViewer.CanContentScroll" Value="true"/> 
    <Setter Property="VerticalContentAlignment" Value="Center"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type local:VsListView}"> 
       <Border Name="Border" 
         BorderThickness="1" 
         CornerRadius="{DynamicResource MainCornerRadius}" 
         BorderBrush="{DynamicResource SolidBorderBrush}" 
         Background="Red"> 
        <ScrollViewer Style="{DynamicResource {x:Static GridView.GridViewScrollViewerStyleKey}}"> 
         <ItemsPresenter /> 
        </ScrollViewer> 
       </Border> 
       <ControlTemplate.Triggers> 
        <Trigger Property="IsGrouping" Value="true"> 
         <Setter Property="ScrollViewer.CanContentScroll" Value="false"/> 
        </Trigger> 
        <Trigger Property="IsEnabled" Value="false"> 
         <Setter TargetName="Border" Property="Background" Value="{DynamicResource DisabledBorderBrush}"/> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

如何更改标题部分的视觉风格?哪部分代码处理这个问题? 我附上了截图。我insterested的白色矩形:

enter image description here

+0

'GridViewHeaderRowPresenter' - 你甚至读过这段代码吗? –

+0

当然,我读了这段代码,但是我所做的任何更改都没有反映出来。即使我删除了这部分代码。白色的矩形仍然在那里。 –

+0

好吧,可能是因为它是'ScrollViewer'的样式,而不是'ListView' ...再一次,你甚至读过这些代码吗?它就在那里,在第一行'TargetType =“ScrollViewer”' –

回答

0

我建议你使用混合得到的默认样式和ContentTemplate,然后只需将其编辑成自己需要的(记住,使用的控件名称作为模板可能对给定控件背后的逻辑具有至关重要的意义,所以要小心你正在编辑的内容)。

如果你不知道如何使用Blend来获得你的控件的模板,这里有一个简单的教程documentation of Telerik controls(不用担心,它对所有的控件都是一样的)。您只需创建一个ListView.ContentTemplate的副本,将其粘贴到您的应用程序中,并且您可以很好地进行(编辑)。

+0

谢谢,我试试这个。 –

+0

只是一个提示:在对象和时间线面板上创建控件模板时,可能会显示一个新的层次结构。它只是深入到控件的可视化树中。检查新列表的每个位置是否可以从中生成新模板。通常情况下,控件是由具有自己样式的控件构建的。 –