周末充电之WPF（二 ） .窗口的布局

登录窗口布局：[ Grid 布局 -Grid.RowDefinitions / Grid.ColumnDefinitions]

 

代码如下：

 1 <Window x:Class="login.MainWindow"
 2         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 3         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 4         Title="MainWindow" Height="200" Width="400">
 5     <Grid>
 6         <Grid.RowDefinitions>
 7             <RowDefinition></RowDefinition>
 8             <RowDefinition></RowDefinition>
 9             <RowDefinition></RowDefinition>
10         </Grid.RowDefinitions>
11         <Grid.ColumnDefinitions>
12             <ColumnDefinition></ColumnDefinition>
13             <ColumnDefinition></ColumnDefinition>
14         </Grid.ColumnDefinitions>
15         <!--默认在第0行0列-->
16         <!--HorizontalAlignment:水平方向对齐   VerticalAlignment：垂直方向对齐-->
17         <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="username:"></TextBlock>
18         <TextBox Grid.Column="1" Name="uid" Margin="5"></TextBox>
19         <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="password:" Grid.Row="1"></TextBlock>
20         <PasswordBox Grid.Column="1" Name="pwd"   Margin="5" Grid.Row="1"></PasswordBox>
21         <Button Content="login" Grid.Row="2" Margin="10" Click="Button_Click_1"></Button>
22         <Button Content="cancer" Grid.Row="2" Margin="10" Grid.Column="1"></Button>
23     </Grid>
24 </Window>

 Menu / ToolBar 布局：

 1 <Window x:Class="toolbar.MainWindow"
 2         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 3         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 4         Title="MainWindow" Height="350" Width="525">
 5     <Grid>
 6         <DockPanel>
 7             <Menu DockPanel.Dock="Top">
 8                 <MenuItem Header="打开">
 9                     <MenuItem Header="删除"></MenuItem>
10                 </MenuItem>
11                 <MenuItem Header="编辑"></MenuItem>
12             </Menu>
13             <ToolBar DockPanel.Dock="Top">
14                 <Button>
15                     <Button.Content>
16                         <Image Source="s.png" Width="16"></Image>
17                     </Button.Content>
18                 </Button>
19 
20                 <Button>
21                     <Button.Content>
22                         <Image Source="c.png" Width="16"></Image>
23                     </Button.Content>
24                 </Button>
25                 <CheckBox>
26                     <Image Source="cc.png"  Width="16"></Image>
27                 </CheckBox>
28             </ToolBar>
29             <TextBox DockPanel.Dock="Bottom"></TextBox>
30         </DockPanel>
31     </Grid>
32 </Window>

如上代码你会发现在为控件设置图标按钮时，会有两种写法  xx.Content  或者直接去除写 <Image...></Image>  ，其实这两个是相同的。

posted @ 2015-05-31 12:03  许大虾  阅读(302)  评论(0)  编辑  收藏  举报