WPF Unable to display Ellipse in DataGridTemplateColumn

Question

I have an Ellipse in a DataGridTemplateColumn, the data it is bound to displays correctly in the next column but my ellipse column is always empty, nothing displayed.

<DataGridTemplateColumn CanUserResize="False" Header="StateEllipse">
    <DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
            <StackPanel>
                <Ellipse Fill="{Binding Path=State, Converter={StaticResource StateToBrush}}" Width="10" Height="10" />
                <TextBlock Text="{Binding Path=State}" />
            </StackPanel>
        </DataTemplate>
    </DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTextColumn Header="State" Binding="{Binding Path=State}" />

My Converter looks like this :

using System;
using System.Globalization;
using System.Windows.Data;
using System.Windows.Media;

namespace ThisNS.NS.Converter
{
    [ValueConversion(typeof(int), typeof(Brush))]
    public sealed class StateToBrush : IValueConverter
    {

    #region IValueConverter Members

        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            Color stateColor = Colors.Yellow;
            switch ((int)value)
            {
                case 0:
                    stateColor = Colors.Green;
                    break;
                case 1:
                    stateColor = Colors.Red;
                    break;
            }
            return new SolidColorBrush(Colors.Yellow);
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }

    #endregion
    }
}

My second column that displays the State value is ok but the first one with the ellipse is always empty.

The converter is never called, so the binding is never binded.

Somebody has an idea/suggestion?

Thank you.

Answer 1

Looks like you are failing to set the size of the Ellipse?

You have to set its Width and Height properties in order for it to show I believe...

Answer 2

I just tried recreating your problem but in my case it works just fine. Please see below.

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:WpfApplication1="clr-namespace:WpfApplication1"
    Title="MainWindow" Height="350" Width="525">
<Window.Resources>
    <WpfApplication1:StateToBrush x:Key="StateToBrush"/>
</Window.Resources>
<Grid>
    <DataGrid ItemsSource="{Binding Items}" >
        <DataGrid.Columns>
            <DataGridTemplateColumn CanUserResize="False" Header="StateEllipse">
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <StackPanel>
                            <Ellipse Fill="{Binding Converter={StaticResource StateToBrush}}" Width="10" Height="10" />
                            <TextBlock FontWeight="Bold" Foreground="Blue" Text="{Binding}" />
                        </StackPanel>
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
            </DataGridTemplateColumn>
            <DataGridTextColumn Header="State" Binding="{Binding}" />
            <DataGridTemplateColumn CanUserResize="False" Header="StateEllipse 2">
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <StackPanel>
                            <Ellipse Fill="{Binding Converter={StaticResource StateToBrush}}" Width="10" Height="10" />
                            <TextBlock FontWeight="Bold" Foreground="Green" Text="{Binding}" />
                        </StackPanel>
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
            </DataGridTemplateColumn>
        </DataGrid.Columns>
    </DataGrid>
</Grid>

public partial class MainWindow : Window
{
    public MainWindow()
    {
        DataContext = this;
        InitializeComponent();
        Items = new ObservableCollection<int>();
        for (int i = 0; i < 100; i++)
        {
            Items.Add(i);
        }
    }

    public ObservableCollection<int> Items
    {
        get { return (ObservableCollection<int>)GetValue(ItemsProperty); }
        set { SetValue(ItemsProperty, value); }
    }

    public static readonly DependencyProperty ItemsProperty =
        DependencyProperty.Register("Items", typeof(ObservableCollection<int>), typeof(MainWindow));


}

[ValueConversion(typeof(int), typeof(Brush))]
public sealed class StateToBrush : IValueConverter
{

    #region IValueConverter Members

    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        Color stateColor = Colors.Yellow;
        switch ((int)value)
        {
            case 0:
                stateColor = Colors.Green;
                break;
            case 1:
                stateColor = Colors.Red;
                break;
        }
        return new SolidColorBrush(stateColor);
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }

    #endregion
}