Modern UI for WPFのデフォルトレイアウトを変更する方法
どーも。panjaです。
最近WPFを触っています。
WPFはWinFormsに変わるユーザーインターフェースシステムでなんかかっこいいことが出来そうな感じのものです。
Windows Presentation Foundation - Wikipedia
UIのライブラリ(違う？フレームワーク？)としてModern UI for WPF(MUI)を使用しています。
github.com
あるアプリの作成にMUIを使用していたのですが、どーにもデフォルトのレイアウトが気に入らない！と思ったので変更する方法を調べてみました。
今回はその結果を紹介してみます。
手順は以下の通りです。
- Modern UI for WPF(MUI)をダウンロードしてきます。GitHub - firstfloorsoftware/mui: Modern UI for WPF
- ダウンロードしたものの中に「FirstFloor.ModernUI.sln」が入っているので開きます。
- 「$(SolutionDir)¥FirstFloor.ModernUI¥Themes¥ModernWindow.xaml」を開きます。
- 29行目(2017/01/25現在)の
<ControlTemplate TargetType="controls:ModernWindow">
から197行目の
</ControlTemplate>
の中でMUIのテンプレートプロジェクトのメインウィンドウであるModernWindowのレイアウトを決定しているので、変更したい項目を探し出して好きなように変更する。
5. ソリューションをビルドする
これでOKです。
あとは、新しいテンプレートを使用したいプロジェクトの参照に先ほどビルドしたFirstFloor.ModernUI.dll追加すれば使用できるようになります。
以下に、私が実際に行った変更を載せておきます。
具体的には下の画像の赤枠のスペースを無くす変更を行いました。
(青色のRectangleを目一杯広げたページを表示しています。赤枠はGimpで追加しました。)
ここに表示されるページに関する変更は「ModernWindow.xaml」の160、161行目
<!-- content frame -->
<controls:ModernFrame x:Name="ContentFrame" Grid.Row="3" Grid.RowSpan="2" Margin="42,8,16,16" Source="{Binding ContentSource, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}" ContentLoader="{TemplateBinding ContentLoader}"/>で行います。
赤枠のスペースを無くすためには、ここに設定してある「Margin="42,8,16,16"」を好きな値に変更してあげれば変更完了です。
今回は「Margin="5,0,5,5"」に変更しました。
結果は以下のようになりました。
はい。変更できました。
まだまだわからないことだらけのWPF。
今後も忘備録的にまとめていきたいと思います。
内容に誤りなどありましたら是非コメントよろしくお願いします。
