none
WPF的DataGrid列头和行头相交的单元格怎么修改样式和填充文字 RRS feed

  • 问题

  • 在使用WPF的DataGrid时候,我将行号直接添加到了行的头部,但是在行头和列头相交的部分样式无法修改。请问怎么修改,类似Excel左上角那个行头和列头相交的地方!
    2012年5月22日 4:30

答案

  • 从可视树种能看出,那个区域只有一个Button 是用来做全选的,所以我们只有通过修改DataGrid的默认模板来实现你的效果:

    首先看下DataGrid的默认模板:

        <ControlTemplate TargetType="DataGrid">
          <Border Background="{TemplateBinding Control.Background}" BorderBrush="{TemplateBinding Control.BorderBrush}" BorderThickness="{TemplateBinding Control.BorderThickness}" Padding="{TemplateBinding Control.Padding}" SnapsToDevicePixels="True">
            <ScrollViewer Focusable="False" Name="DG_ScrollViewer">
              <ScrollViewer.Template>
                <ControlTemplate TargetType="ScrollViewer">
                  <Grid>
                    <Grid.ColumnDefinitions>
                      <ColumnDefinition Width="Auto" />
                      <ColumnDefinition Width="*" />
                      <ColumnDefinition Width="Auto" />
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                      <RowDefinition Height="Auto" />
                      <RowDefinition Height="*" />
                      <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <Button Command="ApplicationCommands.SelectAll" Focusable="False" Style="{DynamicResource {ComponentResourceKey ResourceId=DataGridSelectAllButtonStyle, TypeInTargetAssembly=DataGrid}}" Width="{Binding Path=CellsPanelHorizontalOffset, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType=DataGrid}}">
                      <Button.Visibility>
                        <Binding Path="HeadersVisibility" RelativeSource="{RelativeSource FindAncestor, AncestorLevel=1, AncestorType=DataGrid}">
                          <Binding.ConverterParameter>
                            <DataGridHeadersVisibility>All</DataGridHeadersVisibility>
                          </Binding.ConverterParameter>
                        </Binding>
                      </Button.Visibility>
                    </Button>
                    <DataGridColumnHeadersPresenter Grid.Column="1" Name="PART_ColumnHeadersPresenter">
                      <DataGridColumnHeadersPresenter.Visibility>
                        <Binding Path="HeadersVisibility" RelativeSource="{RelativeSource FindAncestor, AncestorLevel=1, AncestorType=DataGrid}">
                          <Binding.ConverterParameter>
                            <DataGridHeadersVisibility>Column</DataGridHeadersVisibility>
                          </Binding.ConverterParameter>
                        </Binding>
                      </DataGridColumnHeadersPresenter.Visibility>
                    </DataGridColumnHeadersPresenter>
                    <ScrollContentPresenter CanContentScroll="{TemplateBinding ScrollViewer.CanContentScroll}" CanHorizontallyScroll="False" CanVerticallyScroll="False" Content="{TemplateBinding ContentControl.Content}" ContentStringFormat="{TemplateBinding ContentControl.ContentStringFormat}" ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}" Grid.ColumnSpan="2" Grid.Row="1" Name="PART_ScrollContentPresenter" />
                    <ScrollBar Grid.Column="2" Grid.Row="1" Maximum="{TemplateBinding ScrollViewer.ScrollableHeight}" Name="PART_VerticalScrollBar" Orientation="Vertical" Value="{Binding Path=VerticalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}" ViewportSize="{TemplateBinding ScrollViewer.ViewportHeight}" Visibility="{TemplateBinding ScrollViewer.ComputedVerticalScrollBarVisibility}" />
                    <Grid Grid.Column="1" Grid.Row="2">
                      <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="{Binding Path=NonFrozenColumnsViewportHorizontalOffset, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType=DataGrid}}" />
                        <ColumnDefinition Width="*" />
                      </Grid.ColumnDefinitions>
                      <ScrollBar Grid.Column="1" Maximum="{TemplateBinding ScrollViewer.ScrollableWidth}" Name="PART_HorizontalScrollBar" Orientation="Horizontal" Value="{Binding Path=HorizontalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}" ViewportSize="{TemplateBinding ScrollViewer.ViewportWidth}" Visibility="{TemplateBinding ScrollViewer.ComputedHorizontalScrollBarVisibility}" />
                    </Grid>
                  </Grid>
                </ControlTemplate>
              </ScrollViewer.Template>
              <ItemsPresenter SnapsToDevicePixels="{TemplateBinding UIElement.SnapsToDevicePixels}" />
            </ScrollViewer>
          </Border>
        </ControlTemplate>

    分三行三列,其中第一行第一列就是你要修改的部分,你可以放一个Border在里面,然后放置一个布局和他原先的按钮以及你要放的文字等,如下:

    <ControlTemplate x:Key="Template1" TargetType="DataGrid">
      <Border Background="{TemplateBinding Control.Background}" BorderBrush="{TemplateBinding Control.BorderBrush}" BorderThickness="{TemplateBinding Control.BorderThickness}" Padding="{TemplateBinding Control.Padding}" SnapsToDevicePixels="True">
        <ScrollViewer Focusable="False" Name="DG_ScrollViewer">
          <ScrollViewer.Template>
            <ControlTemplate TargetType="ScrollViewer">
              <Grid>
                <Grid.ColumnDefinitions>
                  <ColumnDefinition Width="Auto" />
                  <ColumnDefinition Width="*" />
                  <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                  <RowDefinition Height="Auto" />
                  <RowDefinition Height="*" />
                  <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <Border  Width="{Binding Path=CellsPanelHorizontalOffset, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType=DataGrid}}">
                  <Grid>
                    <Button Command="ApplicationCommands.SelectAll" Focusable="False" Style="{DynamicResource {ComponentResourceKey ResourceId=DataGridSelectAllButtonStyle, TypeInTargetAssembly=DataGrid}}">
                      <Button.Visibility>
                        <Binding Path="HeadersVisibility" RelativeSource="{RelativeSource FindAncestor, AncestorLevel=1, AncestorType=DataGrid}">
                          <Binding.ConverterParameter>
                            <DataGridHeadersVisibility>All</DataGridHeadersVisibility>
                          </Binding.ConverterParameter>
                        </Binding>
                      </Button.Visibility>
                    </Button>
                    <TextBlock Text="Hello" IsHitTestVisible="False"/>
                  </Grid>
                </Border>
                <DataGridColumnHeadersPresenter Grid.Column="1" Name="PART_ColumnHeadersPresenter">
            ......

    当然,这样后你会发现这个区域本身很小导致文字显示不全。你可以通过修改DataGridRowHeader的宽度来改善:

        <Style TargetType="DataGridRowHeader">
          <Setter Property="Width" Value="30"/>
        </Style>

    效果如下:


    Bob Bao [MSFT]
    MSDN Community Support | Feedback to us

    2012年5月24日 7:39
    版主