设计一个silverlight的Button控件--silverlight(银光)学习（1）

       在www.silverlight.net上看到了制作一个silverlight 控件的视频，遗憾的是视频里没有讲怎么设计这个控件。于是追踪到作者的blog里下载到了他的代码，结果发现他的控件代码写得不完美。如果文字过长就会超出控件的边框。于是重新设计了下。
     效果如下:
     
     在讲怎么设计这个控件前，我把这个silverlight控件和asp.net里用户自定义控件做下类比.
userControl.ascx文件是用户自定义控件的皮肤文件，后台逻辑代码写在.cs里。而 silverlight控件的皮肤文件是.xaml文件，后台逻辑代码可以用.js文件，也可以用.cs 文件。
   
    废话不多说了，我们动手设计吧。首先建立一个silverlight 类库项目:
 

 项目建好后，删除里面默认的一个Class1.cs文件，添加一个silverlight控件。


然后把下列代码粘贴到.xaml文件里。

>

这段代码在vs2008里直接看不到效果，用blend2可以看到效果。


 熟悉"Flash"设计的朋友会发现这个界面是有几个层组成的，包括了黑色的底色，白色的边框层，还有玻璃效果的一层，还有个文本层，还有一起上下分割两个色彩的层。

 后台的核心逻辑代码如下:
   

  这样一个控件就设计好了，那么如果使用这个控件呢？
 我们再添加一个 silverlight Project 。
 
 我们在这个项目添加上先前建的控件库项目的引用。
 然后打开page.xaml文件对应的后台文件page.xaml.cs文件，在page_loaded事件里
 加上如下代码：
 

 1 double top = 100;
 2            
 3            double left = 20;
 4
 5            SilverControls.txtBoxControl txtbox = new SilverControls.txtBoxControl();
 6
 7            txtbox.ButtonText = "Hello!";
 8
 9            txtbox.SetValue<double>(Canvas.TopProperty, top);
10
11            txtbox.SetValue<double>(Canvas.LeftProperty, left);
12
13            this.Children.Add(txtbox);
14

然后保存，在浏览器里查看textpage.html页面就可以了。
源代码如下：
/Files/wangergo/silverlightControlSample.rar

 www.80back.com版权所有，首发cnblogs.com转载请著名出处。