.Net Project/SilverLight 3.0

06장) 실버라이트 WrapPanel 과 StackPanel 비교

래곤 2009. 11. 25. 16:28
반응형
-  WrapPanel
  WrapPanel은 Stack Panel처럼 자신 엘리먼트를 수평이나 수직으로 배치할 때 사용합니다.
  WrapPanel의 Wrap은 컴퓨터 용어로써, '다음 행으로 넘어가다'라는 뜻으로 가지고 있습니다.

- 마이크로소프트 실버라이트 툴킷 설치하기
  www.silverlight.net -> GetStard 에서 툴킷 설치.... 후 추가 완료 한다

- WrapPanel 와 StrackPanel 비교


  StackPanel은 레이블 벗어 나게 되면 그대로 가서 보이지 않게 되지만
  WrapPanel은 벗어나더라도 다음줄로 자동으로 이동하여 화면에 표시 된다
 

<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="300"
                          Background
="Green" Orientation="Horizontal">

                <Button x:Name="btnResult4"
                         
 Content="WrapPanel"
                          
 Width="100" Height="50"  ></Button>

                <Button x:Name="btnResult5" Content="WrapPanel"
                        
 Width="100" Height="50"  ></Button>

                <Button x:Name="btnResult6" Content="WrapPanel"
                        
 Width="100" Height="50"  ></Button>

                <Button x:Name="btnResult7" Content="WrapPanel"
                        
 Width="100" Height="50"  ></Button>

            </my:WrapPanel>

           

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

                <Button x:Name="btnResult" Content="StackPanel"
                          Width="100" Height="50"  ></Button>

                <Button x:Name="btnResult1" Content="StackPanel"
                        
 Width="100" Height="50"  ></Button>

                <Button x:Name="btnResult2" Content="StackPanel"
                        
 Width="100" Height="50"  ></Button>

                <Button x:Name="btnResult3" Content="StackPanel"
                        
 Width="100" Height="50"  ></Button>

            </StackPanel>

       </StackPanel>

    </Grid>

</UserControl> 




반응형