CODEWITHSUNDEEP
c#wpfdata-bindingdevexpress
loki
loki

Reputation: 2966

How to colorize DevExpress WPF GridControl Row?

i have a GridControl : 


 <dxg:GridControl Name="grd"  Height="270">
            <dxg:GridControl.Columns>
                <dxg:GridColumn Header="Id" FieldName="Id" AllowEditing="True" Width="30"/>
                <dxg:GridColumn Header="Name" FieldName="Name" AllowEditing="False" />
                <dxg:GridColumn Header="SurName" FieldName="SurName" AllowEditing="False" />
                <dxg:GridColumn Header="Age" FieldName="Age" CellStyle="{StaticResource customCellStyle}"  AllowEditing="False" />
                <dxg:GridColumn Header="Income" FieldName="Income" AllowEditing="False" />
                <dxg:GridColumn Header="Dept" FieldName="Dept" AllowEditing="False" />
            </dxg:GridControl.Columns>

        </dxg:GridControl>

i have been binding itemsource=List. BUT i want to colorize if
Age<=0 or Income<0 or Dept<=0 (Row colorize red after binding data)

how can i do that?

Upvotes: 1

Views: 17240

Answers (5)

Alexander Nikolaev
Alexander Nikolaev

Reputation: 161

You can set format to row programmatically. It also work to gridView. 

SolidColorBrush scb = new BrushConverter().ConvertFromString("#FFFF0000") as SolidColorBrush;//Red
        DevExpress.Xpf.Core.ConditionalFormatting.Format frm = new DevExpress.Xpf.Core.ConditionalFormatting.Format { Background = scb };
        TreeListView.FormatConditions.Add
            (
                new FormatCondition { FieldName = "Name", ApplyToRow = true, Format = frm , Expression = "[ZoneId] = 1" }
            );

Upvotes: 1

L0RDeX
L0RDeX

Reputation: 11

You need to edit TableView

<dxg:GridControl.View>
<dxg:TableView x:Name="tv_grd" ShowGroupPanel="False" AutoWidth="True"                  
    IsTotalSummaryMenuEnabled="False" RowUpdated="tv_grd_RowUpdated" >
    <dxg:TableView.FormatConditions>                        
        <dxg:FormatCondition ApplyToRow="True" Expression="[Age] &lt; '0'" FieldName="Age" PredefinedFormatName="LightRedFillWithDarkRedText"/>
    </dxg:TableView.FormatConditions>
    <dxg:TableView.FormatConditions>                        
        <dxg:FormatCondition ApplyToRow="True" Expression="[Income] &lt; '0'" FieldName="Income" PredefinedFormatName="LightRedFillWithDarkRedText"/>
    </dxg:TableView.FormatConditions>
        <dxg:FormatCondition ApplyToRow="True" Expression="[Dept] &lt; '0'" FieldName="Dept" PredefinedFormatName="LightRedFillWithDarkRedText"/>
    </dxg:TableView.FormatConditions>
</dxg:TableView>

Upvotes: 1

kiran
kiran

Reputation: 1072

Add the following lines in resources section :

<Style x:Key="ConditionalRowStyle"  BasedOn="{StaticResource {dxgt:GridRowThemeKey ResourceKey=RowStyle}}" TargetType="{x:Type dxg:GridRowContent}">
        <Setter Property="Background" Value="{Binding Path=DataContext.Age, Converter={local:ColorValueConverter}}"/>
</Style>

Then create a class that implements the IValueConverter ColorValueConverter

 public class ColorValueConverter : MarkupExtension, IValueConverter
    {


        #region IValueConverter Members
        public object Convert(object value, Type targetType,
        object parameter, CultureInfo culture)
        {
      /* your conditions here i.e Age<=0 */     
       if ((Int64)value <= 0)
         /*Return red color*/
                return Brushes.Red;
            else
        /*Return the default color*/                  
                return Brushes.White;
        }

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

        public override object ProvideValue(IServiceProvider serviceProvider)
        {
            return this;
        }
    }

set xmlns:local as the namespace of the ColorValueConverter class

At last set the Row style bindings in the table view :

 <dxg:TableView Name="tableView1" RowStyle="{StaticResource ConditionalRowStyle}">

Repeat the same for the other columns as well

Upvotes: 1

Willem
Willem

Reputation: 9476

You can use this for the entire row style:

<dxg:TableView.RowStyle>
    <Style  BasedOn="{StaticResource {dxgt:GridRowThemeKey ResourceKey=RowStyle}}" TargetType="{x:Type dxg:GridRowContent}">
        <Setter Property="Background" Value="{Binding Path=DataContext.Colour}" />
    </Style>
</dxg:TableView.RowStyle>

and for the cell style:

<dxg:GridColumn.CellStyle>
    <Style TargetType="{x:Type dxg:CellContentPresenter}">
        <Setter Property="TextBlock.Foreground" Value="Black" />
        <Style.Triggers>
            <DataTrigger Binding="{Binding Path=Data.SomeBooleanValue}" Value="True">
                <Setter Property="Background" Value="Lime" />
                <Setter Property="TextBlock.Foreground" Value="Black" />
            </DataTrigger>
        </Style.Triggers>
    </Style>
</dxg:GridColumn.CellStyle>

Upvotes: 5

DmitryG
DmitryG

Reputation: 17850

You can start from here : How to Conditionally Apply Styles

Upvotes: 0

Related Questions