Change ListBox item visibility

Question

I have List box with multiple items in it like TextBlock,Image etc...

Now in the XAML file all the items visibility will be collapsed, in my .CS file based on a condition i deciding which item to display like i need to display only TextBlock or Image, but since all items visibility is collapsed by default, how to dynamically change the ListBoxItems visibility and set the data or image to the items?

Here is my XAML code:

<ListBox Name="listBox" 
         HorizontalContentAlignment="Stretch" 
         VerticalContentAlignment="Stretch" 
         SelectionChanged="TopicListboxSelectionChanged"
         ScrollViewer.VerticalScrollBarVisibility="Disabled">
         <ListBox.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Name="CellBack" Margin="0,0,0,4" Orientation="Horizontal">
                            <Border Name="borderColor" Background="#FFF2F4F7">
                                <TextBlock Name="text"
                                       Width="456"
                                       Padding="10,20,10,20"
                                       Visibility="Collapsed"
                                       TextAlignment="Center"
                                       Text="{Binding Path=Value}"
                                       Style="{StaticResource TextStyle}"/>
                            </Border>
                               <Image Name="Image"
                                       Grid.Row="0"
                                       Visibility="Collapsed"
                                       Width="Auto"
                                       Height="Auto"
                                       HorizontalAlignment="Center"
                                       VerticalAlignment="Center"
                                       Margin="1,1,1,1"/>
                        </StackPanel>
                     </DataTemplate>
                </ListBox.ItemTemplate>

EDIT

I am paht in my .CS file to an image source like this :

image = "Path to my soucre" + imagename +"phone.png";

Now in the the Image in XAML file how to bind this path to it ?

Usually we do it like this :

BitmapImage bmp = new BitmapImage(new Uri(fileName, UriKind.Relative));
                MyImage.Source = bmp;

here MyImage is the name of Image in the XAML file ,but in my case i cant get the image name which is in the list box so now how to bind the data ?

Answer 1

Just add a properties TextVisiblity and ImageVisibility to your view-model. Then bind to them directly:

<DataTemplate>
    <StackPanel>
        <TextBlock Visibility="{Binding TextVisibility}" ... />
        <Image Visibility="{Binding ImageVisibility}" ... />
    </StackPanel>
</DataTemplate>

The properties can be read-only, as in for example:

public Visibility TextVisibility
{
    get { return Value == null ? Visibility.Collapsed : Visibility.Visible; }
}

---

Alternatively, if you don't want to modify the model class, you can use an IValueConverter , eg:

<TextBlock Visibility="{Binding Converter={StaticResource ModelToTextVisibility}" ... />

(For this you'd have to write the ModelToTextVisibility class, see here for a full example of how to do it.)

Answer 2

this is how I get a listbox item in code.

 ListBoxItem lbi = listBox.ItemContainerGenerator.ContainerFromIndex(listBox.SelectedIndex) as ListBoxItem;

and thats how I make it invisible.

 lbi.Visibility = Visibility.Collapsed;