Binding RadioButtons with Gender Property in WPF Using Value Converter

Many WPF developers face a common problem when working with RadioButtons.

They try to bind RadioButtons with a Gender property, but the binding does not work as expected.

Why does this happen?

Because RadioButtons work with true/false values, but in real applications, Gender is stored as meaningful values like:

  • Male

  • Female



So the big question is:

How do we connect a true/false UI control with a Male/Female data value?


Why RadioButton Binding Fails

A RadioButton uses the IsChecked property, and this property accepts only:

  • true

  • false

But your Gender property is usually:

  • a string ("Male", "Female")

  • or an enum

So the UI value and the data value are different types.

This mismatch is the root cause of the problem.


The Solution: Value Converter

WPF provides a powerful feature called a Value Converter.

What is a Value Converter?

A Value Converter converts one value type into another.

In our case:

  • Convert Gender (Male/Female)bool (true/false)

  • Convert bool (true/false)Gender (Male/Female)



This allows RadioButtons and the data model to work together smoothly.


Creating the Gender to Boolean Converter

Here is a simple value converter that solves the problem:

using System;

using System.Globalization;

using System.Windows.Data;

namespace WpfApp
{
    public class GenderToBoolConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return value?.ToString() == parameter?.ToString();
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return (bool)value ? parameter?.ToString() : null;
        }
    }
}

How This Converter Works

  • Convert

    • Checks if the Gender value matches the ConverterParameter

    • Returns true if it matches, otherwise false

  • ConvertBack

    • When a RadioButton is checked, it sends back the corresponding gender value

    • Updates the Gender property


Registering the Converter in XAML



Add the converter to your window resources:

<Window.Resources>

    <local:GenderToBoolConverter x:Key="GenderToBoolConverter"/>

</Window.Resources>

Binding RadioButtons Using the Converter

Now bind your RadioButtons like this:

<RadioButton Content="Male"  Margin="5"  IsChecked="{Binding Gender,

                         Converter={StaticResource GenderToBoolConverter},

                         ConverterParameter=Male}" />


<RadioButton Content="Female"  Margin="5"  IsChecked="{Binding Gender,

                         Converter={StaticResource GenderToBoolConverter},

                         ConverterParameter=Female}" />


What Happens Internally?

  • If Gender = "Male"Male RadioButton is checked

  • If user clicks Female RadioButtonGender becomes "Female"

  • UI and data stay perfectly in sync


Benefits of Using a Value Converter



✔ Clean MVVM-friendly solution
✔ No code-behind logic
✔ Works with real project data
✔ Easy to understand and maintain
✔ Solves type mismatch problems

Comments

Popular posts from this blog

Filter DataGrid and ListView in wpf using ICollectionView

Pagination of DataGrid in WPF using MVVM

How to Create TabControl using Prism Region