how to change the color of selected row in devexpr

问题:

I am new to DevExpress grid. I need to change the color of a row in the grid when a row is selected.

Can someone please post some code to achieve the above scenario..

Thanks in advance..

回答1:

If I were you, I would change the GridView.Appearance.FocusedRow.BackColor and GridView.Appearance.SelectedRow.BackColor properties. This will force the GridControl to choose this color to paint the background of a selected row.

回答2:

When to ignore this answer

Please ignore this answer in favor of the post from DevExpress, if you want to have all grid rows colored the same (apart from the selected row).

If you want to dynamically color the grid rows based on some variable in the ViewModel behind each row, then this answer is a good start.

In a Nutshell

• Add a new style to the grid.
• The new style overrides the default color for the row.
• The new style has a DataTrigger that colors the highlighted row differently when it is selected (by monitoring SelectionState).

It's easy once the boilerplate is added...

Don't be put off by the volume of code. Once you add the boiler plate, the new color scheme is applied by adding this to any grid in your project:

RowStyle="{StaticResource CustomRowStyle}"

The XAML

Add this style:

<Style x:Key="CustomRowStyle" TargetType="{x:Type grid:GridRowContent}" BasedOn="{StaticResource {dxgt:GridRowThemeKey ResourceKey=RowStyle}}">
    <Setter Property="Foreground" Value="{StaticResource DoneForegroundBrush}" />
    <Setter Property="Background" Value="{StaticResource DoneBackgroundBrush}" />
    <Style.Triggers>
        <DataTrigger Binding="{Binding Path=SelectionState, Converter={StaticResource TrueIfSelectedOrFocused}}" Value="True">
            <Setter Property="Foreground" Value="{StaticResource SelectedForegroundBrush}" />
            <Setter Property="Background" Value="{StaticResource SelectedDoneBackgroundBrush}" />
        </DataTrigger>
    </Style.Triggers>
</Style>

Add these colors:

<SolidColorBrush x:Key="DoneForegroundBrush" Color="#FF00D000"></SolidColorBrush>
<SolidColorBrush x:Key="DoneBackgroundBrush" Color="#20263900"></SolidColorBrush>
<SolidColorBrush x:Key="SelectedForegroundBrush" Color="White"></SolidColorBrush>
<SolidColorBrush x:Key="SelectedDoneBackgroundBrush" Color="DarkGreen" Opacity="0.5"></SolidColorBrush>

Then attach this style to your grid using the RowStyle property:

<grid:GridControl
          ItemsSource="{Binding Items}"
          SelectedItem="{Binding ItemSelected, Mode=TwoWay}"
          AutoGenerateColumns="None"     
          SelectionMode="Row">
        <grid:GridControl.View>
            <grid:TableView VerticalScrollbarVisibility="Auto"
                AutoWidth="True"
                NavigationStyle="Row"
                DetailHeaderContent="Orders"
                ShowGroupPanel="False"
                ShowColumnHeaders="True"
                FadeSelectionOnLostFocus="False"
                ShowIndicator="False"
                UseLightweightTemplates="None"
                RowStyle="{StaticResource CustomRowStyle}">
            </grid:TableView>
        </grid:GridControl.View>                                    
        <grid:GridControl.Columns>
            <!-- Column definitions here. -->
        </grid:GridControl.Columns>
    </grid:GridControl>

The C#

Lastly, use this converter, which is needed to color the row differently if it is selected or focused:

namespace Converters
{
    public class TrueIfSelectedOrFocused : IValueConverter
    {
        #region IValueConverter Members
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            try
            {
                switch ((SelectionState)value)
                {
                    case SelectionState.Selected:
                    case SelectionState.Focused:
                    case SelectionState.FocusedAndSelected:
                        return true;
                    case SelectionState.None:
                        return false;
                    default:
                        return false;
                }
            }
            catch (Exception ex)
            {
                // Log error here.
            }
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return Binding.DoNothing;
        }
        #endregion
    }
}

To hook this converter up, we need to add the standard boiler plate code:

 <converters:TrueIfSelectedOrFocused x:Key="TrueIfSelectedOrFocused" />

and in the header:

 xmlns:converters="clr-namespace:Converters"