上一节为大家简单介绍了如何使用WRS实现SilverLight和数据库交互，这节我们主要实现SilverLight自定义控件，通过自定义控件我们可以扩展微软提供的已有控件功能，或者自己创造独特控件，估计在看文的朋友们会觉得自定义控件难度很大，其实我们可以通过继承微软的控件类来实现我们的扩展。

        通过这篇文章我们主要实现一个自定义导航栏，封装好的控件可以分享给其他朋友，让更多的人分享自己的劳动果实。

        1.紧接着上一节项目，在解决方案上右键/添加/新建项目/SilverLight/SilverLight类库，我这里名称就叫"Controls"，在生成的新项目中进行操作：

       (1).删除默认生成的Class1.cs

       (2).新建文件夹，命名为:"Themes"，在此文件夹右键/添加/新建项/SilverLight/SilverLight资源字典，命名为"Generic.xaml"。

       这里要注意，第(2)步的命名必须是"Themes"文件夹和"Generic.xaml"文件，因为Generic.xaml文件里存放着自定义控件样式，而SilverLight会寻找这个文件用来加载默认样式。

       (3).在Controls项目上右键/添加类，我这里命名为"NavigateItem.cs"，接下来在Generic.xaml里添加这个控件的样式，代码如下，需要先添加命名空间，这里我已经添加好“xmlns:Local="clr-namespace:Controls"”,我们用这个类文件生成一个属于自己的菜单中按钮：

 
  
  1. <ResourceDictionary 
  2.     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"   
  3.     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
  4.     xmlns:Local="clr-namespace:Controls" 
  5.     > 
  6.       
  7. <!--导航栏*****************************************************************************************************************************--> 
  8.     <!--导航栏子项--> 
  9.     <Style TargetType="Local:NavigateItem"> 
  10.         <Setter Property="Template"> 
  11.             <Setter.Value> 
  12.                 <ControlTemplate TargetType="Local:NavigateItem"> 
  13.                     <Grid Cursor="{TemplateBinding Cursor}" Width="{TemplateBinding Width}" Height="{TemplateBinding Height}"> 
  14.                         <Border CornerRadius="10,10,0,0" x:Name="Container" Opacity="0.6"> 
  15.                             <Border.Background> 
  16.                                 <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
  17.                                     <GradientStop Color="#FF393939" Offset="1"/> 
  18.                                     <GradientStop Color="#FE434343"/> 
  19.                                 </LinearGradientBrush> 
  20.                             </Border.Background> 
  21.                         </Border> 
  22.                         <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
  23.                     </Grid> 
  24.                 </ControlTemplate> 
  25.             </Setter.Value> 
  26.         </Setter> 
  27.     </Style> 
  28. </ResourceDictionary> 
 
  
        现在已经定义好按钮样式，这里的ContentPresenter控件的Content属性可以赋值为文本或者图片、嵌套其他容器这个看个人需要，我这里只需要使用默认的文本。这样还不能显示咱的控件，还需要在代码中引用样式，接下来是NavigateItem.cs代码：
 
  
 
 
  
 
  
  1. using System;  
  2. using System.Net;  
  3. using System.Windows;  
  4. using System.Windows.Controls;  
  5. using System.Windows.Documents;  
  6. using System.Windows.Ink;  
  7. using System.Windows.Input;  
  8. using System.Windows.Media;  
  9. using System.Windows.Media.Animation;  
  10. using System.Windows.Shapes;  
  11.  
  12. namespace Controls  
  13. {  
  14.     public class NavigateItem:ContentControl  
  15.     {  
  16.    
  17.         public NavigateItem()  
  18.         {  
  19.             this.DefaultStyleKey = typeof(NavigateItem);  
  20.         }  
  21.     }  
  22. }  
 
  
        大家看到这个类继承自ContentControl，也可以继承自Control，构造函数里指示默认模版类型，指定类型后，SilverLight就会在Generic.xaml里找到这个样式。
 
  
        (4).到现在我们的自定义控件已经可以显示，接下来在janerui项目添加对Controls的项目引用，然后在MainPage.xaml里添加我们自己的控件：
 
  
 
 
  
 
  
  1. <UserControl x:Class="janerui.MainPage" 
  2.     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  3.     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
  4.     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
  5.     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
  6.     mc:Ignorable="d" 
  7.     xmlns:Local="clr-namespace:Controls;assembly=Controls" 
  8.     d:DesignHeight="300" d:DesignWidth="400"> 
  9.  
  10.     <Grid x:Name="LayoutRoot" Background="White"> 
  11.         <Local:NavigateItem Content="swk" Width="100" Height="30"/> 
  12.     </Grid> 
  13. </UserControl> 
 
  
        这里我们声明了我们刚刚自己定义的控件，赶紧生成浏览下，这时大家就看到自己封装的控件已经显示成功了。
 
  
        由于时间问题，今天就到这里，明天我会继续完成后续部分，公开Click事件等。