Change image.Source in ListView according to boolean

1.3k Views Asked by At

I have a listview with 2 columns: "visibility" and "name" of a system. The value of column 1: a button (btn_visibility) with an image (img_visibility).

Depending on a boolean (true or false) from an object in code behind the image should change, e.g. SYSTEM.SHOW_IN_LIST = true; img_visibility.Source = new BitmapImage(new Uri(App.CONTROLLER.PATHS.PATH_TO_MINUS));

An image is reachable under following relative path: App.CONTROLLER.PATHS.PATH_TO_"Name of my image", e.g. App.CONTROLLER.PATHS.PATH_TO_ADD;

My xaml-code in SystemmanagementWindow.xaml:

<ListView x:Name="lv_Systems" HorizontalAlignment="Left" Height="227" Margin="313,5,0,0" VerticalAlignment="Top" Width="153" SelectedIndex="0" SelectionChanged="listView_Systems_SelectionChanged">
        <ListView.View>
            <GridView>
                <GridViewColumn Header="{x:Static p:Resources.SystemmanagementWindow_listView_col_1}" DisplayMemberBinding="{Binding SYSTEMNAME}" Width="110"/>
                <GridViewColumn Header="{x:Static p:Resources.SystemmanagementWindow_listView_col_2}"  Width="34">
                    <GridViewColumn.CellTemplate>
                        <DataTemplate>
                            <Button Click="EditVisibility" CommandParameter="{Binding}" Width="20">
                                <Image x:Name="img_visibility" width="10" Height="10"/>
                            </Button>
                        </DataTemplate>
                    </GridViewColumn.CellTemplate>
                </GridViewColumn>
            </GridView>
        </ListView.View>
    </ListView>

Many thanks in advance!

1

There are 1 best solutions below

0
On BEST ANSWER

For those who are searching for the solution:

BoolToImageConverter.cs:

public class BoolToImageConverter : IValueConverter
{
    public object Convert(object value, System.Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        return (bool)value ? "D:\\Test\\Test\\bin\\Debug\\img\\add.png" : "D:\\Test\\Test\\bin\\Debug\\img\\minus.png";
    }

    public object ConvertBack(object value, System.Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        return false; // not needed
    }
}

Found here: https://social.msdn.microsoft.com/Forums/vstudio/en-US/b0be201f-cd9a-4cde-b3f8-35014c4ca485/wpf-how-to-show-some-items-and-hide-some-items-in-a-listview-base-on-a-bool-value?forum=wpf

Edited MainWindow.xaml for working parallel with multicolumn listview:

<Window.Resources>
    <local:BoolToImageConverter x:Key="image_converter"/>
    <local:BoolToTooltipConverter x:Key="tooltip_converter"/>
</Window.Resources>
[...]
<ListView x:Name="listView" ItemsSource="{Binding List}">
    <ListView.View>
        <GridView>
            <GridViewColumn Header="System" DisplayMemberBinding="{Binding Name}" Width="100"/>
            <GridViewColumn Header="Status">
                <GridViewColumn.CellTemplate>
                    <DataTemplate>
                        <Button ToolTip="{Binding IsActive, Converter={StaticResource tooltip_converter}}">
                            <Image Source="{Binding IsActive, Converter={StaticResource image_converter}}" Width="15"/>
                        </Button>
                    </DataTemplate>
                </GridViewColumn.CellTemplate>
            </GridViewColumn>
        </GridView>
    </ListView.View>
</ListView>

Just add following lines to MainWindow.cs to see the result:

var list = new List<object>();
list.Add(new { Name = "First Name", IsActive = true });
list.Add(new { Name = "Second Name", IsActive = true });
list.Add(new { Name = "Third Name", IsActive = false });
list.Add(new { Name = "Fourth Name", IsActive = true });
list.Add(new { Name = "Fifth Name", IsActive = false });
list.Add(new { Name = "Sixth Name", IsActive = true });
list.Add(new { Name = "Seventh Name", IsActive = true });
DataContext = new { List = list };

Hope this helps.