WPF: Simple Data Binding (P6)

Thay đổi Object –> Thay đổi UI

Trong phần trước chúng ta thấy rằng, rõ ràng UI không nhận biết được sự thay đổi đối với Object. Chúng ta phải binding lại giữ liệu cho Controls mỗi khi Object thay đổi. Do đó, sẽ hiệu quả hơn nếu như UI có khả năng cập nhật mỗi khi Object thay đổi. Để thực hiện việc cập nhập giao diện UI khi có thay đổi đối với Object thì chúng ta cần phải sử dụng Event. Để raise một event khi một property của object thay đổi, chúng ta thực thi INotifyPropertyChanged

...

using System.ComponentModel; // INotifyPropertyChanged

namespace WithoutBinding

{

    public class Person: INotifyPropertyChanged

    {

        private string firstName;

        public string FirstName 

        {

            get { return firstName; }

            set

            {

                if (firstName == value) { return; }

                firstName = value;

                Notify("FirstName");

            } 

        }

        private string lastName;

        public string LastName 

        {

            get { return lastName; }

            set

            {

                if (lastName == value) { return; }

                lastName = value;

                Notify("LastName");

            } 

        }

        private string fullName;

        public string FullName 

        {

            get { return fullName; }

            set

            {

                if (fullName == value) { return; }

                fullName = value;

                Notify("FullName");

            }          

        }

        public Person(string firstName, string lastName)

        {

            FirstName = firstName;

            LastName = lastName;

            FullName = firstName + " " + lastName;

        }

        #region INotifyPropertyChanged Members

        // INotifyPropertyChanged Members

        public event PropertyChangedEventHandler PropertyChanged;

        protected void Notify(string propName)

        {

            if (this.PropertyChanged != null)

            {

                PropertyChanged(this, new PropertyChangedEventArgs(propName));

            }

        }

        #endregion

    }

}

Chúng ta sử dụng Event này trong UI như sau:

public Window1()

        {

            InitializeComponent();       

            //Display lên form controls

            this.txtFirstName.Text = person.FirstName;

            this.txtLastName.Text = person.LastName;

            this.tblFullName.Text = person.FullName;

            person.PropertyChanged += new System.ComponentModel.PropertyChangedEventHandler(person_PropertyChanged);

        }

        void person_PropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)

        {

            switch (e.PropertyName)

            {

                case "FirstName":

                    this.txtFirstName.Text = person.FirstName;

                    break;

                case "LastName":

                    this.txtLastName.Text = person.LastName;

                    break;

                case "FullName":

                    this.tblFullName.Text = person.FullName;

                    break;

            }

        }

        private void btnDisplay_Click(object sender, RoutedEventArgs e)

        {            

            //Ghi nhận lại Full name

            person.FullName = person.FirstName + " " + this.txtMiddleName.Text + " " + person.LastName;

            //Binding lại controls

            //this.tblFullName.Text = person.FullName;

            //Show message box khi click vào button

            MessageBox.Show("Hello " + person.FullName);

        }

Thay đổi UI –> Thay đổi Object

Việc thay đổi Object theo sự thay đổi UI chúng ta đã thường sử dụng bằng cách implemement Event của control như Text_Changed …