言归正传。从九月十一号面试通过开始接触WPF到现在已经有不到两个礼拜的时间了。C#了解个差不多，但是不深入，一些概念还需强化。因为不是从最初开始记录的，所以现在觉得最简单的HelloWorld开始写起也没必要，因为对于读者来说，不至于要进入这个领域还不会连这个都不会写；对于我个人来说，这只是一个日志性文件。
开门见山。之前已经说过，如果接触过Android开发的话，WPF很容易上手。其思想一致，都是以标签语言实现界面布局，以编程语言实现内部逻辑，以自家提供的框架实现二者整合。单从浅层编程来看，二者几乎完全相同。基于以上，我们要学习的就两点，一，编程语言，这是基础，二，XAML的布局。这两者之间的独立性很强，即便是一点都不懂C#语言的，只用XAML就可以写出令人惊叹的效果。接下来主要讲XAML。
都是初学者，大部分的代码都是根据学来的比着葫芦画瓢。
概括讲，XAML要实现的就是布局，控件，效果。
拿简单的HTML举例：
<HTML>
<head>
</head>
<body>
<body>
<HTML>
<html></html>之间夹着两个元素，<head></head>和<body></body>，而这两个元素之间既可以添加标签，也可以直接写内容。
对比XAML
<Grid>
<Button Fill="Red"/>
<Grid>
<Grid></Grid>为网格布局标签，中间夹着一个<Button></Button>.
大概框架就是这样，标签内部套标签。这个例子体现了上面所说的三点：布局--<Grid></Grid>;控件--<Button/>;效果--Fill="Red"。
一.布局
布局就是讲设计的界面中的各个元素如何排列显示。布局有以下几种
Grid 网格布局，可以定义行数，列数，基本和HTMl中的table用法相似；
UniformGrid 统一网格布局，会自动根据内部元素个数将面板等分为n^2块，比如有三个元素，就会分2*2块，有五个元素就会分3*3块
StackPanel 栈嘛，线性排列，可以设置Orientation属性为垂直线性Vertical或者水平线性Horizontal；
DockPanel 停靠布局，举例说Windows的任务栏（我不知道具体实现是不是这个，但是行为和这一样）一般是在窗口下面，也就是任务栏的DockPanel.Dock="Bottom"，左边停靠就是DockPanel.Dock="Left"，还有Right，Top等。
WrapPanel 包裹元素，只包裹好内部元素即可。
Canvas 画布，在上面可以用绝对布局的方式来定位。
详细的代码和效果
整体以Grid布局，分为了两行三列，每个格子里面放一种布局
<Window x:Class="CSDN.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="500" Width="1000">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<!--Grid布局-->
<Grid Grid.Column="0" Grid.Row="0">
<!--定义两行三列-->
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<!-- end定义两行三列-->
<!--放入Button并设置位置-->
<Button Content="Button11" Grid.Column="0" Grid.Row="1"/>
<Button Content="Button12" Grid.ColumnSpan="2" Grid.Column="0"/>
<Button Content="Button13" Grid.RowSpan="2" Grid.Column="2"/>
<!--end放入Button并设置位置-->
</Grid>
<!--Grid布局-->
<!--StackPanel布局-->
<StackPanel Orientation="Vertical" Grid.Column="1" Grid.Row="0">
<Button Content="Button21"/>
<Button Content="Button22"/>
<Button Content="Button23"/>
<Button Content="Button24"/>
</StackPanel>
<!--endStackPanel布局-->
<!--DockPanel布局(添加了LastChildFill属性）-->
<DockPanel LastChildFill="True" Grid.Column="2" Grid.Row="0">
<Button Content="Button31" DockPanel.Dock="Bottom"/>
<Button Content="Button32" DockPanel.Dock="Bottom"/>
</DockPanel>
<!--endDockPanel布局(添加了LastChildFill属性）-->
<!--WrapPanel布局(注意WrapPanel）只是包括button区域，其他都是整个大方块-->
<WrapPanel Grid.Column="0" Grid.Row="1">
<Button Content="Button41"/>
<Button Content="Button42"/>
</WrapPanel>
<!--endWrapPanel布局-->
<!--Canvas布局-->
<Canvas Grid.Column="1" Grid.Row="1">
<Button Content="Button51" Canvas.Left="39" Canvas.Top="93"/>
<Button Content="Button52" Canvas.Left="149" Canvas.Top="79"/>
<Button Content="Button53" Canvas.Left="117" Canvas.Top="156"/>
</Canvas>
<!--endCanvas布局-->
<!--UniformGrid布局-->
<UniformGrid Grid.Column="2" Grid.Row="1">
<Button Content="Button61"/>
<Button Content="Button62"/>
</UniformGrid>
<!--end UniformGrid布局（注意只有两个元素，但是也划分了四个区域）-->
</Grid>
</Window>
效果
http://my.csdn.net/my/album/detail/1657295#1657295
谁能告诉我怎么发图片啊，添加了怎么不显示啊
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
