레이아웃 확장 - WrapPanel

 

- WrapPanel : 영역에서 밀려나면 다음 행에 출력



"WrapPanel"컨트롤을 사용하기 위해서는 "Silverlight Control Toolkit"을 다운받아 설치해야 한다. 그 다음 아래그림과 같이 "도구상자"에서 "탭 추가"를 한 후, "항목추가"선택 - "Silverlight Component 탭"에서 "WrapPanel"체크박스에 체크한 후 '확인'버튼 눌러 추가한다.

[MainPage.xaml]

<UserControl

    xmlns:my="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit"  x:Class="RiaWrapPanel.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="LayoutRoot" Background="White">

        <StackPanel>

            <my:WrapPanel Width="250" Background="Blue" Orientation="Horizontal">

                <Button Content="버튼1" Width="100" Height="50"></Button>

                <Button Content="버튼2" Width="100" Height="50"></Button>

                <Button Content="버튼3" Width="100" Height="50"></Button>

                <Button Content="버튼4" Width="100" Height="50"></Button>

            </my:WrapPanel>

            <StackPanel Width="300" Height="100" Background="Yellow" Orientation="Horizontal">

                <Button Content="버튼1" Width="100" Height="50"></Button>

                <Button Content="버튼2" Width="100" Height="50"></Button>

                <Button Content="버튼3" Width="100" Height="50"></Button>

                <Button Content="버튼4" Width="100" Height="50"></Button>

            </StackPanel>

        </StackPanel>

    </Grid>

</UserControl> 

 

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

 

[실행결과]