【万里征程——Windows App开发】控件大集合1

添加控件的方式有多种，大家更喜欢哪一种呢？
1）使用诸如 Blend for Visual Studio 或 Microsoft Visual Studio XAML 设计器的设计工具。
2）在 Visual Studio XAML 编辑器中将控件添加到 XAML 标记中。
3）在代码中添加控件。当应用运行时会看到你在代码中添加的控件，但在 Visual Studio XAML 设计器中看不到。

前面我们已经用过了Grid、Button等控件，现在就来系统地看看关于控件的一些属性、事件等等。

毫无疑问第一步就是要来添加控件，那么添加控件有哪几种方式呢。前面我们都是直接在XAML中写的控件或者从工具箱中拖拽出来。其实还有2种，一种比较复杂但我们以后也会用到，那就是在C#后台代码中添加控件；还有一种就是在Blend for Visual Studio中拖拽控件了。后者的功能也非常强大，比如要使用动画之类的，这个设计器就能发挥作用了。

控件的属性相比大家都已经会用了，一来可以直接在XAML中添加属性，二来可以在属性视图中添加和修改属性。

这里写图片描述

如果要添加和修改事件呢，同样在属性视图中，点击右上角的闪电图标即可。如果要添加Click事件，那么在Click的输入框中输入好事件名称后直接按Enter即可。此时VS就会自动跳转到C#后台代码中，第一个参数sender是对处理程序所附加的对象的应用，第二参数是事件数据，它通常在签名中显示为e参数。

private void btnSetStyle_Click(object sender, RoutedEventArgs e)
{Button b = (Button)sender;b.Height = 400;b.Width = 320;
}

上面的这段代码这会将所点击的Button的高设置为400，宽设置为320；除了这种方式外，也可以按如下操作，其中btnSetStyle是当前Button的名字：

private void btnSetStyle_Click(object sender, RoutedEventArgs e)
{btnSetStyle.Height = 400;btnSetStyle.Width = 320;
}

除此之外，我们也可以不在XAML中定义Click事件，按照如下操作也可以达到相同的效果，它会将两个事件相互关联。

public MainPage()
{this.InitializeComponent();btnSetStyle.Click += new RoutedEventHandler(btnSetStyle_Click);
}private void btnSetStyle_Click(object sender, RoutedEventArgs e)
{btnSetStyle.Height = 400;btnSetStyle.Width = 320;
}

前面我们已经了解了如果添加控件、添加/修改属性、添加/修改事件。也了解一下控件的样式，虽然说到样式大家想到的可能是css。想必大家都玩过2048吧，游戏中有许多许多的方格，那么这些方格的样式会不会一个一个去定义呢，当然不是啦，可以直接用样式资源来定位到所有的Button。后面我们也会来实践一下如何写一个2048小游戏的。

以下是我写的2048里面的样式啦，

<Page.Resources><Style TargetType="Button"><Setter Property="FontWeight" Value="Bold"/><Setter Property="FontSize" Value="40"/><Setter Property="HorizontalAlignment" Value="Center"></Setter><Setter Property="VerticalAlignment" Value="Center"></Setter><Setter Property="Background" Value="Gray"></Setter><Setter Property="Width" Value="100"></Setter><Setter Property="Height" Value="100"></Setter><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="Button"><Grid x:Name="Grid" Background="Transparent"><Border x:Name="Border" Width="{TemplateBinding Width}" Height="{TemplateBinding Height}" Background="{TemplateBinding Background}" ><ContentPresenter x:Name="ContentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" HorizontalAlignment="Center"  VerticalAlignment="Center"/></Border></Grid></ControlTemplate></Setter.Value></Setter></Style>
</Page.Resources>

但是这里也有一个问题，如果我们有10个Button控件，却只想其中8个用到这些定义，另外2个想用另一种控件，那该怎么办呢？

将样式定义为资源，其实是有2中方式的。
一种就是直接用Style的TargetType属性来定义到所有的目标控件。
另一种则除了用TargetType属性外，还可以用x:key属性，然后再具体的控件中庸显式的关键字StaticResource来设置具体的Style属性。

<Page.Resources>     <Style TargetType="Button">              <Setter Property="FontStyle" Value="Oblique" /><Setter Property="FontSize" Value="20" /><Setter Property="BorderBrush" Value="Green" /><Setter Property="BorderThickness" Value="5" /><Setter Property="Foreground" Value="Orange" /><Setter Property="Height" Value="80"/><Setter Property="Width" Value="160"/></Style><Style x:Key="OtherStyle" TargetType="Button"><Setter Property="FontStyle" Value="Italic" /><Setter Property="FontSize" Value="16" /><Setter Property="Foreground" Value="Lavender" /><Setter Property="Height" Value="160"/><Setter Property="Width" Value="320"/><Setter Property="Opacity" Value="0.2"/></Style>                                                            
</Page.Resources>