(WPF) mvvm: ComboBox binding

The basic idea is to bind the viewmodel attribute in the view Xmal. Although binding can be implemented in the view background code, the relative amount of code in the Xmal is less.

In this example, a list <customer> is bound to a ComboBox, and the age of the selected customer is displayed in a textblock.

 

1. Model

    public class Customer    {        public string Name        {            get;            set;        }        public int Age        {            get;            set;        }    }

2. viewmodel

    public class CustomerViewModel : ViewModelBase    {        private List<Customer> customers;        private Customer selectedCustomer;         public CustomerViewModel()        {            this.customers = new List<Customer>()            {                new Customer { Name = "Paul", Age = 28 },                new Customer { Name = "Fred", Age = 37 },                new Customer { Name = "Cherry", Age = 21 },            };            this.selectedCustomer = new Customer();         }        public List<Customer> Customers        {            get            {                return this.customers;            }            set            {                if (!this.customers.Equals(value))                {                    this.customers = value;                    base.OnPropertyChanged("Customers");                 }            }        }        public Customer SelectedCustomer        {            get            {                return this.selectedCustomer;            }            set            {                if (!this.selectedCustomer.Equals(value))                {                    this.selectedCustomer = value;                    base.OnPropertyChanged("SelectedCustomer");                 }            }        }    }

3. View.

<UserControl x:Class="WpfApplication1.View.CustomerView"             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"              xmlns:d="http://schemas.microsoft.com/expression/blend/2008"              xmlns:vm="clr-namespace:WpfApplication1.ViewModel"             mc:Ignorable="d"             Height="308.072"             Width="457.399">    <UserControl.DataContext>        <vm:CustomerViewModel/>    </UserControl.DataContext>    <Grid>        <ComboBox HorizontalAlignment="Left"                  Margin="45,47,0,0"                  VerticalAlignment="Top"                  Width="120"                  Height="31"                   ItemsSource="{Binding Customers}"                  SelectedItem="{Binding SelectedCustomer}"                  DisplayMemberPath="Name"/>        <TextBlock HorizontalAlignment="Left"                   Margin="212,52,0,0"                   TextWrapping="Wrap"                   Text="{Binding SelectedCustomer.Age}"                   VerticalAlignment="Top"                   Height="26"                   Width="101" />    </Grid></UserControl>

 

Other binding methods are as follows:

    <TextBlock Text="Example 1" VerticalAlignment="Center"/>            <ComboBox ItemsSource="{Binding MyStringOptions}" Grid.Column="1" SelectedItem="{Binding SelectedOption1}" Margin="5"/>            <TextBlock Text="{Binding SelectedOption1}" Grid.Column="2" Margin="10,5,5,0" VerticalAlignment="Center"/>            <TextBlock Grid.Row="1" Text="Example 2" VerticalAlignment="Center"/>            <ComboBox Grid.Row="1" Grid.Column="1" ItemsSource="{Binding MyClassOptions}" SelectedItem="{Binding SelectedClass}" DisplayMemberPath="Name" Margin="5"/>            <TextBlock Grid.Row="1" Grid.Column="2" Margin="10,5,5,0" VerticalAlignment="Center"><Run Text="{Binding SelectedClass.Name}"/><Run Text=" - "/><Run Text="{Binding SelectedClass.Age}"/></TextBlock>            <TextBlock Grid.Row="2" Text="Example 3" VerticalAlignment="Center"/>            <ComboBox Grid.Row="2" Grid.Column="1" ItemsSource="{Binding MyClassOptions}" SelectedValuePath="Age" SelectedValue="{Binding SelectedAge}" DisplayMemberPath="Name" Margin="5"/>            <TextBlock Grid.Row="2" Grid.Column="2" Margin="10,5,5,0" VerticalAlignment="Center"><Run Text="Selected age: "/><Run Text="{Binding SelectedAge}"/></TextBlock>            <TextBlock Grid.Row="3" Text="Example 4" VerticalAlignment="Center"/>            <ComboBox Grid.Row="3" Grid.Column="1" ItemsSource="{Binding MyClassOptions}" SelectedValuePath="Age" SelectedValue="{Binding SelectedAge}" ItemTemplate="{StaticResource Example4ItemTemplate}" Margin="5"/>            <TextBlock Grid.Row="3" Grid.Column="2" Margin="10,5,5,0" VerticalAlignment="Center"><Run Text="Selected age: "/><Run Text="{Binding SelectedAge}"/></TextBlock>