반응형

WPF의 디자인 패턴 중 하나인 MVVM. 이름부터 어렵다.

 

Model - View - ViewModel의 각 약자로.

쉽게 설명하자면

UI를 담당하는 View (eg. view.XAML)와 코드비하인드를 담당하는 VM(ViewModel)과 데이터 모델이 포함된 Model를 서로 분리하여 개발함으로써 디자인적 요소와 코드쪽 개발을 효율을 높이는 디자인 패턴이다.

 

MVVM 패턴으로 적용하면서 가장크게 바뀐게 바로 바인딩(Binding)이다.

 

Binding이라 함은 뜻 그대로 UI의 요소와 코드비하인드의 요소를 하나로 묶어주는 것이다.

 

자세한 설명은 구글링을 통하면 쉽게 나온다.

 

MVVM을 구현하는 방법은 여러 방법이 있지만, 프로젝트 규모가 크거나 뷰 갯수가 많아질 경우 처음부터 기틀을 잘 마련해야 나중에 코드를 뒤엎는 불상사를 막을 수 있다.

 

여기서는 Resource Directory를 이용한 방법을 간단히 적어본다.

 

1. 프로젝트내에 ResourceDirectory(한국어판에는 리소스사전)을 추가

2. 아래 처럼 DataTemplate를 이용하여 View와 ViewModel을 연결한다.

    <DataTemplate DataType="{x:Type vm:SettingVM}">
        <view:SettingView />
    </DataTemplate>

 

추가한 ResourceDirectory를 app.xaml에 기입한다.

    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/Presentations/Views/ResourceDictionary.xaml" />
                
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>


3. 실제 해당 뷰를 보여질 영역에는 아래와 같이 추가해준다.

CurrentView는 페이지 또는 UC 등이 보여지는 컨텐츠 영역을 가리키는 ViewModel object이다.

CurrentView에 별도로 선언된 SettingVM instance를 넣어주면 해당 뷰로 전환이 된다.

        public object CurrentView
        {
            get { return _currentView; }
            set
            {
                _currentView = value;
                OnPropertyChanged("CurrentView");
            }
        }

 

해당 컨텐츠가 보여질 영역은 xaml에서 아래와 같이 입력한다.

 <ContentControl x:Name="Pages" Content="{Binding CurrentView}" />

 

 

4. 주의점:

- MainWindow는 Resource Directory에서 따로 선언하지 않고, Datacontext를 통해 vm을 연결한다.

+ Recent posts