WPF页面搭建

在WPF项目中，页面布局其实并不是很难，只要规划好页面的布局格式就很好搭建了，使用页面布局控件去自由搭建（布局控件：是可以容纳多个控件或者嵌套其他布局的控件，用于在UI上组织和排列控件，Grid、StackPanel、DockPanel等控件都属此类，它们拥有共同的父类 为Panel。）你可以把控件想象成一个容器，容器里装的东西就是它的内容。控件的内容可以直接是 数据，也可以是控件。当控件的内容还是控件的时候就形成了控件的嵌套。我们把被嵌套的 控件称为子级控件，这种控件嵌套在UI布局时尤为常见。因为允许控件嵌套，所以WPF的 UI会形成一个树形结构。
如图中的样式排布，被分成了三行，可以自己定义想要的内容和效果，分成三行后，我没有用到列去定义它们的列宽，而是用了画布排布的方式设置了左右的距离来变换设定它们相对的位置，从而达到了我自己所需要的效果。下图还有一个动画效果，当鼠标移入图标的时候会发生一个放大的效果，是指定由开始值到达结束值所需的时间，便可形成一个简单的动画。由于图中的图标有七个，所以样式的话是统一的时候可以用到资源样式，目的为了实现对象的重复使用，有助于应用维护的一致性。


下面的代码是，定义动画效果的页面资源代码，页面资源需要用到K值，是为了当你锁定你所需要的样式，在当前的页面中哪个地方需要用到这个样式的话就可以把K值绑定上去就可以了，这里用到的是从一个值突然变成另一值的动画(关键帧动画)，当我的鼠标移入到图标的时候图标就用0.2秒从宽高100的放大成了，宽高105的图标，鼠标出来之后图标又缩小成了宽高100的值，在这个效果下，图标就形成了一种动画效果。
Storyboard是动画的基本单位，控制动画的播放，停止，暂停等操作，动画声明过之后，需要使用EventTrigger（事件触发器）触发。

<UserControl.Resources>
<Style x:Key="de" TargetType="Button">
<Setter Property="Cursor" Value="Hand"/>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="False"/>
//鼠标移入
<EventTrigger RoutedEvent="MouseEnter">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation To="105" Duration="0:0:0.2" Storyboard.TargetProperty="Width"/>
<DoubleAnimation To="105" Duration="0:0:0.2" Storyboard.TargetProperty="Height"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
//鼠标离开
<EventTrigger RoutedEvent="MouseLeave">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation To="100" Duration="0:0:0.2"  Storyboard.TargetProperty="Width"/>
<DoubleAnimation To="100" Duration="0:0:0.2" Storyboard.TargetProperty="Height"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Style.Triggers>
</Style>
</UserControl.Resources>