MultiValue Converter Basics Tutorial | WPF

The basics of MultiValue Converters. Learn how to create and use them.
Subscribe! ► www.youtube.co...
Previously, we have taken a look at single ValueConverters which help you to convert a value of one type to a value of another type. But there are often situations where you need to pass multiple values to a single converter and get a value of another type. For instance, if you want to return true when some text contains another text, you will need to pass 2 values to the converter such as the text that you want to search and the text where you want to search. And here is where you need to know how to work with multivalue converters.
So, let’s start by adding an additional row to our main window. So, open up MainWindow.xaml. An additional row to our outer Grid of Auto Height: RowDefinition Height="Auto"/
And I will copy the last GroupBox and change it as I need it. So, it will be in Grid.Row 3: GroupBox Grid.Row="3"
I will name it… Header="Contains String MultiConverter"
Background="BurlyWood"
And inside we’ll have 4 columns for 2 TextBlocks and 2 TextBoxes like this.
Text="Search:"/
Name="tb_Search"
TextBlock Grid.Column="2" Text="Content:" /
TextBox Grid.Column="3" Name="tb_Content"
Text="Test content"/
And now, we will create a new Converter. So, right-click on your project, select Add and New Class. I’ll name the converter ContainsStringMultiConverter.cs:
Unlike single value converters, which derive from IValueConverter, this one is going to be derived from IMultiValueConverter. Press Ctrl + . and include using System.Windows.Data;
This interface requires implementation. So, press Ctrl + . and hit implement interface. So, again, unlike single value converters, which have just a single object, these ones have it as arrays. And this allows us to use multiple values.
So, the first value is going to be string. I’ll name it textToContain: string textToContain = values[0].ToString();
And also, I will have another string for container text where we will search this string: string containerText = values[1].ToString();
So, of course, we can work with any number of values, but for simplicity I will work with just 2. So, we will check: if (textToContain == string.Empty)
return false;
But if it’s not…
if (containerText.ToLower().Contains(textToContain.ToLower()))
return true;
So, if we type in search “convert” or “Convert”, both of them will be found in string “ConvertBack”.
But if it’s not the case: else
return false;
So, if, for instance, we search for the string “qc”, and it’s not in “ConvertBack”.
OK, now, save it.
And we can get back to our MainWindow.
First of all, let’s rebuilt it. Now, at the end we will add local:ContainsStringMultiConverter x:Key="containsStringMultiConverter"/
Like this. Let’s copy this name and get back to the TextBox tb_Content. So, I will add a Style to this TextBox: TextBox.Style
Style TargetType="TextBox"
Style.Triggers
DataTrigger Value="True"
DataTrigger.Binding
MultiBinding Converter="{StaticResource containsStringMultiConverter}"
Binding ElementName="tb_Search" Path="Text"/
Binding RelativeSource="{RelativeSource self}" Path="Text" /
If this is true, we will set: Setter Property="Background" Value="Gold" /
Let’s check it. Press F5. If I type something that is not here, it’s not gold. But if I type something that is here like letter “e”, it will be gold. So, “testq” - not gold. But “test” which is inside this string and converter to lower as well as this one… of course, it will be Gold. That’s how you use binding when you pass values from XAML elements.
But if you for example pass a value from your C# property you will have to do a bit more work. Go to Backend. Let’s add a new property: public string SearchText { get; set; } = string.Empty;
I use it so that our converter does not work with a null object which will cause an Exception.
We will bind not to an element: Binding Path="SearchText" /
I will use the same property for this TextBox’ Text propery: Text="{Binding SearchText, UpdateSourceTrigger=PropertyChanged}"/
To save us some time, I will again install PropertyChanged.Fody NuGet package. In Browse type fody and select PropertyChanged.Fody. Install and again accept the license that will come up. Now that it is installed, again go to backend. We need to derive our window from an interface called INotifyPropertyChanged. Press Ctrl + . and include the namespace. This interface also requires implementation. Press Ctrl + . and hit Implement interface.
Let’s move it up. Here.
Now we can launch our program again.
It’s not in this string but for example “te” is in the string.
As you can see working with C# properties is just as easy as working with XAML elements. Again, MultiValue converters are used when you want to pass 2 or more values to a converter.
Source code: github.com/Qua...
More WPF Basics ► • WPF Basics

[@SHKIPPER989]

Файно, файно!_)

[@QuasimodoPrograms]

Сенк ю)

[@turkcanatilir3943]

Thanks for the accelerated tutorial. But why should I use the Fody/PropertyChanged nuget package ? Is it "must have" or "nice to have" ? Thanks again.

[@QuasimodoPrograms]

It just allows you to use auto-properties as is. Without fody, you explicitly implement a private property for each public property

[@turkcanatilir3943]

@@QuasimodoPrograms Thanks. Btw Viva Euroasia.