如何在wpf DataGrid中更改选定的行背景图像

时间:2013-02-12 06:53:17

标签: c# wpf wpf-controls wpfdatagrid

我的DataGrid包含以下代码。

在更改原生行背景中有我自己的图像。那么我也可以在所选行上更改行背景图像。

 <DataGrid x:Name="dtstandardview" BorderThickness="0" Height="429"  Width="688" BorderBrush="Aqua" MouseLeftButtonDown="dtstandardview_MouseRightButtonUp_1"
                     GridLinesVisibility="None" MouseRightButtonUp="dtstandardview_MouseRightButtonUp_1" 
                     VerticalScrollBarVisibility="Visible" AutoGenerateColumns="False" IsReadOnly="True" 
                      CanUserDeleteRows="False"  AlternationCount="2" CanUserResizeRows="False" Sorting="dtstandardview_Sorting_1"
                     Background="#DCDCDC" HeadersVisibility="Column" CanUserResizeColumns="False"
                      RowHeight="27" SelectionUnit="FullRow" CanUserAddRows="False" MinRowHeight="27" LoadingRow="dtstandardview_LoadingRow" LoadingRowDetails="dtstandardview_LoadingRowDetails" Loaded="dtstandardview_Loaded" Initialized="dtstandardview_Initialized" CellEditEnding="dtstandardview_CellEditEnding" AutoGeneratingColumn="dtstandardview_AutoGeneratingColumn" UnloadingRow="dtstandardview_UnloadingRow" UnloadingRowDetails="dtstandardview_UnloadingRowDetails"    >

                <DataGrid.Resources>
                    <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="#FF0000"/>
                </DataGrid.Resources>

                <DataGrid.CellStyle>
                    <Style TargetType="{x:Type DataGridCell}">
                        <Setter Property="Background" Value="Transparent"/>
                        <Setter Property="FontSize" Value="12"/>
                        <Setter Property="FontFamily" Value="Arial"/>
                        <Setter Property="Foreground" Value="#404040"/>
                        <Setter Property="BorderBrush" Value="Transparent"/>
                        <Setter Property="BorderThickness" Value="0"/>


                        <Setter Property="Effect">
                            <Setter.Value>
                                <DropShadowEffect BlurRadius="0" Color="#FF000000" Direction="-60" Opacity="0.32" ShadowDepth="1"/>
                            </Setter.Value>
                        </Setter>
                        <Setter Property="Margin" Value="10,5" />
                        <Setter Property="VerticalContentAlignment" Value="Bottom"/>
                        <Style.Triggers>
                            <Trigger Property="IsSelected"  Value="True">
                                <Setter Property="Background" Value="#cde0e5"/>
                                <Setter Property="FontSize" Value="12"/>
                                <Setter Property="FontFamily" Value="Arial"/>
                                <Setter Property="Foreground" Value="#404040"/>
                                <Setter Property="BorderBrush" Value="Transparent"/>
                                <Setter Property="BorderThickness" Value="0"/>
                                <Setter Property="Effect">
                                    <Setter.Value>
                                        <DropShadowEffect BlurRadius="0" Color="#FF000000" Direction="-60" Opacity="0.32" ShadowDepth="1"/>
                                    </Setter.Value>
                                </Setter>
                                <Setter Property="Margin" Value="10,5" />
                                <Setter Property="VerticalContentAlignment" Value="Bottom"/>
                            </Trigger>
                        </Style.Triggers>

                    </Style>
                </DataGrid.CellStyle>
                <DataGrid.RowStyle>
                    <Style TargetType="{x:Type DataGridRow}">
                        <Setter Property="FontSize" Value="12"/>
                        <Setter Property="FontFamily" Value="Arial"/>
                        <Setter Property="Foreground" Value="#404040"/>
                        <Setter Property="Background" Value="Transparent"/>
                        <Setter Property="DataContext">
                            <Setter.Value>
                                <TextBlock Margin="10,0,0,0" TextWrapping="Wrap" Text="{Binding}">
                                    <TextBlock.Effect>
                                        <DropShadowEffect BlurRadius="0" Color="#FF000000" Direction="-60" Opacity="0.32" ShadowDepth="1"/>
                                    </TextBlock.Effect>
                                </TextBlock>
                            </Setter.Value>
                        </Setter>
                        <Style.Triggers>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter Property="Background" >
                                    <Setter.Value>
                                        <ImageBrush ImageSource="/ClientApplication;component/Images/bonus_progress_bg.png"/>

                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                        </Style.Triggers>
                    </Style>
                </DataGrid.RowStyle>
                <DataGrid.RowBackground >
                    <ImageBrush ImageSource="/ClientApplication;component/Images/second_row_bg.png"/>
                </DataGrid.RowBackground>
                <DataGrid.AlternatingRowBackground>
                    <ImageBrush ImageSource="/ClientApplication;component/Images/bonus_progress_bg.png"/>
                </DataGrid.AlternatingRowBackground>



                <DataGrid.ColumnHeaderStyle>
                    <Style TargetType="{x:Type DataGridColumnHeader}">
                        <Setter Property="VerticalContentAlignment" Value="Center" />
                        <Setter Property="ContentTemplate" >
                            <Setter.Value>
                                <DataTemplate>
                                    <TextBlock Foreground="#404040" FontWeight="Bold" Margin="10,0,0,0" TextWrapping="Wrap" Text="{Binding}" TextOptions.TextFormattingMode="Display">
                                        <TextBlock.Effect>
                                            <DropShadowEffect BlurRadius="0" Color="#FFFFFF" Direction="-90" Opacity="0.40" ShadowDepth="1"  RenderOptions.ClearTypeHint="Auto" />
                                        </TextBlock.Effect>
                                    </TextBlock>

                                </DataTemplate>
                            </Setter.Value>
                        </Setter>

                        <Setter Property="Background">
                            <Setter.Value>
                                <ImageBrush ImageSource="/ClientApplication;component/Images/table_bg_header.png"/>
                            </Setter.Value>
                        </Setter>
                        <Setter Property="BorderBrush">
                            <Setter.Value>
                                <ImageBrush   ImageSource="/ClientApplication;component/Images/titel_bg.png"/>
                            </Setter.Value>
                        </Setter>

                        <Setter Property="Foreground" Value="#404040" />
                        <Setter Property="BorderThickness" Value="0, 0, 1, 0"/>
                        <Setter Property="Height" Value="26" />
                        <Setter Property="FontSize" Value="14"/>
                        <Setter Property="FontFamily" Value="Arial"/>

                    </Style>
                </DataGrid.ColumnHeaderStyle>

            </DataGrid>

当我选择行时,我会在网格上获得以下效果。

enter image description here

我希望整行有浅蓝色。

2 个答案:

答案 0 :(得分:0)

您可以使用TemplateBinding

<Border Name="DataGridCellBorder"
        Background="{TemplateBinding Background}"/>

答案 1 :(得分:0)

以前我遇到过同样的问题,所以我采用了以下方法,对我来说效果很好。一旦尝试......

您正在向网格顶部右侧指定一些宽度(您正在使用按钮)?只要给绑定元素赋予相同的宽度,如果你使用的是 Textblock ,那么该宽度与它的标题相同。