Thứ ba, ngày 21 tháng 11 năm 2017

WPF – Master-Detail Binding

Ngày đăng: 26/3/2012, 8:38:3PM | Lượt xem: 3,414
Hot!

Một master-detail binding sử dụng nhiều control để hiển thị dữ liệu theo quan hệt một-nhiều(như Category > Product, Book > Chapter, …). Trong ví dụ này, tôi sẽ minh họa cách tạo mô hình binding này với hai control hiển thị dữ liệu kiểu collection là Combo Box và ListBox.

Một master-detail binding sử dụng nhiều control để hiển thị dữ liệu theo quan hệt một-nhiều(như Category > Product, Book > Chapter, …). Trong ví dụ này, tôi sẽ minh họa cách tạo mô hình binding này với hai control hiển thị dữ liệu kiểu collection là Combo Box và ListBox.

Combo Box và ListBox hỗ trợ hai property là DisplayMemberPath và SelectedValuePath để xác định giá trị sẽ hiển thị và giá trị cần lấy của mỗi phần tử khi được chọn. Nhờ đó bạn có thể lấy được giá trị của phần tử được chọn qua property SelectedValue.

Để làm ví dụ, bạn tạo hai lớp Category và Product trong code-behind như sau:

class Category
{
    public string Name { get; set; }
    public ObservableCollection<Product> Products { get; set; }

    public Category(string name, params Product[] products)
    {
        this.Name = name;
        Products = new ObservableCollection<Product>();
        foreach (Product  p in products)
        {
            Products.Add(p);
        }
    }

}
class Product
{

    public int ID { get; set; }
    public string Name { get; set; }

    public Product(int id, string name)
    {
        this.ID = id;
        this.Name = name;
    }
}

Trong constructor của Window1, tạo dữ liệu và gán giá trị cho DataContext:

public partial class Window1 : Window
{
    public Window1()
    {
        InitializeComponent();
        ObservableCollection<Category> categories = new ObservableCollection<Category>();

        categories.Add(new Category("Antivirus",
                                    new Product(1, "Norton"),
                                    new Product(2, "Kaspersky"),
                                    new Product(3,"AVG" )));

        categories.Add(new Category("Browsers",
                                    new Product(4, "FireFox"),
                                    new Product(5,"Chrome"),
                                    new Product(6,"Opera")));

        categories.Add(new Category("Game",
                                    new Product(7, "Need for Speed"),
                                    new Product(8, "Age of Empires" ),
                                    new Product(9, "Road Rash")));

        this.DataContext = categories;

    }
}

Đoạn mã XAML sau tạo một Combo Box chứa danh sách các Category, sau đó tạo một ListBox binding đến property SelectedItem.Products của Combo Box (mỗi property ComboxBox.SelectedItem sẽ có giá trị là một đối tượng Category). Tương tự như vậy trong ListBox, bạn cũng có thể lấy được phần tử được chọn để hiển thị lên cửa sổ.

<?xml version="1.0" encoding="utf-8"?>
<Window
    x:Class="MasterDetailBinding.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MasterDetailBinding"
    Height="300" Width="300">
    <StackPanel Margin="6">
        <TextBlock Text="Categories:" />
        <ComboBox
            x:Name="cboCategories"
            ItemsSource="{Binding}"
            DisplayMemberPath="Name"
            SelectedIndex="0" />
        <TextBlock Text="Products:" />
        <ListBox
            x:Name="lstProducts"
            ItemsSource="{Binding ElementName=cboCategories, Path=SelectedItem.Products}"
            DisplayMemberPath="Name"
            SelectedValuePath="ID"
            SelectedIndex="0" />

        <GroupBox Header="Details" Padding="5">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition/>
                    <ColumnDefinition/>
                </Grid.ColumnDefinitions>

                <TextBlock Text="Product's ID"/>
                <TextBlock Grid.Column="1"
                           Text="{Binding ElementName=lstProducts, Path=SelectedValue}" />
                <TextBlock Text="Product's Name" Grid.Row="1"/>
                <TextBlock Grid.Row="1"  Grid.Column="1"
                           Text="{Binding ElementName=lstProducts, Path=SelectedItem.Name}" />
            </Grid>
        </GroupBox>
    </StackPanel>
</Window>

Kết quả:

http://yinyangit.wordpress.com

Related articles
 Chia sẻ qua: 
Hot!
Ý kiến bạn đọc

These items will be permanently deleted and cannot be recovered. Are you sure?

Gallery

image

Maecenas viverra rutrum pulvinar

Maecenas viverra rutrum pulvinar! Aenean vehicula nulla sit amet metus aliquam et malesuada risus aliquet. Vestibulum rhoncus, dolor sit amet venenatis porta, metus purus sagittis nisl, sodales volutpat elit lorem…

Read more

Text Links

Thiết kế logo chuyên nghiệp Insky
DAFABET
W88 w88b.com/dang-ky-tai-khoan-w88
W88
ca do bong da online
Copyright © 2011 - 2012 vietshare.vn by phamkhuong102@gmail.com doanhkisi2315@gmail.com. All rights reserved.