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 (...

Mastering Modern UI: A Step-by-Step Guide to Creating Metro UI in WPF


To create metro ui you first have to install "Mahapps.metro" from NuGet.To install it right click on project and click on manage NuGet and type Mahapps.metro you will get this package you have to install from here.Now you are ready to create metro ui.Now open you Mainwindow.xaml and add one namespace like bellow
xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro" 
and replace Window to Controls:MetroWindow
Now your Mainwindow.xaml become
<Controls:MetroWindow x:Class="ProjectName.MainWindow"
          xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
          xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
          xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
          Title="MainWindow"
          Height="600"
          Width="800">

  <!-- your content -->

</Controls:MetroWindow>

Now you have to modify Mainwindow.xaml.cs file in wpf application before it was inherited from Window.Now to make it metro you have to replace Window to MetroWindow like

  public partial class MainWindow :MetroWindow 
 { 
         public MainWindow() 
         { 
               InitializeComponent(); 
         }
}

Now add some Button and run the application it will display window with black
background.To apply metro default style you have to add some resources.
All of MahApp.Metro’s resources are contained within separate resource dictionaries.
In order for most of the controls to adopt the MahApps.Metro theme,you will need to
add the ResourceDictionaries to your App.xaml

<Application x:Class="WpfApplication.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             StartupUri="MainWindow.xaml">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>

<!-- MahApps.Metro resource dictionaries. Make sure that all file names are Case Sensitive! -->
 <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/
   Controls.xaml"/>

<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/
  Fonts.xaml"/>
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/
  Colors.xaml"/>
      <!-- Accent and AppTheme setting -->
   <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/Blue.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" />
   </ResourceDictionary.MergedDictionaries>
   </ResourceDictionary>
  </Application.Resources>
</Application>

Now if you run the application you will get metro window with default style.
Watch video for more detail




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