余小章 @ 大內殿堂

還是繼延用上篇例子，定義一下類別，本篇則增加 LoginTime 欄位

 

private BindingList<Member> _Group = null;
public BindingList<Member> Group
{
    get
    {
        if (this._Group == null)
        {
            this._Group = new BindingList<Member>();
            this._Group.Add(new Member { ID = 1, Name = "余小章", Age = 12, Phone = "0806449", LoginTime = new DateTime(2010, 1, 2) });
            this._Group.Add(new Member { ID = 2, Name = "gy", Age = 15, Phone = "2", LoginTime = new DateTime(2012, 3, 3) });
            this._Group.Add(new Member { ID = 3, Name = "Raymond", Age = 13, Phone = "3", LoginTime = new DateTime(2009, 11, 22) });
            this._Group.Add(new Member { ID = 4, Name = "Kobe", Age = 32, Phone = "43", LoginTime = new DateTime(2013, 8, 23) });
        }
        return _Group;
    }
    set
    {
        _Group = value;
        OnPropertyChanged("Group");
    }
}

---

VS2010的資料來源拖拉物件進來

 

 

完成後就會看到以下的架構

 

 

資料來源裡的結構VS2010預設已經綁定了一些控制項，你可以自行變更控制項

 

 

 

 

然後把想要呈現的資料拖拉到設計版面裡

來觀察一下VS2010幫我們產生了什麼XAML結構

1.很明顯的，以下是拖拉資料來源產生出來的東西

<Window.Resources>
    <CollectionViewSource x:Key="memberListViewSource" d:DesignSource="{d:DesignInstance local:MemberList, CreateList=True}" />
    <CollectionViewSource x:Key="memberListGroupViewSource" Source="{Binding Path=Group, Source={StaticResource memberListViewSource}}" />
</Window.Resources>

2.然後就是DataGrid的繫結，我們可以觀察到這個DataGrid的繫結來源是StaticResource memberListGroupViewSource

<Grid DataContext="{StaticResource memberListGroupViewSource}">
    <DataGrid AutoGenerateColumns="False" EnableRowVirtualization="True" Height="200" HorizontalAlignment="Left" ItemsSource="{Binding}" Margin="5,12,0,0" Name="groupDataGrid" RowDetailsVisibilityMode="VisibleWhenSelected" VerticalAlignment="Top" Width="400">…以下省略

 

---

還沒完!!!上面的工作只是做繫結而已並還沒有丟資料，類別也還沒初始化

重新規劃一下UI

然後我在Loaded事件裡加入以下程式碼，主要目的就是把資料丟回 CollectionViewSource ，因為dataGrid綁定的物件是 CollectionViewSource ，_MemberList 就是 CollectionViewSource 的來源，_MemberList 一變更就應該要通知UI更新資料。

 

CollectionViewSource _Source = null;
MemberList _MemberList = new MemberList();
private void Window_Loaded(object sender, RoutedEventArgs e)
{
    this._Source = this.FindResource("memberListGroupViewSource") as CollectionViewSource;
    this._Source.Source = this._MemberList.Group;
}

 

為了測試則將加入一筆新資料

 

private void btnAdd_Click(object sender, RoutedEventArgs e)
{
    Member member = new Member();
    member.Age = int.Parse(this.txtAge.Text);
    member.ID = int.Parse(this.txtID.Text);
    member.Name = this.txtName.Text;
    member.Phone = this.txtPhone.Text;
    member.LoginTime = (DateTime)this.dateLoginTime.SelectedDate;
    this._MemberList.Group.Add(member);
}

 

 

執行結果如下：資料來源新增資料，UI也跟著更新了。

 

 

---

飯粒下載：WpfBindingDemo.zip

若有謬誤，煩請告知，新手發帖請多包涵

Microsoft MVP Award 2010~2017 C# 第四季
Microsoft MVP Award 2018~2022 .NET