IndexToArrayItemConverter

Article
03/01/2023

The IndexToArrayItemConverter is a converter that allows users to convert an int value binding to an item in an array. The int value being data bound represents the indexer used to access the array. The array is passed in through the ConverterParameter.

BaseConverter Properties

The following properties are implemented in the base class, public abstract class BaseConverter:

Property	Description
`DefaultConvertReturnValue`	Default value to return when `IValueConverter.Convert(object?, Type, object?, CultureInfo?)` throws an `Exception`. This value is used when CommunityToolkit.Maui.Options`.ShouldSuppressExceptionsInConverters` is set to `true`.
`DefaultConvertBackReturnValue`	Default value to return when `IValueConverter.ConvertBack(object?, Type, object?, CultureInfo?)` throws an `Exception`. This value is used when CommunityToolkit.Maui.Options`.ShouldSuppressExceptionsInConverters` is set to `true`.

ICommunityToolkitValueConverter Properties

The following properties are implemented in the public interface ICommunityToolkitValueConverter:

Property	Type	Description
`DefaultConvertReturnValue`	`object?`	Default value to return when `IValueConverter.Convert(object?, Type, object?, CultureInfo?)` throws an `Exception`. This value is used when CommunityToolkit.Maui.Options`.ShouldSuppressExceptionsInConverters` is set to `true`.
`DefaultConvertBackReturnValue`	`object?`	Default value to return when `IValueConverter.ConvertBack(object?, Type, object?, CultureInfo?)` throws an `Exception`. This value is used when CommunityToolkit.Maui.Options`.ShouldSuppressExceptionsInConverters` is set to `true`.

Syntax

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 IndexToArrayItemConverter

The IndexToArrayItemConverter 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="MyLittleApp.MainPage">
    <ContentPage.Resources>
        <ResourceDictionary>
            <toolkit:IndexToArrayItemConverter x:Key="IndexToArrayItemConverter" />
            <x:Array x:Key="MyArray" Type="x:String">
                <x:String>Value 1</x:String>
                <x:String>Value 2</x:String>
                <x:String>Value 3</x:String>
                <x:String>Value 4</x:String>
                <x:String>Value 5</x:String>
            </x:Array>
        </ResourceDictionary>
    </ContentPage.Resources>

    <StackLayout>

        <Label Text="{Binding MyIntegerValue, Converter={StaticResource IndexToArrayItemConverter}, ConverterParameter={StaticResource MyArray}}" />

    </StackLayout>
</ContentPage>

C#

The IndexToArrayItemConverter can be used as follows in C#:

class IndexToArrayItemConverter : ContentPage
{
    public IndexToArrayItemConverter()
    {
        var array = new string[] { "Value 1", "Value 2", "Value 3", "Value 4", "Value 5" };

        var label = new Label();

        label.SetBinding(
            Label.TextProperty, 
            new Binding(
                nameof(ViewModel.MyIntegerValue), 
                converter: new IndexToArrayItemConverter(), 
                converterParameter: array)); 

        Content = label;        
    }
}

C# Markup

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

using CommunityToolkit.Maui.Markup;

class IndexToArrayItemConverter : ContentPage
{
    public IndexToArrayItemConverter()
    {
         var array = new string[] { "Value 1", "Value 2", "Value 3", "Value 4", "Value 5" };

        Content = new Label()
            .Bind(
                Label.TextProperty, 
                static (ViewModel vm) => vm.MyIntegerValue,
                converter: new IndexToArrayItemConverter(),
                converterParameter: array); 
    }
}

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 IndexToArrayItemConverter over on the .NET MAUI Community Toolkit GitHub repository.

Share via