1. Converter Class:
public class BoolToVisibleOrHidden : IValueConverter
{
public BoolToVisibleOrHidden() { }
public bool Collapse { get; set; }
public bool Reverse { get; set; }
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
bool bValue = (bool)value;
if (bValue != Reverse)
{
return Visibility.Visible;
}
else
{
if (Collapse)
return Visibility.Collapsed;
else
return Visibility.Hidden;
}
}
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
Visibility visibility = (Visibility)value;
if (visibility == Visibility.Visible)
return !Reverse;
else
return Reverse;
}
}
2. Add Reference to the xaml file:
xmlns:local="clr-namespace:Reluce.ServiceTracker.Helpers"
<UserControl.Resources>
<local:BoolToVisibleOrHidden x:Key="BoolToVisConverter" Collapse="True" />
<LinearGradientBrush x:Key="LightBrush" StartPoint="0,0" EndPoint="0,1">
<GradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Color="#FFF" Offset="0.0"/>
<GradientStop Color="#EEE" Offset="1.0"/>
</GradientStopCollection>
</GradientBrush.GradientStops>
</LinearGradientBrush>
</UserControl.Resources>
3. Listview:
<ListView
Name="lbMainMenu"
Grid.Row="2"
FontSize="17"
Width="209"
Margin="2,3,0,3"
PreviewMouseLeftButtonUp ="lbMainMenu_PreviewMouseLeftButtonUp" >
<ListView.Items>
<ListViewItem Selected="Addministartion_Selected">
<StackPanel Name="stkPanel" Orientation="Horizontal">
<TextBlock
Name="lblScreenName"
Grid.Row="0"
Grid.Column="0"
Text="Administration" />
<Image
Grid.Row="0"
Grid.Column="1"
HorizontalAlignment="Right"
Margin="53,0,0,0"
Source="/Assets/arrow.png"
/>
</StackPanel>
</ListViewItem>
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="Background" Value="{StaticResource LightBrush}" />
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Cursor" Value="Hand" />
</Trigger>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="Green" />
<Setter Property="FontWeight" Value="Bold" />
<Setter Property="FontStyle" Value="Italic" />
</Trigger>
</Style.Triggers>
</Style>
</ListView.ItemContainerStyle>
<ListView.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#666666" Offset="1"/>
<GradientStop Color="#999999" Offset="0.5"/>
</LinearGradientBrush>
</ListView.Background>
</ListView>
4. Add Following Line Image:
Visibility="{Binding Converter={StaticResource BoolToVisConverter}, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ListBoxItem}, AncestorLevel=1},Path=IsSelected}"
5. Example:
<Image
Grid.Row="0"
Grid.Column="1"
HorizontalAlignment="Right"
Margin="127,0,0,0"
Source="/Assets/arrow.png"
Visibility="{Binding Converter={StaticResource BoolToVisConverter}, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ListBoxItem}, AncestorLevel=1},Path=IsSelected}"
/>