Template10을 이용해서 UWP 앱 개발하기 Part2 MVVM

지난 포스트에서 Template10(이하 T10)에 대한 간단한 소개를 했습니다. 이번부터는 본격적으로 어떤 내용들이 있는지 살펴 보려고 합니다. 그 중에서 가장 먼저 T10에서만 사용가능한 Controls들에 대해서 살펴 보도록 하겠습니다.

MVVM Pattern을 사용하는 개발자를 위한 안내

Template10을 이용해서 UWP 앱 개발하기 Part1

1. 참고

Template10

MVVM

2. Template10에 적용된 MVVM 알아보기

Template10은 MVVM Pattern을 이용해서 앱을 만들기 위한 기본적인 내용들을 포함하고 있습니다. 또한, 그러한 내용은 Override를 통해서 사용자가 원하는 스타일로 변경할 수도 있습니다.

3. BindableBase

이 클래스는 Binding에 기본이되는 INotifyPropertyChanged 인터페이스를 상속 받았으며, 값이 변경된 것을 알려야 할 필요가 있는 프로퍼티에 다음과 같은 형태로 이용할 수 있습니다.

private string _Value = "Default";
public string Value
{
    get
    {
        return _Value;
    }
    set
    {
        Set(ref _Value, value);
    }
}

4. DelegateCommand

이 클래스는 사용자의 Interaction을 ViewModel에 전달하는 역할을하는 ICommand 인터페이스를 상속 받았습니다. 버튼 컨트롤에 Command와 바인딩을 하는 커맨드를 생성할 때 다음과 같은 형태로 사용할 수 있습니다.

DelegateCommand _SaveCommand;

public DelegateCommand SaveCommand => _SaveCommand ?? (_SaveCommand = new DelegateCommand(ExecuteSave, CanSave));

private void ExecuteSave()
{
    _dataService.Save();
}

private bool CanSave()
{
    return _dataService.IsValid();
}

커맨드를 만드는 형태는 여러가지가 있을 수 있습니다. 음..제가 자주 사용하는 방법은 ICommand를 프로퍼티 타입으로 선언하는 방법인데,  이렇게 하면 CommandParameter 존재 여부를 구분하지 않아도 되서 편리하기 때문입니다.

5 ViewModelBase

이 클래스는 페이지 네비게이션을 뷰모델에서 사용하기 위한 INavigable 인터페이스, BinadableBase를 상속 받았습니다. 또한, 각 페이지의 세션 데이터를 저장할 수 있는 기능도 제공하고 있으며, 사용자가 ViewModelBase를 상속 받아 새로운 클래스를 만들어서 사용하면, 원하는 기능을 추가할 수도 있습니다.

public virtual IDispatcherWrapper Dispatcher { get; set; }
public virtual INavigationService NavigationService { get; set; }
public virtual IStateItems SessionState { get; set; }

public virtual Task OnNavigatingFromAsync(NavigatingEventArgs args)
public virtual Task OnNavigatedFromAsync(IDictionary<string, object> pageState, bool suspending)
public virtual Task OnNavigatedToAsync(object parameter, NavigationMode mode, IDictionary<string, object> state)

6. MVVM Frameworks

다른 MVVM 프레임 워크를 활용하려면 Template10.Mvvm.ViewModelBase에서 상속 받거나 Template10.Services.NavigationService.INavigable을 구현하면 OnNavigatedTo / From을 뷰모델에서 사용할 수 있습니다.