[WinUI 3][Border] Border の基本使用方法

Border

2022.05.15

Border は、各種コントロールに枠線を付けるためのコントロールです。

この記事では Border の基本使用方法について説明をします。

公式サイト情報はコチラを参照してください。

Border の基本使用例

環境
Border の基本使用方法
1. XAML の例
2. C# の例
WinUi Tips

環境

開発環境	Microsoft Visual Studio Enterprise 2019 Version 16.11.5
Framework	Microsoft .NET Framework Version 4.8.04161

Border の基本使用方法

XAML で枠線を使用するには <Border> を使用します。

枠線の色は BorderBrush プロパティで、枠線の太さは BorderThickness プロパティで指定します。

XAML の例

以下は、Border を使用して TextBlock に枠線を付ける例です。

枠線の色は Gray に、枠線の太さは 3 に設定しています。

XAML の例

<Window
    x:Class="WinUISample.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:WinUISample"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <StackPanel x:Name="myStackPanel" Orientation="Vertical" HorizontalAlignment="Left" >

        <Border BorderBrush="Gray" BorderThickness="3">
            <TextBlock Text="テキストブロック" />
        </Border>
        
    </StackPanel>
</Window>

C# の例

以下は C# から枠線の設定をする例です。

先ほどの例を C# にしたものを以下に示します。

線の太さ BorderThickness には、Thickness 構造体のインスタンスを、BorderBrush には SolidColorBrush のインスタンスを指定します。

public MainWindow()
{
    this.InitializeComponent();

    double thickness = 3.0;

    myBorder.BorderThickness = new Thickness(thickness);
    myBorder.BorderBrush = new SolidColorBrush(Colors.Gray);
}

Border の基本使用例