CODEWITHSUNDEEP
c#wpfdatagrid
Luis
Luis

Reputation: 2715

Change true/false to a image

i have a column in a datagrid that the content is True/false, how can i change this true/false(boolean) to a image, according to the text?

I'm using c# wpf.

Edit:

<dg:DataGridTemplateColumn  MinWidth="70" Header=" Is Done2">
    <dg:DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
            <Image Name="imgIsDone" Source="../Resources/Activo.png"/>
            <DataTemplate.Triggers>
                <DataTrigger Binding="{Binding Path=IsDone}" Value="False">
                    <Setter TargetName="imgIsDone" Property="Source" Value="../Resources/Inactivo.png"/>
                </DataTrigger>
            </DataTemplate.Triggers>
        </DataTemplate>
    </dg:DataGridTemplateColumn.CellTemplate>
</dg:DataGridTemplateColumn>

Upvotes: 3

Views: 7881

Answers (3)

ChrisG
ChrisG

Reputation: 126

In case someone struggles getting the answer(from benPearce) running, i had to modify the converter to use ImageSource!

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

namespace ViewManager
{
    public class BoolToImageConverter : IValueConverter
    {
        public ImageSource TrueImage { get; set; }
        public ImageSource FalseImage { get; set; }

        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            if (!(value is bool))
            {
                return null;
            }

            bool b = (bool)value;
            if (b)
            {
                return this.TrueImage;
            }
            else
            {
                return this.FalseImage;
            }
        }

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

usage with a resource 

       <local:BoolToImageConverter x:Key="BoolToImageConverter" FalseImage="{StaticResource UnLockedSource}" TrueImage="{StaticResource LockedSource}" />

...

 <Button Grid.Column="2" Command="{Binding LockUnlockCommand}" >
            <Image  Source="{Binding IsLocked, Converter={StaticResource BoolToImageConverter}}" MinHeight="50" MinWidth="50" />
        </Button>

Upvotes: 2

benPearce
benPearce

Reputation: 38333

public class BoolToImage : IValueConverter 
{
    public Image TrueImage { get; set; }
    public Image FalseImage { get; set; }

    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        if (!(value is bool))
        {
            return null;
        }

        bool b = (bool)value;
        if (b)
        {
            return this.TrueImage;
        }
        else
        {
            return this.FalseImage;
        }
    }

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

Then in your xaml, as a resource:

<local:BoolToImage TrueImage="{StaticResource Image}" FalseImage="{StaticResource FalseImage}" x:Key="BoolImageConverter"/>

Then in your binding:

ImageSource={Binding Path=BoolProp,Converter={StaticResource BoolImageConverter}}"

Upvotes: 16

Quartermeister
Quartermeister

Reputation: 59139

Use a DataGridTemplateColumn to supply a DataTemplate for the column that contains an Image, and use a value converter or a data trigger to set the image source based on the value of the column. Here is an example that uses a data trigger: 

<DataGridTemplateColumn>
    <DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
            <Image Name="MyImage" Source="TrueImage.png"/>
            <DataTemplate.Triggers>
                <DataTrigger Binding="{Binding BoolColumn}" Value="False">
                    <Setter TargetName="MyImage" Property="Source" Value="FalseImage.png"/>
                </DataTrigger>
            </DataTemplate.Triggers>
        </DataTemplate>
    </DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>

Upvotes: 12

Related Questions