I would like to have the image to have an opacity of .50 when the IsEnabled is false. I have been looking at multiple examples but still I am not able to grasp how to make it work.
Here is the full XAML of my custom control. Any help would be deeply appreciated.
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
x:Class="test.StopButtonControl"
x:Name="UserControl"
d:DesignWidth="85" d:DesignHeight="85">
<Grid x:Name="LayoutRoot">
<Image x:Name="StopButtonUI" Source="Images/stop.png" Stretch="Fill" MouseUp="StopButtonClick"/>
</Grid>
</UserControl>
You can couple the
Image
'sOpacity
property to itsIsEnabled
property via a style trigger as follows:This will set the
Opacity
to 0.5 whenIsEnabled
is false.The
Image
'sIsEnabled
property will be triggered when theUserControl
has itsIsEnabled
property changed as a result of property inheritance i.e. the image is a child of the user control so it will have itsIsEnabled
property set too.