删除标题后面的渐变样式

时间:2013-06-06 13:12:28

标签: wpf xaml

此刻我有以下屏幕,我想删除标题后面的双色背景,红色箭头指向它所在的位置,绿色突出显示它所覆盖的区域。

enter image description here

在正常情况下你不会看到它,但是因为我在第5列中有文本框拉伸它出现的列标题。

我想删除它,使其透明,但我不知道DataGrid上的组件或如何访问它。有人能帮助我吗?

以下网页有一个精美的组件图http://blog.smoura.com/wpf-toolkit-datagrid-part-ii-custom-styling/它显示了与DataGridColumnHeadersPresenter定义的相同类型的区域,我不确定这是否应该是我应该瞄准的那个。我没有太多运气就给了它一个机会。 enter image description here

这是我的完整XAML

<UserControl x:Class="Users.View.AllUsersView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:scm="clr-namespace:System.ComponentModel;assembly=WindowsBase" 
             mc:Ignorable="d" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:helpers="clr-namespace:Users.ViewModel.Helpers"
             d:DesignHeight="160" d:DesignWidth="1100">

    <UserControl.Resources>
        <CollectionViewSource x:Key="UserCollection" Source="{Binding Path=AllUsers}">
            <CollectionViewSource.SortDescriptions>
                <scm:SortDescription PropertyName="Name" Direction="Ascending" />
            </CollectionViewSource.SortDescriptions>
        </CollectionViewSource>

        <Style x:Key="UserItemStyle" TargetType="{x:Type DataGridRow}">
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
            <Setter Property="IsSelected" Value="{Binding Path=IsSelected, Mode=TwoWay}" />
            <Style.Triggers>
                <MultiTrigger>
                    <MultiTrigger.Conditions>
                        <Condition Property="ItemsControl.AlternationIndex" Value="1" />
                        <Condition Property="IsSelected" Value="False" />
                        <Condition Property="IsMouseOver" Value="False" />
                    </MultiTrigger.Conditions>
                    <Setter Property="Background" Value="#EEEEEEEE" />
                </MultiTrigger>
            </Style.Triggers>
        </Style>

        <DataTemplate x:Key="headerTemplate">
            <TextBlock Padding="0,0,0,0" Margin="0,0,0,0" HorizontalAlignment="Center" VerticalAlignment="Bottom" Text="{Binding}"/>
        </DataTemplate>

        <Style x:Key="RowHeaderStyle2" TargetType="DataGridRowsPresenter">
            <Setter Property="Background" Value="{x:Null}"/>
        </Style>
        <Style x:Key="ColumnHeaderStyle" TargetType="DataGridColumnHeader">
            <Setter Property="VerticalContentAlignment" Value="Bottom"/>
            <Setter Property="VerticalAlignment" Value="Bottom"/>
            <Setter Property="Height" Value="25"/>
        </Style>
        <Style x:Key="ModuleColumnHeaderStyle" TargetType="GridViewColumnHeader">
            <Setter Property="VerticalContentAlignment" Value="Bottom"/>
            <Setter Property="Width" Value="550"/>
        </Style>

        <helpers:FirstItemConverter x:Key="firstItemConvertion"/>

        <Style x:Key="ListViewItemRotatedText" TargetType="TextBlock">
            <Setter Property="LayoutTransform">
                <Setter.Value>
                    <RotateTransform Angle="-45" />
                </Setter.Value>
            </Setter>
            <Setter Property="Width" Value="130"/>
            <Setter Property="Padding" Value="0,0,0,0"/>
            <Style.Triggers>
                <DataTrigger Binding="{Binding ModuleName, Converter={StaticResource firstItemConvertion}, ConverterParameter=0}" Value="true">
                        <Setter Property="Margin" Value="-60,0,0,0" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </UserControl.Resources>

    <DockPanel>
        <Grid DockPanel.Dock="Bottom" Margin="0,2,4,2">
            <StackPanel HorizontalAlignment="Right" Orientation="Horizontal" VerticalAlignment="Center">
                <TextBlock Text="Selected Users: " />
                <ContentPresenter Content="{Binding Path=TotalSelectedUsers}" ContentStringFormat="0" />
                <TextBlock Text=" of " />
                <ContentPresenter Content="{Binding Path=TotalUsers}" ContentStringFormat="0" />
            </StackPanel>
        </Grid>
        <DataGrid AutoGenerateColumns="False" ItemContainerStyle="{StaticResource UserItemStyle}" AlternatingRowBackground="{x:Null}" DataContext="{StaticResource UserCollection}" ItemsSource="{Binding}">
            <DataGrid.Columns>
                <DataGridTextColumn Header="Name" IsReadOnly="True" HeaderStyle="{StaticResource ColumnHeaderStyle}" HeaderTemplate="{StaticResource headerTemplate}" Binding="{Binding Path=Name}"/>
                <DataGridTextColumn Header="Job Title" IsReadOnly="True" HeaderStyle="{StaticResource ColumnHeaderStyle}" HeaderTemplate="{StaticResource headerTemplate}" Binding="{Binding Path=Job_Title}"/>
                <DataGridTextColumn Header="Department" IsReadOnly="True" HeaderStyle="{StaticResource ColumnHeaderStyle}" HeaderTemplate="{StaticResource headerTemplate}" Binding="{Binding Path=Department}"/>
                <DataGridTextColumn Header="Company" IsReadOnly="True" HeaderStyle="{StaticResource ColumnHeaderStyle}" HeaderTemplate="{StaticResource headerTemplate}" Binding="{Binding Path=Company}"/>
                <DataGridTextColumn IsReadOnly="True" Binding="{Binding Path=Company}" CanUserResize="False" Width="580">
                    <DataGridTextColumn.Header>
                        <StackPanel Orientation="Vertical" HorizontalAlignment="Center">
                            <TextBlock HorizontalAlignment="Center">Modules</TextBlock>
                            <ListBox x:Name="lstModules" ItemsSource="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}, Path=DataContext.Modules}">
                                <ListBox.ItemsPanel>
                                    <ItemsPanelTemplate>
                                        <StackPanel Orientation="Horizontal" CanVerticallyScroll="False" CanHorizontallyScroll="False"></StackPanel>
                                    </ItemsPanelTemplate>
                                </ListBox.ItemsPanel>
                                <ListBox.ItemTemplate>
                                    <DataTemplate>
                                        <TextBlock Style="{StaticResource ListViewItemRotatedText}" Text="{Binding ModuleName}"></TextBlock>
                                    </DataTemplate>
                                </ListBox.ItemTemplate>
                            </ListBox>
                        </StackPanel>
                    </DataGridTextColumn.Header>
                </DataGridTextColumn>
                <DataGridTextColumn Header="Contact Detail" IsReadOnly="True" HeaderStyle="{StaticResource ColumnHeaderStyle}" HeaderTemplate="{StaticResource headerTemplate}" Binding="{Binding Path=Name}"/>
            </DataGrid.Columns>
        </DataGrid>
    </DockPanel>
