WPFデザインOSS　Modern UI

2014/1/10 追記あり

Modern UI for WPF

f:id:mk3008net:20141022221843p:plain

<a href="https://mui.codeplex.com/">Modern UI for WPF</a>

見た目、挙動（ページ遷移可）ともにいい感じです。

MVVMで利用できるかは未確認。まぁ大丈夫でしょう。

Modern UI Icons

<a href="http://modernuiicons.com/">Modern UI Icons</a>

アイコンだけ使いたいならこっちの方がいいかも。XAMLファイルで提供されています。なおライセンスはCC。

2015/1/4 追記

Modern UI for WPF application by example ( NavigationService – MVVM ) | typeof(saramgsilva) こちらのサンプルが参考になります（といってもまだ理解しきれていない）。

後日まとめるとして、注意点

初期設定が必要。C#はテンプレートがあるようですが、VB.NETはテンプレはないので「My first Modern UI app (manually)」を参考にして作業する。
ちょっと手間ですが躓くところなし。
起動はStartUpURIで指定しなければならない。StartUpイベントでModernWindowクラスをインスタンスしてShowとしてはダメらしい。
ちなみに手動でShowをしてしまうと中身が何もないWindowだけが立ち上がってしまう。理由は不明。

    /// こうすればいいのかな…
    var wnd = new ModernWindow {
      Style = (Style)App.Current.Resources["BlankWindow"],
      Content = null    // your content here
    };
    wnd.Show();

画面遷移（ページ遷移）は「xaml」ファイルを指定する。遷移したxamlではLocatorクラスを通じてDataContextのVMを埋める。具体的にはコレ「DataContext="{Binding StepsViewModel, Source={StaticResource Locator}}"」ね。

    <UserControl x:Class="ModernUIForWPFSample.Navigation.Views.StepsControl"
                 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
                 d:DesignHeight="300"
                 d:DesignWidth="600"
                 DataContext="{Binding StepsViewModel, Source={StaticResource Locator}}"
                 mc:Ignorable="d">
    </UserControl>

Locater（ViewModelLocator）はApp.xamlで指定している。具体的にはコレ「<vm:ViewModelLocator x:Key="Locator" d:IsDataSource="True" xmlns:vm="clr-namespace:ModernUIForWPFSample.Navigation.ViewModel" />」ね。

    <Application x:Class="ModernUIForWPFSample.DefaultModernUI.App" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" StartupUri="MainWindow.xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" d1p1:Ignorable="d" xmlns:d1p1="http://schemas.openxmlformats.org/markup-compatibility/2006">
      <Application.Resources>
        <ResourceDictionary>
          <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="/FirstFloor.ModernUI;component/Assets/ModernUI.xaml" />
            <ResourceDictionary Source="/FirstFloor.ModernUI;component/Assets/ModernUI.Light.xaml" />
          </ResourceDictionary.MergedDictionaries>
          <vm:ViewModelLocator x:Key="Locator" d:IsDataSource="True" xmlns:vm="clr-namespace:ModernUIForWPFSample.Navigation.ViewModel" />
        </ResourceDictionary>
      </Application.Resources>
    </Application>

ViewModelLocator にStepsViewModelプロパティがある。サンプルでは以下のコードで表現。

ServiceLocator.Current.GetInstance<StepsViewModel>();

ViewModelLocator に画面遷移を集約してやればよさそうなことはわかる。が、引数を渡したい場合もある。どうやってやるのかは未確認
- メニュー遷移＝空画面＝引数なし＝固定でいい＝ViewModelLocator経由で遷移
- 詳細遷移＝親画面で選択された情報を引き継ぐ必要ある＝引数あり＝現在画面のコマンドで画面遷移？（Locaterを使わない）