Friday, March 21, 2014

Set DataGrid Cell Color Based on Cell Value

If you work with the WPF DataGrid, and you would like to set the color of a cell depending on whether the cell value exceeds a certain parameter here is how you could do it.

First, you need to create a custom class that would return true or false depending on whether the incoming value is greater than the specified parameter. Your custom class should implement the IValueConverter interface.

public class MyNumberToBoolConverter : IValueConverter
    {
        public object Convert(object value, Type targetType,
            object parameter, CultureInfo culture)
        {                        

            double dValue = System.Convert.ToDouble(value);
            double dParameter = System.Convert.ToDouble(parameter);

            return (dValue >= dParameter);             
        }

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

Declare the class in your XAML:

<Window.Resources>
<local:MyNumberToBooleanConverter x:Key="numberToBool" />
</Window.Resources>

Create a style to be used for your DataGrid with 2 data triggers, one for the true value, and the other for the negative value:

<Style x:Key="PriceChangeStyle" TargetType="DataGridCell">
          <Style.Triggers>
             <DataTrigger Binding="{Binding YourDataField, 
                     Converter={StaticResource numberToBool}, ConverterParameter=0}" 
                     Value="True">
                    <Setter Property="Foreground" Value="Green"></Setter>
                </DataTrigger>
                 <DataTrigger Binding="{Binding YourDataField, 
                     Converter={StaticResource numberToBool}, ConverterParameter=0}" 
                     Value="False">
                    <Setter Property="Foreground" Value="Red"></Setter>
                </DataTrigger>
            </Style.Triggers>
 </Style>

The converter paramer we use is 0. So if the value in your data field is greater than 0, the cell foreground is set to green, otherwise it is set to red.

Now, all that is left to do is to use the style with your DataGrid:

<DataGrid …
  CellStyle="{StaticResource PriceChangeStyle}"..>        

If you don’t want some datagrid cells to be affected by the data trigger, you can specify the foreground value explicitly:

<DataGridTextColumn Header="MyHeader" Binding="{Binding Path=MyDataField2}" Foreground="Blue"/>

Wednesday, June 26, 2013

DataGrid Content Vertical Alignment

Use the following style:

<Style x:Key="Body_Content_DataGrid_Centering"
        TargetType="{x:Type DataGridCell}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type DataGridCell}">
                <Grid Background="{TemplateBinding Background}">
                    <ContentPresenter VerticalAlignment="Center" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Found on http://stackoverflow.com/questions/3981250/datagrid-row-content-vertical-alignment

Thursday, November 22, 2012

Align DataGrid Column Contents

Here is the XAML to center align a DataGrid column:
 
<Style TargetType="DataGridCell">    
<Style.Setters>
<Setter Property="TextBlock.TextAlignment" Value="Center" />
</Style.Setters>
</Style>

Thursday, May 17, 2012

Have Control Fill Parent's Available Space

Use the "HorizontalAlignment" and "VerticalAlignment" properties and set them to "Stretch":

HorizontalAlignment.="Stretch" VerticalAlignment="Stretch".

For example, you could use these properties on a TextBox that is inside a Grid cell

Wednesday, April 25, 2012

WPF GridView Cell Borders

If you populate a GridView programmatically it is not obvious how can set its style.
The best approach I found is to set its style in XAML first, and then assign it in code. For example, this is how you would put borders under each row:

<ListView.Resources>
<Style x:Key="itemstyle" TargetType="{x:Type ListViewItem}"> 
<Setter Property="BorderThickness" Value="1" />
<Setter Property="BorderBrush" Value="#BABABE" />
</Style>
</ListView.Resources>

Then, after you set the DataContext property in code, use:

myListView.ItemContainerStyle = (Style)myListView.Resources["itemstyle"];