My Silverlight系列（5）—— Silverlight控件介绍之TabControl

核心提示：TabControl这个控件想必大家都不陌生，无论是WinForm、Asp.net还是WPF中，My Silverlight系列（5）—— Silverlight控件介绍之TabControl，这个通用控件都是非常有用的，笔者最近在学习Silverlight中也应用到这个控件，原因不明，，发觉它与WPF中的TabCon

TabControl这个控件想必大家都不陌生，无论是WinForm、Asp.net还是WPF中，这个通用控件都是非常有用的。

笔者最近在学习Silverlight中也应用到这个控件，发觉它与WPF中的TabControl是不尽相同的——这个事情让我非常的不解，主要是因为这个控件并不会涉及到安全因素，没有理由和WPF不一样（或许是我的类库版本有问题，也请大家有兴趣帮我验证一下）。

WPF的TabControl有ItemTemplate与ContentTemplate两个属性，前者可以为TabItem设置Header的模板，后者可以为TabItem设置Content模板。然而，在Silverlight的TabControl中，只有ItemTemplate这个属性（还有一个Template属性，但是一旦设置，就无法显示Header了）。于是退而求其次的，我只好为TabItem设置模板，幸运的是TabItem有HeaderTemplate与ContentTemplate两个属性，然而ContentTemplate并不Work，原因不明。。。

　1<UserControl xmlns:my="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Extended"　 x:Class="SilverlightApplication1.Page"
　2　　　 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
　3　　　 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
　4　　　 Width="800" Height="600">
　5　　　 <Grid x:Name="LayoutRoot" Background="White">
　6　　　　　　　 <Grid.RowDefinitions>
　7　　　　　　　　　　　 <RowDefinition Height="30"/>
　8　　　　　　　　　　　 <RowDefinition Height="*"/>
　9　　　　　　　 </Grid.RowDefinitions>
10　　　　　　　 <Button x:Name="myButton" Content="Click" Click="myButton_Click"/>
11　　　　　　　 <my:TabControl x:Name="tab" Grid.Row="1">
12　　　　　　　　　　　 <my:TabControl.Resources>
13　　　　　　　　　　　　　　　 <Style x:Key="style" TargetType="my:TabItem">
14　　　　　　　　　　　　　　　　　　　 <!--Template for the headers (buttons)-->
15　　　　　　　　　　　　　　　　　　　 <Setter Property="HeaderTemplate">
16　　　　　　　　　　　　　　　　　　　　　　　 <Setter.Value>
17　　　　　　　　　　　　　　　　　　　　　　　　　　　 <DataTemplate>
18　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 <Grid Margin="3">
19　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 <Grid.ColumnDefinitions>
20　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 <ColumnDefinition Width="*" />
21　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 <ColumnDefinition Width="Auto" />
22　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 </Grid.ColumnDefinitions>
23　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 <TextBlock Text="{Binding HeaderText}"
24　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 Grid.Column="0"
25　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 FontSize="11"
26　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 Margin="5 0 5 0"
27　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 VerticalAlignment="Center" />
28　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 <Button Content="x" Click="Button_Click"
29　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 FontSize="11"
30　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 VerticalAlignment="Center"
31　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 Grid.Column="1"
32　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 Width="16"
33　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 Height="16" Tag="{Binding}"/>
34　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 </Grid>
35　　　　　　　　　　　　　　　　　　　　　　　　　　　 </DataTemplate>
36　　　　　　　　　　　　　　　　　　　　　　　 </Setter.Value>
37　　　　　　　　　　　　　　　　　　　 </Setter>
38　　　　　　　　　　　　　　　　　　　 <!--Template for the content, however, it doesn't work-->
39　　　　　　　　　　　　　　　　　　　 <Setter Property="ContentTemplate">
40　　　　　　　　　　　　　　　　　　　　　　　 <Setter.Value>
41　　　　　　　　　　　　　　　　　　　　　　　　　　　 <DataTemplate>
42　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 <Grid>
43　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 <TextBlock Text="{Binding ContentText}"/>
44　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　 </Grid>
45　　　　　　　　　　　　　　　　　　　　　　　　　　　 </DataTemplate>
46　　　　　　　　　　　　　　　　　　　　　　　 </Setter.Value>
47　　　　　　　　　　　　　　　　　　　 </Setter>
48　　　　　　　　　　　　　　　 </Style>
49　　　　　　　　　　　 </my:TabControl.Resources>
50　　　　　　　 </my:TabControl>
51　　　 </Grid>
52</UserControl>
53