MultiConverter

Article
03/01/2023

The MultiConverter converts an incoming value using all of the incoming converters in sequence. The order in which the converters are used is based on the order they are defined.

Syntax

This sample demonstrates how to use the MultiConverter with the IsEqualConverter and the TextCaseConverter. It converts the entered text to upper case and then checks that it is equal to the string 'MAUI', this will result in a boolean value and is bound to the IsVisible property on a Label control.

This example makes use of the MultiConverterParameter which allows for the ConverterParameter to be defined for the type of converter the MultiConverterParameter is set to.

XAML

Including the XAML namespace

In order to use the toolkit in XAML the following xmlns needs to be added into your page or view:

xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"

Therefore the following:

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.MyPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">

</ContentPage>

Would be modified to include the xmlns as follows:

<ContentPage
    x:Class="CommunityToolkit.Maui.Sample.Pages.MyPage"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">

</ContentPage>

Using the MultiConverter

The MultiConverter can be used as follows in XAML:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
             x:Class="CommunityToolkit.Maui.Sample.Pages.Converters.MultiConverterPage">

    <ContentPage.Resources>
        <ResourceDictionary>
            <toolkit:MultiConverter x:Key="MyMultiConverter">
                <toolkit:TextCaseConverter />
                <toolkit:IsEqualConverter />
            </toolkit:MultiConverter>
            <x:Array x:Key="MultiParams"
                     Type="{x:Type toolkit:MultiConverterParameter}">
                <toolkit:MultiConverterParameter
                    ConverterType="{x:Type toolkit:TextCaseConverter}"
                    Value="{x:Static toolkit:TextCaseType.Upper}" />
                <toolkit:MultiConverterParameter
                    ConverterType="{x:Type toolkit:IsEqualConverter}"
                    Value="MAUI" />
            </x:Array>
        </ResourceDictionary>
    </ContentPage.Resources>

    <Label IsVisible="{Binding EnteredName, Converter={StaticResource MyMultiConverter}, ConverterParameter={StaticResource MultiParams}, Mode=OneWay}" 
           Text="Well done you guessed the magic word!"/>

</ContentPage>

C#

The MultiConverter can be used as follows in C#:

class MultiConverterPage : ContentPage
{
    public MultiConverterPage()
    {
        var label = new Label { Text = "Well done you guessed the magic word!" };

        var converter = new MultiConverter
        {
            new TextCaseConverter(),
            new IsEqualConverter()
        };

        var parameters = new List<MultiConverterParameter>
        {
            new MultiConverterParameter { ConverterType = typeof(TextCaseConverter), Value = TextCaseType.Upper },
            new MultiConverterParameter { ConverterType = typeof(IsEqualConverter), Value = "MAUI" },
        };

        label.SetBinding(
            Label.IsVisibleProperty,
            new Binding(
                static (ViewModels vm) => vm.EnteredName,
                converter: converter,
                converterParameter: parameters));

        Content = label;
    }
}

C# Markup

Our CommunityToolkit.Maui.Markup package provides a much more concise way to use this converter in C#.

class MultiConverterPage : ContentPage
{
    public MultiConverterPage()
    {
        var converter = new MultiConverter
        {
            new TextCaseConverter(),
            new IsEqualConverter()
        };

        var parameters = new List<MultiConverterParameter>
        {
            new MultiConverterParameter { ConverterType = typeof(TextCaseConverter), Value = TextCaseType.Upper },
            new MultiConverterParameter { ConverterType = typeof(IsEqualConverter), Value = "MAUI" },
        };

        Content = new Label()
            .Text("Well done you guessed the magic word!")
            .Bind(
                Label.IsVisibleProperty,
                static (ViewModel vm) => vm.EnteredName,
                converter: converter,
                converterParameter: parameters);
    }
}

Examples

You can find an example of this converter in action in the .NET MAUI Community Toolkit Sample Application.

API

You can find the source code for MultiConverter over on the .NET MAUI Community Toolkit GitHub repository.

Share via