DataTrigger if Else case

Question

Hi,

I have an Image that I want to show and hide based on a Label like this:

<Image.Triggers>
    <DataTrigger TargetType="Image" Binding="{Binding Source={x:Reference LabelNickname}, Path=Text}" Value="Add">
        <Setter Property="IsVisible" Value="True" />
    </DataTrigger>
    <DataTrigger TargetType="Image" Binding="{Binding Source={x:Reference LabelNickname}, Path=Text}" Value="Add">
        <Setter Property="IsVisible" Value="False" />
    </DataTrigger>
</Image.Triggers>

so if LabelNickname's Text is Add the Display the Image otherwise hide the Image.

How can i achieve this please?

Thanks,

Jassim

Answer 1

Hello,

The code you provide is correct and can be triggered. I know you want to simplify the trigger method in XAML, but I have to say, it cannot be implemented with Triggers. Because XAML cannot contain conditional processing. Please see XAML - .NET MAUI | Microsoft Learn

However, a data-binding can reference a code-based binding converter that effectively allows some conditional processing.

You can try Binding value converters and refer to the following code :

Converter class

public class IsValiableBoolConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return (string)value == "Add";
    }
    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return (bool)value ? 1 : 0;
    }
}

XMAL

    <ContentPage.Resources>
        <local:IsValiableBoolConverter x:Key="IsValiableBool" />
    </ContentPage.Resources>

<Image...
              
                IsVisible="{Binding Source={x:Reference LabelNickname},
                                    Path=Text,
                                    Converter={StaticResource IsValiableBool}}">

                <!-- romve Triggers
<Image.Triggers>
                    <DataTrigger TargetType="Image" Binding="{Binding Source={x:Reference LabelNickname}, Path=Text}" Value="Add">
                        <Setter Property="IsVisible" Value="True" />
                    </DataTrigger>
                    <DataTrigger TargetType="Image" Binding="{Binding Source={x:Reference LabelNickname}, Path=Text}" Value="Add">
                        <Setter Property="IsVisible" Value="False" />
                    </DataTrigger>
                </Image.Triggers>
-->
</Image>

Best Regards,

Wenyan Zhang

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.