Storage / Data: DataBinding với ComboBox DataTemplate trên Windows Store Apps (C #)

Yêu cầu: Windows 10 và Visual Studio 2015

- DataBinding: Hiển thị dữ liệu thông qua Binding

<TextBox Text="{Binding}"/>
<ComboBox ItemsSource="{Binding}"/>
<ComboBox ItemsSource="{Binding} ">
<ComboBox.ItemTemplate>
    <DataTemplate>
        <StackPanel>
            <TextBlock Text="{Binding Name}" ></TextBlock>
        </StackPanel>
    </DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>

- Example : Sử dụng DataBinding để hiển thị dữ liêu TextBox, ComboBox

MainPage.xaml

Windows Store 2017

<Page
    x:Class="DataBindingComboBox.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:DataBindingComboBox"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <TextBox x:Name="txtEmployee" FontSize="24" Text="{Binding}" HorizontalAlignment="Left" Margin="105,94,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Height="84" Width="482"/>
        <ComboBox x:Name="cbEmployees" FontSize="20" ItemsSource="{Binding}" HorizontalAlignment="Left" Margin="105,274,0,0" VerticalAlignment="Top" Width="836" Height="60"/>
        <ComboBox x:Name="cbEmployee1" FontSize="20" ItemsSource="{Binding}" HorizontalAlignment="Left" Margin="105,390,0,0" VerticalAlignment="Top" Width="836" Height="60">
            <ComboBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel>
                        <TextBlock Text="{Binding Name}" FontSize="20"></TextBlock>
                    </StackPanel>
                </DataTemplate>
            </ComboBox.ItemTemplate>
        </ComboBox>
    </Grid>
</Page>

Employee.cs

Windows Store 2017

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace DataBindingComboBox
{
    class Employee
    {
        public string Name { get; set; }
        public string Address { get; set; }
        public DateTime Doj { get; set; }

        public override string ToString()
        {
            return String.Format("Name: {0}. Address: {1}. Date of joining: {2}", Name, Address, Doj);
        }
    }

}

MainPage.xaml.cs

Windows Store 2017

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

// The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=234238

namespace DataBindingComboBox
{
    /// <summary>
    /// An empty page that can be used on its own or navigated to within a Frame.
    /// </summary>
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();

            Employee objEmp = new Employee()
            {
                Name = "Peter Pan",
                Address = "Ton That Thuyet",
                Doj = new DateTime(2017, 1, 23)
            };
            //txtEmployee.Text = objEmp.ToString();
            txtEmployee.DataContext = objEmp;

            List<Employee> listEmps = new List<Employee>() {
                new Employee() {
                    Name="A",
                    Address="Ha Noi",
                    Doj=new DateTime(2016,1,1)
                },
                new Employee() {
                    Name="B",
                    Address="Ha Nam",
                    Doj=new DateTime(2017,1,1)
                },
                new Employee() {
                    Name="C",
                    Address="Thai Binh",
                    Doj=new DateTime(2016,12,19)
                }
            };
            cbEmployees.DataContext = listEmps;
            cbEmployee1.DataContext = listEmps;

        }

    }
}

- Chạy chương trình