!!!UWP テンプレート [Universal Windows Platform][Visual Studio][C#][WPF] *以下のKindle本を参考に自分なりにメモ *非常にわかりやすい上に安い {{amazon B015V7Q4WO}} !!!MVVM プロジェクトの構成 !!エントリーポイント(App.xaml,App.xaml.cs) *App.xaml.cs が重要な起動処理となる !OnLaunchメソッド protected override void OnLaunched(LaunchActivatedEventArgs e) { Frame rootFrame = Window.Current.Content as Frame; // ウィンドウに既にコンテンツが表示されている場合は、アプリケーションの初期化を繰り返さずに、 // ウィンドウがアクティブであることだけを確認してください if (rootFrame == null) { // ナビゲーション コンテキストとして動作するフレームを作成し、最初のページに移動します rootFrame = new Frame(); rootFrame.NavigationFailed += OnNavigationFailed; if (e.PreviousExecutionState == ApplicationExecutionState.Terminated) { //TODO: 以前中断したアプリケーションから状態を読み込みます } // フレームを現在のウィンドウに配置します Window.Current.Content = rootFrame; } if (rootFrame.Content == null) { // ナビゲーション スタックが復元されない場合は、最初のページに移動します。 // このとき、必要な情報をナビゲーション パラメーターとして渡して、新しいページを //構成します rootFrame.Navigate(typeof(MainPage), e.Arguments); } // 現在のウィンドウがアクティブであることを確認します Window.Current.Activate(); } *アプリケーション通常起動時のエントリーポイント ::Window.Current.Content *メインウィンドウに表示されるコンテンツ *Window.Current.Content に Frameが設定されているか確認。されていなければ、Frameを生成し設定する。 ::Frame.Content *Frame.Content をチェックして何もなければ、MainPageに画面遷移 !!フォルダ構成 *以下のフォルダを作成 +Commons +Models +ViewModels +Views !!MainPage.xaml *デフォルトで作成されている MainPage.xaml を削除 *Views フォルダに、MainPage.xamlを作成(空白のページを追加) !!INotifyPropertyChanged *MVVMアプリを作成するためには、INotifyPropertyChanged の実装が必須となる。 *一般的には、以下のような基本クラスを作成し、実装負荷を下げる。 public class BindableBase : INotifyPropertyChanged { public event PropertyChangedEventHandler PropertyChanged; protected virtual bool SetProperty(ref T field, T value, [CallerMemberName] string propertyName = null) { if (Equals(field, value)) { return false; } field = value; this.RaisePropertyChanged(propertyName); return true; } protected virtual void RaisePropertyChanged([CallerMemberName] string propertyName = null) { this.PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName)); } } !!ICommand *http://sourcechord.hatenablog.com/entry/2015/08/26/002740 public class RelayCommand : ICommand { private readonly Action _execute; private readonly Func _canexecute; public event EventHandler CanExecuteChanged; public RelayCommand(Action execute) : this(execute, null) { } public RelayCommand(Action execute, Func canExecute) { if (execute == null) { throw new ArgumentNullException("execute"); } _execute = execute; _canexecute = canExecute; } public bool CanExecute(object parameter) { return (_canexecute == null) ? true : _canexecute(); } public void Execute(object parameter) { _execute(); } public void RaiseCanExecuteChanged() { CanExecuteChanged?.Invoke(this, EventArgs.Empty); } } public class RelayCommand : ICommand { private readonly Action _execute; private readonly Func _canExecute; public event EventHandler CanExecuteChanged; public RelayCommand(Action execute) : this(execute,null) { } public RelayCommand(Action execute, Func canExecute) { if (execute == null) { throw new ArgumentNullException("execute"); } _execute = execute; _canExecute = canExecute; } public bool CanExecute(object parameter) { return (_canExecute == null) ? true : _canExecute((T)parameter); } public void Execute(object parameter) { _execute((T)parameter); } public void RaiseCanExecuteChanged() { CanExecuteChanged?.Invoke(this, EventArgs.Empty); } } !!!アプリケーション構成 !!レイアウト ::ナビゲーション *https://msdn.microsoft.com/windows/uwp/layout/navigation-basics ::レイアウト *https://msdn.microsoft.com/windows/uwp/layout/layouts-with-xaml ::既定のコントロール スタイルとテンプレート *https://msdn.microsoft.com/ja-jp/library/windows/apps/mt299122.aspx !!SplitView *SplitViewコントロールのPaneにメニューを配置し、Content部分にFrameを配置し画面遷移を行う形が一般的 !/Views/MainPage.xaml *MainPage内のFrameにアクセスする必要があるため、Frameをpublicで公開 !/App.xaml.cs *App.OnLaunched() protected override void OnLaunched(LaunchActivatedEventArgs e) { var mainPage = Window.Current.Content as MainPage; // ウィンドウに既にコンテンツが表示されている場合は、アプリケーションの初期化を繰り返さずに、 // ウィンドウがアクティブであることだけを確認してください if (mainPage == null) { // ナビゲーション コンテキストとして動作するフレームを作成し、最初のページに移動します mainPage = new MainPage(); mainPage.RootRrame.NavigationFailed += OnNavigationFailed; if (e.PreviousExecutionState == ApplicationExecutionState.Terminated) { //TODO: 以前中断したアプリケーションから状態を読み込みます } // フレームを現在のウィンドウに配置します Window.Current.Content = mainPage; } if (mainPage.RootRrame.Content == null) { // TODO:初期画面に遷移 } // 現在のウィンドウがアクティブであることを確認します Window.Current.Activate(); } !真っ白い画面が表示されることを確認 {{ref_image uwp_mvvm_mainpage.jpg}} !ハンバーガーボタン(/Views/MainPage.xaml) *StaticResource から取得できる、SymbolThemeFontFamily の E700に定義されている。 {{ref_image uwp_mvvm_hambager_menu.jpg}} ::{x:Bind} マークアップ拡張 *https://msdn.microsoft.com/ja-jp/library/windows/apps/mt204783.aspx *Windows 10 では、{Binding} に代わり、{x:Bind} マークアップ拡張が新たに提供されています。{x:Bind} では、{Binding} の機能のいくつかが省略されていますが、{Binding} よりも短い時間および少ないメモリで動作し、より適切なデバッグをサポートしています。 *WPF データ