[C#/WINUI3/.NET6] RelativePanel 엘리먼트 사용하기

■ RelativePanel 엘리먼트를 사용하는 방법을 보여준다.

▶ MainWindow.xaml


<?xml version="1.0" encoding="utf-8"?>
<Window x:Class="TestProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="TestProject">
    <RelativePanel
        Width="300"
        Height="300"
        Background="Beige">
        <Rectangle Name="rectangle1"
            Width="50"
            Height="50"
            Fill="Red" />
        <Rectangle Name="rectangle2"
            RelativePanel.RightOf="rectangle1"
            Margin="10 0 0 0"
            Width="50"
            Height="50"
            Fill="Blue" />
        <Rectangle Name="rectangle3"
            RelativePanel.AlignRightWithPanel="True"
            Fill="Green"
            Height="50"
            Width="50" />
        <Rectangle Name="rectangle4"
            RelativePanel.Below="rectangle3"
            RelativePanel.AlignHorizontalCenterWith="rectangle3"
            Margin="0 10 0 0"
            Fill="Yellow"
            Height="50"
            Width="50" />
    </RelativePanel>
</Window>

<?xml version="1.0" encoding="utf-8"?>

<Window x:Class="TestProject.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Title="TestProject">

<RelativePanel

Width="300"

Height="300"

Background="Beige">

<Rectangle Name="rectangle1"

Width="50"

Height="50"

Fill="Red" />

<Rectangle Name="rectangle2"

RelativePanel.RightOf="rectangle1"

Margin="10 0 0 0"

Width="50"

Height="50"

Fill="Blue" />

<Rectangle Name="rectangle3"

RelativePanel.AlignRightWithPanel="True"

Fill="Green"

Height="50"

Width="50" />

<Rectangle Name="rectangle4"

RelativePanel.Below="rectangle3"

RelativePanel.AlignHorizontalCenterWith="rectangle3"

Margin="0 10 0 0"

Fill="Yellow"

Height="50"

Width="50" />

</RelativePanel>

</Window>

TestProject.zip