TreeView item foreground binding MVVM

Question

I am using TreeView to display my data. I want to bind foreground of a tree view item. Here is my code below.

View:

<UserControl.Resources>
    <HierarchicalDataTemplate x:Key="TreeViewItem" ItemsSource="{Binding Children}">
        <StackPanel Orientation="Horizontal">
            <CheckBox Margin="2" IsChecked="{Binding IsChecked, Mode=TwoWay}" Content="{Binding Title}" 
                        Background="{Binding Path=ForegroundColor}" IsThreeState="True"/>
        </StackPanel>
    </HierarchicalDataTemplate>
</UserControl.Resources>
<Grid>
    <TreeView Margin="5, 0, 5, 0" ItemsSource="{Binding GeoGraphixModules}" ItemTemplate="{StaticResource TreeViewItem}" IsEnabled="{Binding TreeViewEnabled}" />
</Grid>

And in my view model

public class SomeTreeViewItem { public Collection Children { get { return _children; } }

public Brush ForegroundColor
{
    get
    {
        if (SomeCheck)
            return Brushes.Green;
        else
            return Brushes.Red;
    }
}

}

Now when I debug this application 'ForegroundColor' is hit but the application still displays black as foreground for all the child items. What is the problem here?

Hi Faisal, If you debug this application are there binding expression errors in your output window? — Jordy van Eijk
System.Windows.Data Error: 1 : Cannot create default converter to perform 'one-way' conversions between types 'System.Drawing.Brush' and 'System.Windows.Media.Brush'. Consider using Converter property of Binding. BindingExpression:Path=ForegroundColor; DataItem='GeoGraphixModule' (HashCode=63453159); target element is 'CheckBox' (Name=''); target property is 'Background' (type 'Brush') — fhnaseer

Jordy van Eijk Jordy van Eijk · Accepted Answer · 2013-09-09T06:00:14

After trying to create the same error i made the following viewmodel

public class ViewModel
{
    private Collection<GeoGraphixModule> _geoGraphixModules;

    public ViewModel()
    {
        _geoGraphixModules = new Collection<GeoGraphixModule>();
        _geoGraphixModules.Add(new GeoGraphixModule(){Children = new Collection<Bla>(){new Bla{Children = new Collection<Bla>{new Bla(), new Bla(), new Bla()}}}});
        _geoGraphixModules.Add(new GeoGraphixModule(){Children = new Collection<Bla>(){new Bla{Children = new Collection<Bla>{new Bla(), new Bla(), new Bla()}}}});
        _geoGraphixModules.Add(new GeoGraphixModule(){Children = new Collection<Bla>(){new Bla{Children = new Collection<Bla>{new Bla(), new Bla(), new Bla()}}}});
        _geoGraphixModules.Add(new GeoGraphixModule(){Children = new Collection<Bla>(){new Bla{Children = new Collection<Bla>{new Bla(), new Bla(), new Bla()}}}});
    }

    public Collection<GeoGraphixModule> GeoGraphixModules
    {
        get { return _geoGraphixModules; }
        set { _geoGraphixModules = value; }
    }
}

public class GeoGraphixModule
{
    public Brush ForegroundColor
    {
        get
        {
            if (SomeCheck())
                return Brushes.Green;
            return Brushes.Red;
        }
    }

    private bool SomeCheck()
    {
        Random random = new Random();
        int randomNumber = random.Next(0, 100);

        if ((randomNumber % 2) == 0)
            return true;
        return false;
    }

    private Collection<Bla> _children;
    public Collection<Bla> Children { get; set; }
}

public class Bla
{
    private bool? _isChecked;
    private string _title;
    private Collection<Bla> _children;

    public bool? IsChecked
    {
        get { return _isChecked; }
        set
        {
            _isChecked = value;
        }
    }

    public Collection<Bla> Children
    {
        get { return _children; }
        set { _children = value; }
    }

    public string Title
    {
        get { return _title; }
        set
        {
            _title = value;
        }
    }
}

Its very ugly i know but it works for the top level take a loot at the below image

enter image description here

TreeView item foreground binding MVVM

1 Answers