CODEWITHSUNDEEP
c#xamlwindows-phone-8toolkit
S. Swaroop
S. Swaroop

Reputation: 431

set visibility of image dynamically in expanderview

I am trying to implement something where I need to display list of people and a green icon if they are online. these people are grouped by some categories. I am using an expanderview toolkit control to display the list. So how do I set the icon image to be visible dynamically ? I have tried something like this which didnt work.

<DataTemplate x:Key="groupsItemTemplate">
            <StackPanel Orientation="Horizontal" Margin="30,5,0,0"">
                <Image Height="30" Width="30" Source="/Assets/Online.png" Margin="10,5,0,0" Visibility="{Binding IsFriendOnline}"></Image>
                <TextBlock TextWrapping="NoWrap" FontFamily="Segoe WP Light" FontSize="24" Margin="8,0,0,0" VerticalAlignment="Center" HorizontalAlignment="left" Height="auto" Width="300" Text="{Binding FriendName}"></TextBlock>
            </StackPanel>
        </DataTemplate>

IsFriendOnline is an integer property.

Upvotes: 0

Views: 182

Answers (1)

BenjaminPaul
BenjaminPaul

Reputation: 2931

Firstly, you need to use a converter in order to convert the value of your IsFriendOnline property to the Visibility enum that you require.

WPF has a "BooleanToVisibilityConverter" built in so if you have the ability to change the IsFriendOnline to a boolean value (which sounds like it makes a little more sense anyway) I would go down this route... if its imperative that the property is an integer then you will need to roll your own converter which isnt difficult.

The syntax would look something like this when you have a converter (my code below assumes IsFriendOnline is a boolean)...

<BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
    <DataTemplate x:Key="groupsItemTemplate">
                <StackPanel Orientation="Horizontal" Margin="30,5,0,0"">
                    <Image Height="30" Width="30" Source="/Assets/Online.png" Margin="10,5,0,0" Visibility="{Binding IsFriendOnline, Converter={StaticResource BooleanToVisibilityConverter}}"></Image>
                    <TextBlock TextWrapping="NoWrap" FontFamily="Segoe WP Light" FontSize="24" Margin="8,0,0,0" VerticalAlignment="Center" HorizontalAlignment="left" Height="auto" Width="300" Text="{Binding FriendName}"></TextBlock>
                </StackPanel>
            </DataTemplate>

Hope this helps...

Upvotes: 1

Related Questions