C# WPF에서 MVVM 패턴을 사용할 때 INotifyPropertyChanged 인터페이스에 대하여

해당 포스팅은 개인적으로 C# WPF를 공부하면서 익힌 내용을 기억에 남기기 위한 작업의 일환으로 작성된 글로서
일부 내용에 오류가 있을 수도 있으니 참고하시기 바랍니다.

 

 

C#WPF에서 MVVM패턴으로 
프로그래밍 할때 InotifyPropertyChanged
인터페이스의 역할에 대해
알아보자.

 

반응형

내용 요약

 

C# WPF에서 MVVM 패턴을 사용할 때, 

INotifyPropertyChanged 인터페이스는

데이터 바인딩을 지원하는 중요한 역할을 한다.

이 인터페이스는 속성 값이 변경될 때 알림을 제공하여

UI가 자동으로 업데이트되도록 한다.

이제 INotifyPropertyChanged가 작동하는 방식과

이벤트 발생에서 실제 함수가 호출되기까지의 흐름에 대해 자세히 알아보자.

 

설명 및 예시

---

INotifyPropertyChanged 인터페이스 개요

 

INotifyPropertyChanged 인터페이스는 단순히 하나의 이벤트를 정의한다.

public interface INotifyPropertyChanged
{
    event PropertyChangedEventHandler PropertyChanged;
}

 

이 인터페이스를 구현하는 클래스는 PropertyChanged 이벤트를 발생시켜야 한다.

이 이벤트는 속성 값이 변경될 때마다 호출되며,

변경된 속성의 이름을 이벤트 인수로 전달한다.

 

---

PropertyChangedEventHandler 대리자

 

PropertyChanged 이벤트는 PropertyChangedEventHandler 대리자를 사용하며,

이 대리자는 다음과 같이 정의된다.

public delegate void PropertyChangedEventHandler(object sender, PropertyChangedEventArgs e);

 

 

PropertyChangedEventArgs 클래스는 변경된 속성의 이름을 포함한다.

public class PropertyChangedEventArgs : EventArgs
{
    public PropertyChangedEventArgs([CallerMemberName] string propertyName = null)
    {
        PropertyName = propertyName;
    }

    public virtual string PropertyName { get; }
}

 

---

 

INotifyPropertyChanged 구현

 

INotifyPropertyChanged 인터페이스를 구현하는 클래스는 

PropertyChanged 이벤트를 발생시키는 메서드를 포함해야 한다.

일반적으로 OnPropertyChanged라는 메서드를 정의하여 이를 처리한다.

 

다음은 INotifyPropertyChanged를 구현한 예제이다.

using System.ComponentModel;
using System.Runtime.CompilerServices;

public class Person : INotifyPropertyChanged
{
    private string _name;
    private int _age;

    public event PropertyChangedEventHandler PropertyChanged;

    public string Name
    {
        get => _name;
        set
        {
            if (_name != value)
            {
                _name = value;
                OnPropertyChanged();
            }
        }
    }

    public int Age
    {
        get => _age;
        set
        {
            if (_age != value)
            {
                _age = value;
                OnPropertyChanged();
            }
        }
    }

    protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

 

---

이벤트 발생에서 함수 호출까지의 흐름

 

1.속성 값 변경
Name 또는 Age 속성의 값이 변경되면, set 접근자에서 OnPropertyChanged 메서드가 호출된다.

 

2.OnPropertyChanged 메서드 호출

OnPropertyChanged 메서드는 PropertyChanged 이벤트를 발생시킨다.

이 메서드는 CallerMemberName 특성을 사용하여 호출된 속성의 이름을 자동으로 가져온다.

3.PropertyChanged 이벤트 발생

PropertyChanged 이벤트가 발생하면, 이 이벤트에 등록된 모든 이벤트 핸들러가 호출된다.

이벤트 핸들러는 PropertyChangedEventArgs 객체를 통해 변경된 속성의 이름을 전달받는다.

4.UI 업데이트

WPF 데이터 바인딩 시스템은 PropertyChanged 이벤트를 수신하고, 
변경된 속성의 이름을 확인하여 해당 속성에 바인딩된 UI 요소를 업데이트한다.

 

---

예제 코드

다음은 Person 클래스의 인스턴스를 ViewModel로 사용하여 UI를 업데이트하는 예제이다.

 

# ViewModel
using System.ComponentModel;

public class PersonViewModel : INotifyPropertyChanged
{
    private Person _person;

    public event PropertyChangedEventHandler PropertyChanged;

    public PersonViewModel()
    {
        _person = new Person { Name = "John Doe", Age = 30 };
    }

    public string Name
    {
        get => _person.Name;
        set
        {
            if (_person.Name != value)
            {
                _person.Name = value;
                OnPropertyChanged();
            }
        }
    }

    public int Age
    {
        get => _person.Age;
        set
        {
            if (_person.Age != value)
            {
                _person.Age = value;
                OnPropertyChanged();
            }
        }
    }

    protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

# View (XAML)
<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="200" Width="400">
    <Grid>
        <StackPanel>
            <TextBox Text="{Binding Name, UpdateSourceTrigger=PropertyChanged}" Width="200" Margin="10"/>
            <TextBox Text="{Binding Age, UpdateSourceTrigger=PropertyChanged}" Width="200" Margin="10"/>
        </StackPanel>
    </Grid>
</Window>

# View Code-Behind
using System.Windows;

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        DataContext = new PersonViewModel();
    }
}

 

---

설명
1.ViewModel

PersonViewModel 클래스는 Person 객체를 포함하고 있으며,

Name과 Age 속성을 통해 Person 객체의 속성에 접근한다.

속성 값이 변경될 때마다 OnPropertyChanged 메서드를 호출하여 PropertyChanged 이벤트를 발생시킨다.

2.View

XAML 파일에서 TextBox의 Text 속성을 Name과 Age 속성에 바인딩한다.

UpdateSourceTrigger=PropertyChanged를 사용하여 속성 값이 변경될 때마다 즉시 업데이트되도록 한다.

3.View Code-Behind

MainWindow 클래스의 생성자에서 DataContext를 PersonViewModel 인스턴스로 설정한다.

이 예제는 INotifyPropertyChanged 인터페이스를 사용하여 

속성 값이 변경될 때 UI가 자동으로 업데이트되는 과정을 보여준다.

이를 통해 MVVM 패턴에서 데이터 바인딩을 효율적으로 구현할 수 있다.