Training
Module
Create a UI that uses data binding in .NET MAUI. - Training
Create a UI with data binding. Your UI automatically updates based on the latest data, while the data updates in response to changes in the UI.
This browser is no longer supported.
Upgrade to Microsoft Edge to take advantage of the latest features, security updates, and technical support.
The ColorToGrayScaleColorConverter
is a one way converter that allows users to convert an incoming Color
to a grayscale Color
.
The Convert
method returns the supplied value
converted to a grayscale Color
.
The ConvertBack
method is not supported.
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 . |
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 . |
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>
The ColorToGrayScaleColorConverter
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.ColorToGrayScaleColorConverterPage">
<ContentPage.Resources>
<ResourceDictionary>
<toolkit:ColorToGrayScaleColorConverter x:Key="ColorToGrayScaleColorConverter" />
</ResourceDictionary>
</ContentPage.Resources>
<Label Text="The Text is showing in grayscale"
TextColor="{Binding AppTextColor, Converter={StaticResource ColorToGrayScaleColorConverter}}" />
</ContentPage>
The ColorToGrayScaleColorConverter
can be used as follows in C#:
class ColorToGrayScaleColorConverterPage : ContentPage
{
public ColorToGrayScaleColorConverterPage()
{
var label = new Label { Text = "The Text is showing in grayscale" };
label.SetBinding(
Label.TextColorProperty,
new Binding(
static (ViewModels vm) => vm.AppTextColor,
converter: new ColorToGrayScaleColorConverter()));
Content = label;
}
}
Our CommunityToolkit.Maui.Markup
package provides a much more concise way to use this converter in C#.
using CommunityToolkit.Maui.Markup;
class ColorToGrayScaleColorConverterPage : ContentPage
{
public ColorToGrayScaleColorConverterPage()
{
Content = new Label { Text = "The Text is showing in grayscale" }
.Bind(
Label.TextColorProperty,
static (ViewModel vm) => vm.AppTextColor,
converter: new ColorToGrayScaleColorConverter());
}
}
You can find an example of this converter in action in the .NET MAUI Community Toolkit Sample Application.
You can find the source code for ColorToGrayScaleColorConverter
over on the .NET MAUI Community Toolkit GitHub repository.
.NET MAUI Community Toolkit feedback
.NET MAUI Community Toolkit is an open source project. Select a link to provide feedback:
Training
Module
Create a UI that uses data binding in .NET MAUI. - Training
Create a UI with data binding. Your UI automatically updates based on the latest data, while the data updates in response to changes in the UI.