new wings

プログラミングを始めたので、感想を書いてくと思います

MetroRadianceの使い方メモ

Markdownの使い方を知った。スクロールバーは出ないのか?

MetroRadiance導入の最低限必要なこと

MetroRadeianceの導入

.Net Flamework の変更

.Net Flamework 4.6 以上を選択する。

MetroRadianceパッケージの追加

NuGetで以下のパッケージをインストールする

  • MetroRadiance
  • MetroRadiance.Chrome.Externals
  • MetroRadiance.Core
  • MetroRadiance.Chrome

なお、 MetroRadiance.CoreMetroRadiance.Chrome の二つは MetroRadiance のインストールと同時にインストールされる

コードの書き換え

App.xaml.cs

using System;
using System.Windows;
using MetroRadiance.UI;

namespace Metro_test4
{
    /// <summary>
    /// App.xaml の相互作用ロジック
    /// </summary>
    public partial class App : Application
    {
        protected override void OnStartup(StartupEventArgs e)
        {
            base.OnStartup(e);
            
            //アプリを終了するため
            this.ShutdownMode = ShutdownMode.OnMainWindowClose;
            //起動時の色指定
            ThemeService.Current.Register(this, Theme.Windows, Accent.Windows);
        }
    }
}

App.xaml

<Application x:Class="Metro_test4.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:Metro_test4"
             StartupUri="MainWindow.xaml">
    <Application.Resources>
        <ResourceDictionary>
            <BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter"/>
 
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/MetroRadiance;component/Styles/Controls.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MetroRadiance;component/Themes/Dark.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MetroRadiance;component/Themes/Accents/Blue.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>

MainWindow.xaml.cs

using System;
 
namespace Metro_test4
{
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class MainWindow
    {
        public MainWindow()
        {
            InitializeComponent();
        }
    }
}

MainWindow.xaml

<controls:MetroWindow x:Class="Metro_test4.MainWindow"
                      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                      xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
                      xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
                      xmlns:chrome="http://schemes.grabacr.net/winfx/2014/chrome"
                      xmlns:controls="http://schemes.grabacr.net/winfx/2014/controls"
                      Title="MainWindow" 
                      Width="525" Height="350" 
                      FontFamily="Segoe UI"
                      Background="{DynamicResource ThemeBrushKey}"
                      UseLayoutRounding="True"
                      TextOptions.TextFormattingMode="Display">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
            <RowDefinition Height="23" />
        </Grid.RowDefinitions>
        <Border Grid.Row="0" controls:MetroWindow.IsCaptionBar="True">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition />
                    <RowDefinition Height="8" />
                </Grid.RowDefinitions>
                <controls:CaptionIcon Grid.Column="0">
                    <Ellipse Width="18" Height="18" Fill="{DynamicResource ActiveForegroundBrushKey}" />
                </controls:CaptionIcon>
                <TextBlock Grid.Column="1" Grid.Row="0" Text="{Binding RelativeSource={RelativeSource AncestorType={x:Type Window}}, Path=Title}"
                           TextTrimming="CharacterEllipsis" Foreground="{DynamicResource ForegroundBrushKey}" FontFamily="Segoe UI Light" FontSize="18"
                           Margin="3,0,0,0" VerticalAlignment="Center" />
                <controls:SystemButtons Grid.Column="2" Grid.Row="0" VerticalAlignment="Top" />
            </Grid>
        </Border>
        <Grid Grid.Row="2" Background="{DynamicResource AccentBrushKey}">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>
            <controls:ResizeGrip Grid.Column="1" />
        </Grid>
    </Grid>
</controls:MetroWindow>