Question

I have custom control in wpf which change his look based on one Property:

…

<Grid>
   <Rectangle Fill="[Something]" />
</Grid>

In code i have the property AlarmLevel, when AlarmLevel is bigger than 5 I want the fill to be red, otherwise blue.
How can I do this. (I don’t want the fill property to be exposed)

Tnx

Answer 1

Since you’re basing your fill value on an inequality, you could do this a couple of ways.

The recommended way is probably to use a converter on your binding to make it into a boolean value. Then use a data trigger to set the fill value based on whether the value is true or false, like so:

<Rectangle>
  <Rectangle.Style>
    <Style TargetType="Rectangle">
      <Style.Triggers>
        <DataTrigger Binding="{Binding AlarmLevel, Converter={StaticResource AlarmLevelConverter}}" Value="True">
          <Setter Property="Fill">
            <Setter.Value>
              <SolidColorBrush Color="Red" />
            </Setter.Value>
          </Setter>
        </DataTrigger>
        <DataTrigger Binding="{Binding AlarmLevel, Converter={StaticResource AlarmLevelConverter}}" Value="False">
          <Setter Property="Fill">
            <Setter.Value>
              <SolidColorBrush Color="Black" />
            </Setter.Value>
          </Setter>
        </DataTrigger>
      </Style.Triggers>
    </Style>
  </Rectangle.Style>
</Rectangle>

Your converter could look something like (perhaps with more exception handling):

  public class AlarmLevelConverter: IValueConverter {

    public object Convert(object value, System.Type targetType, object parameter, System.Globalization.CultureInfo culture) {
      return ((int)(value) > 5);
    }

    public object ConvertBack(object value, System.Type targetType, object parameter, System.Globalization.CultureInfo culture) {
      throw new NotSupportedException();
    }
  }

Don’t forget you’ll need to add a reference to the converter class as a resource on your user control:

If you wanted to forego the converter method, you could also create a “helper” boolean property in your data context called something like “IsAlarming”. It would look something like:

public bool IsAlarming {
  get { return AlarmLevel > 5; }
}

You would then bind your data trigger to IsAlarming rather than AlarmLevel. This isn’t recommended though, because it’s not pure MVVM.