5

Converter with multiple Parameters in Xamarin Forms

 3 years ago
source link: https://xamgirl.com/converter-with-multiple-parameters-in-xamarin-forms/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

— If you don’t know what a converter is, I recommend you reading this article first.

Have you ever wondered how to pass multiple parameters to a converter, or how to create properties in a converter to change the value based on them? If you want to know how to achieve it then keep reading :).

Use Case

You have multiple properties (Age, IsAdmin, Name) in your ViewModel and according to these properties you want to change the TextColor of a Label. Example: If Age is >= 18 and IsAdmin is true then it should return red, if Age is < 18 and IsAdmin is true then would return green, etc.

Ideas

When you think about how to achieve it, the first thing that comes to mind is to do something like this:

<Label Text="{Binding Name}"> <Label.TextColor> <Binding Path="Name"> <Binding.Converter> <converters:CustomerValuesToColorConverter Age="{Binding Age}" IsAdmin="{Binding IsAdmin}"/> </Binding.Converter> </Binding> </Label.TextColor> </Label>

Basically, having a CustomerValuesToColorConverter and creating Bindable properties for Age and IsAdmin, then bind it to the ViewModel properties.

The problem with this approach is that the converters don’t handle the property change, so if you change the Age after updating the IsAdmin, it won’t update the property value.

Solution

Thanks to Multi-Binding that scenario is possible to achieve since now we can have an IMultiValueConverter. We just need to add MultiBinding to the targeted property, specify all our bindings, and use the IMultiValueConverter.

<Label Text="{Binding Name}"> <Label.TextColor> <MultiBinding> <Binding Path="Age" /> <Binding Path="Name" /> <Binding Path="IsAdmin" /> <MultiBinding.Converter> <converters:MultiBindingToColorConverter/> </MultiBinding.Converter> </MultiBinding> </Label.TextColor> </Label>

Create a converter that extends from IMultiValueConverter, in the values parameter you will receive each value, so every time any of these values change your converter will get notified and update the converted value according to your defined conditions.

namespace BindableConverterSample { public class MultiBindingToColorConverter : IMultiValueConverter { private string Name { get; set; } private int Age { get; set; } private bool IsAdmin { get; set; }

public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture) { if (values != null) { foreach (var value in values) { if(value is int age) { Age = age; }

if (value is bool isAdmin) { IsAdmin = isAdmin; }

if (value is string name) { Name = name; } }

if(string.IsNullOrEmpty(Name)) { return Color.Black; }

if(Age >= 18 && !IsAdmin) { return Color.Red; }else if (Age < 18 && !IsAdmin) { return Color.Blue; } else if (Age < 18 && IsAdmin) { return Color.Green; } else if (Age >= 18 && IsAdmin) { return Color.Fuchsia; } }

return Color.Black; }

public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture) => targetTypes; } }

Result

That’s all for now! You can check the full sample here.

Happy coding!

Like this:

Loading...

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK