레이아웃 - StackPanel 요소(컨트롤)

<StackPanel /> 컨트롤


- 다른 요소들을 수평 또는 수직으로 나열
- Orientation 속성 : 수평/수직 설정
      - Vertical : 수직 정렬(기본값)
      - Horizontal : 수평 정렬




-------------------------------------------------------------------------------------




[MainPage.xaml]

<UserControl x:Class="RiaStackPanel.MainPage"

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

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

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    mc:Ignorable="d"

    d:DesignHeight="300" d:DesignWidth="400">

    <Grid x:Name="ctlLayout" Background="SkyBlue" Width="400" Height="300" ShowGridLines="True">

        <Grid.RowDefinitions>

            <RowDefinition></RowDefinition>

            <RowDefinition></RowDefinition>

        </Grid.RowDefinitions>

        <Grid.ColumnDefinitions>

            <ColumnDefinition></ColumnDefinition>

        </Grid.ColumnDefinitions>

       

        <StackPanel Background="Orange">

            <Button Content="One" HorizontalAlignment="Left" Width="100"></Button>

            <Button Content="Two" HorizontalAlignment="Center" Width="100"></Button>

            <Button Content="Three" VerticalAlignment="Bottom" HorizontalAlignment="Right"></Button>

        </StackPanel>

        <StackPanel Background="Pink" Orientation="Horizontal" Grid.Row="1">

            <Button Content="Four" VerticalAlignment="Top" Width="100" Height="100"></Button>

            <Button Content="Five" HorizontalAlignment="Center" VerticalAlignment="Stretch"></Button>

            <Button Content="Six" VerticalAlignment="Bottom" Width="100"></Button>

        </StackPanel>

    </Grid>   

</UserControl>

 

 

-------------------------------------------------------------------------------------

 

[실행결과]