Use Data Triggers to Change the Appearance of Bound Data

image_pdfimage_print


   
  
<Window x:Class="WpfApplication1.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:WpfApplication1="clr-namespace:WpfApplication1"
    x:Name="thisWindow" Title="WPF" Height="240" Width="280">

    <Window.Resources>
        <WpfApplication1:DataItems x:Key="dataItems"/>
        <WpfApplication1:AmountToHeightConverter x:Key="amountToHeightConverter" />
        <DataTemplate x:Key="dataItemtemplate">
            <Rectangle x:Name="rectangle" Width="30"
                VerticalAlignment="Bottom"
                Fill="Green"
                Height="{Binding Path=Amount,Converter={StaticResource amountToHeightConverter}}"/>
            <DataTemplate.Triggers>
                <DataTrigger Binding="{Binding Path=IsPositive}" Value="False">
                    <Setter TargetName="rectangle" Property="Fill" Value="Red"/>
                </DataTrigger>
            </DataTemplate.Triggers>
        </DataTemplate>
    </Window.Resources>
    <StackPanel>
        <ItemsControl ItemsSource="{Binding Source={StaticResource dataItems}}"
            ItemTemplate="{StaticResource dataItemtemplate}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal"/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>

        <Line Stroke="Black" StrokeThickness="2" X1="0" Y1="0" X2="0" Y2="{Binding ElementName=thisWindow, Path=ActualHeight}"/>
        <Line Stroke="Black" StrokeThickness="2" X1="0" Y1="0" X2="{Binding ElementName=thisWindow, Path=ActualWidth}" Y2="0"/>
    </StackPanel>
</Window>
//File:Window.xaml.cs
using System;
using System.Windows.Data;
using System.Globalization;
using System.Collections.ObjectModel;
namespace WpfApplication1
{
    [ValueConversion(typeof (double), typeof (double))]
    public class AmountToHeightConverter : IValueConverter
    {
        public Object Convert(Object value,Type targetType,Object parameter,CultureInfo culture)
        {
            double amount = System.Convert.ToDouble(value);
            if(amount < 0)
                amount = 0;

            return amount;
        }
        public object ConvertBack(object value,Type targetType,object parameter,CultureInfo culture)
        {
            throw new NotImplementedException();
        }
    }
    public class DataItem
    {
        public double Amount
        {
            get;
            set;
        }

        public bool IsPositive
        {
            get
            {
                return Amount >= 0;
            }
        }
    }

    public class DataItems : Collection<DataItem>
    {
        public DataItems()
        {
            this.Add(new DataItem(){Amount=5});
            this.Add(new DataItem(){Amount=8});
            this.Add(new DataItem(){Amount=-5});
            this.Add(new DataItem(){Amount=2});
            this.Add(new DataItem(){Amount=-5});
            this.Add(new DataItem(){Amount=-5});
        }
    }
}