MahApps.Metro のインストールと基本設定

WPF アプリケーションにおいて、見た目を簡単にモダンなデザインにできる `MahApps.Metro` というライブラリがあるので、その導入方法です。 ## インストール方法 `MahApps.Metro` は NuGet でインストールできます。 GUI でも出来ますが、パッケージ マネージャー コンソールのほうが楽なので、そちらでインストールしました。 「パッケージ マネージャー コンソール」は以下から開くことができます。 [ツール] > [NuGet パッケージ マネージャー] > [パッケージ マネージャー コンソール] MahApps.Metro をインストールするには以下のコマンドを入力します。 ```sh PM> Install-Package MahApps.Metro ``` インストールが成功すると「QuickStart」の画面が表示されます。 ## 基本設定 ### メインウィンドウの Xaml を修正 `MainWindow.xaml` を開いて、`Window` タグに以下を追加します。 ```xml xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro" ``` 続いて、`<Window` を `<Controls:MetroWindow` に変更します。 **変更前** ```xml <Window x:Class="WpfApplicationTest.MainWindow" ``` **変更後** ```xml <Controls:MetroWindow x:Class="WpfApplicationTest.MainWindow" ``` ### メインウィンドウのコードビハインドを修正 `MainWindow.xaml.cs` を開いて、基底クラスを `Window` から `MetroWindow` に変更します。 **変更前** ```cs public partial class MainWindow : Window ``` **変更後** ```cs using MahApps.Metro.Controls; public partial class MainWindow : MetroWindow ``` 以上で基本的な設定は完了です。 ## 組込みスタイルの適用 ### App.xaml の修正 `App.xaml` を開き、`ResourceDictionary` に以下を追加します。 ```xml <ResourceDictionary.MergedDictionaries> <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" /> <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" /> <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colors.xaml" /> <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/blue.xaml" /> <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" /> </ResourceDictionary.MergedDictionaries> ``` `blue.xaml` や `BaseLight.xaml` を変更することでデザインを変えることができます。 ## 参考URL - http://mahapps.com/guides/quick-start.html - http://qiita.com/kabosu/items/11fa400bdd82395f59fb - https://mseeeen.msen.jp/avoid-to-convert-case-automatically-in-wpf-with-mahapps/