08.SilverLight3 - Layout - Grid
- Row, Column : UI 가 배치될 열의 인덱스 지정
- RowSpan, ColumnSpan : UI 가 배치될 열과 열의 개수 지정하여 병합
Grid를 사용하여 표 형태로 출력한 예제입니다.
MainPage.xaml |
[그림 8-1] <Grid x:Name="ctlist" ShowGridLines="True"> <!--2행2열의 표 형태인 레이아웃--> <Grid.RowDefinitions> <RowDefinition Height="50"></RowDefinition> <RowDefinition Height="100"></RowDefinition> <RowDefinition Height="Auto"></RowDefinition> </Grid.RowDefinitions>
<!--몇 대 몇i으로 설정 가능하다. 2로 하면 *크기가 2칸으로 잡아진다--> <Grid.ColumnDefinitions> <ColumnDefinition Width="2*"></ColumnDefinition> <ColumnDefinition Width="3*"></ColumnDefinition> </Grid.ColumnDefinitions>
<TextBlock x:Name="lbl" Text="1행 1열" FontSize="30"></TextBlock> <Button x:Name="btn" Content="1행 2열" FontSize="30" Grid.Row="0" Grid.Column="1" Grid.RowSpan="2"></Button> <TextBox x:Name="txt" Text="2행 1열" FontSize="30" Grid.Row="1" Grid.Column="0" VerticalAlignment="Center"></TextBox> <Button x:Name="cmd" Content="3행" Foreground="Yellow" Grid.Row="2" FontSize="30" Grid.ColumnSpan="2" VerticalAlignment="Bottom" HorizontalAlignment="Right"></Button> </Grid>
VerticalAlignment : 텍스트의 크기 만큼 잡는것 |