</UserControl>

[编辑] 在DataGridColumnHeader的

上放置背景颜色后
<Style x:Key="ColumnHeaderStyle" TargetType="DataGridColumnHeader">
    <Setter Property="VerticalContentAlignment" Value="Bottom"/>
    <Setter Property="VerticalAlignment" Value="Bottom"/>
    <Setter Property="Height" Value="25"/>
    <Setter Property="Background" Value="Tomato"/>
</Style>
<Style x:Key="ModuleColumnHeaderStyle" TargetType="DataGridColumnHeader">
    <Setter Property="Background" Value="Tomato"/>
</Style>

这就是它的样子:你可以看到白色/灰色的双色调仍然存在。 enter image description here

[EDIT2] 要在第五列中添加相同的内容

<Style x:Key="ListViewItemRotatedText1" TargetType="TextBlock">
    <Setter Property="LayoutTransform">
        <Setter.Value>
            <RotateTransform Angle="-45" />
        </Setter.Value>
    </Setter>
    <Setter Property="Width" Value="130"/>
    <Setter Property="Margin" Value="0,0,0,0" />
</Style>
<Style x:Key="ListViewItemRotatedText2" TargetType="TextBlock">
    <Setter Property="LayoutTransform">
        <Setter.Value>
            <RotateTransform Angle="-45" />
        </Setter.Value>
    </Setter>
    <Setter Property="Width" Value="130"/>
    <Setter Property="Margin" Value="-60,0,0,0" />
</Style>

用以下StackPanel替换......

<StackPanel Orientation="Horizontal">
    <TextBlock Style="{StaticResource ListViewItemRotatedText1}" >Customer Services</TextBlock>
    <TextBlock Style="{StaticResource ListViewItemRotatedText2}" >Asset Management</TextBlock>
    <TextBlock Style="{StaticResource ListViewItemRotatedText2}" >Works Management</TextBlock>
    <TextBlock Style="{StaticResource ListViewItemRotatedText2}" >Project Management</TextBlock>
    <TextBlock Style="{StaticResource ListViewItemRotatedText2}" >Rates Management</TextBlock>
    <TextBlock Style="{StaticResource ListViewItemRotatedText2}" >Finance</TextBlock>
    <TextBlock Style="{StaticResource ListViewItemRotatedText2}" >Human Resources</TextBlock>
    <TextBlock Style="{StaticResource ListViewItemRotatedText2}" >Document Management</TextBlock>
    <TextBlock Style="{StaticResource ListViewItemRotatedText2}" >User Management</TextBlock>
    <TextBlock Style="{StaticResource ListViewItemRotatedText2}" >Configuration</TextBlock>
</StackPanel>

[最后编辑] 在Viv的帮助下获得结果 enter image description here

1 个答案:

答案 0 :(得分:3)

<强>更新

<Style TargetType="DataGridColumnHeader">
  <Setter Property="Background"
          Value="Tomato" />
</Style>

^^没有指定x:Key我们试图让它到达虚拟标题(PART_FillerColumnHeader),它应该跨越所有列并提供Background

我们还需要让ColumnHeaderStyle继承这一点,以便我们最终拥有,

<Style TargetType="DataGridColumnHeader">
  <Setter Property="Background"
          Value="Tomato" />
</Style>
<Style x:Key="ColumnHeaderStyle"
        BasedOn="{StaticResource {x:Type DataGridColumnHeader}}"
        TargetType="DataGridColumnHeader">
  <Setter Property="VerticalContentAlignment"
          Value="Bottom" />
  <Setter Property="VerticalAlignment"
          Value="Bottom" />
  <Setter Property="Height"
          Value="25" />
</Style>