黑马程序员--WPF学习笔记二-----WPF常用页面布局

------- Windows Phone 7手机开发、.Net培训、期待与您交流！ -------

1.XAML 页面中常用的 的几个布局容器 :StackPanel\Grid\DockPanel
2.StackPanel 栈布局 :
StackPanel 栈布局 --( 通过 Orientation 的 Horizontal 或者 Vertical 来控制水平还是垂直排列 ) 其运用地方 , 如 :button 按钮只能有一个 content 属性设置 , 通过 StackPanel" 占位 " ，可以设置多个。

<Button>
                        <Button.Content>
                                <StackPanel Orientation= "Vertical">
                                        <Image Source= "a.jpg"></Image>
                                        <TextBlock Text= "hi"></TextBlock>
                                </StackPanel>
                        </Button.Content>
                </Button>

3.DockPanel固定面板布局 ：
     在里面的控件可以随着面板的变换而变化，应用举例如下：

        <Grid>
                <DockPanel>
                <Menu    DockPanel.Dock="Top" HorizontalAlignment="Left"    Height="26" Margin="0,0,0,0" VerticalAlignment="Top" Width="264">
                        <MenuItem Header="文件">
                                <MenuItem Header="打开">
                                        <MenuItem Header="1.txt"></MenuItem>
                                        <MenuItem Header="2.txt"></MenuItem>
                                        <MenuItem Header="3.txt"></MenuItem>
                                </MenuItem>
                                <MenuItem Header="保存"></MenuItem>
                                <MenuItem Header="另存为"></MenuItem>
                                <MenuItem Header="退出"></MenuItem>
                        </MenuItem>
                        <MenuItem Header="编辑">
                                <MenuItem Header="复制"></MenuItem>
                                <MenuItem Header="粘贴"></MenuItem>
                        </MenuItem>
                </Menu>
                        <TextBox    TextWrapping="Wrap" DockPanel.Dock="Bottom"    ScrollViewer.VerticalScrollBarVisibility="Auto"></TextBox>
                </DockPanel>
        </Grid>

4.Grid 网格布局 :
       使用网格布局 , 使用拖动控件到向指定的位置 , 在 grid 中控制控件位置的是其 margin 属性 .
margin 有四个值 :left\top\right\bottom, 其代表距离父控件的左上右下的距离。
举例 :  定义 3 行 4 列以及在其中放置控件

< Grid >
                         < Grid.RowDefinitions >
                                 < RowDefinition > </ RowDefinition >
                                 < RowDefinition > </ RowDefinition >
                                 < RowDefinition > </ RowDefinition >
                         </ Grid.RowDefinitions >
                         < Grid.ColumnDefinitions >
                                 < ColumnDefinition > </ ColumnDefinition >
                                 < ColumnDefinition > </ ColumnDefinition >
                                 < ColumnDefinition > </ ColumnDefinition >
                                 < ColumnDefinition > </ ColumnDefinition >                                
                         </ Grid.ColumnDefinitions >
                         < TextBlock Grid.Row ="1" Grid.Column ="1" VerticalAlignment ="Center" Text ="(1,1)" > </ TextBlock >                        
     < Image Source ="1.jpg" Grid.Row ="3" Grid.Column ="0" Grid.ColumnSpan ="2" > </ Image >
< Image Source ="1.jpg" Grid.Row ="0" Grid.Column ="0" Grid.RowSpan ="2" > </ Image >
                 </ Grid >

小应用 , 创建连连看布局 , 可以使用 Grid 布局 , 其思路 :
1. 生产 10*10 的一个 grid

2. 生产 10*10 个图片 Image, 随即指定他们的 Source 图片路径
3. 动态创建控件对象

 

------- Windows Phone 7手机开发、.Net培训、期待与您交流！ -------