下面就是它的一些演示截图。
首先是缩放，旋转和透明处理：
然后是文字水印处理：
然后是使用Ink的涂鸭：
相信做为一个相册（图片浏览）的基本功能已经没什么问题了。
下面来看一下这个DEMO的类图，如下：
上图中的左半部用红框标识的区域是其控件设计类，因为本DEMO中所使用的控件如：按钮，滑动条，复选框等均未使用Silverlight中所提供的控件，而是自己绘制并定义事件。因此这是我对该DEMO感兴趣的另一个原因。而右侧则是一些工具类或图片处理类，如处理图片移动的MovableImage和TextBlock移动的
MovableTextBlock等。 下面先简要介绍一下其中的button按钮控件的设计思路。因为其继承自buttonBase，所以有必要先看一下buttonBase的代码声明，下面是xaml中的内容：
< ControlTemplate xmlns ="http://schemas.microsoft.com/clIEnt/2007"
xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml" >
GrID x:name ="Part_Root" MouseEnter ="btnClearMouseEnter" MouseLeave ="btnClearMouseLeave"
MouseleftbuttonDown ="btnClearMouseDown" MouseleftbuttonUp ="btnClearMouseUp"
GrID.Resources
Storyboard ="Part_MouseEnter" /> ="Part_MouseDown" ="Part_MouseUp" ="Part_MouseLeave" </ Rectangle ="Part_BackgroundRect" TextBlock ="Part_Caption" ="Part_ForegroundRect" ="Part_HighlightRect" GrID
ControlTemplate
从上面代码可以看出其采用控件模版的方式进行定义。但其鼠标在按钮上移入移出等状态的Storyboard（故事板）并未进行定义。而肯体的实现被放在了相应的子类(button.xaml和Repeatbutton.xaml)进行实现。下面就是其中的button.xaml内容：
MouseleftbuttonDown
colorAnimation Duration ="00:00:00.25" To ="#3DFFFFFF" Storyboard.Targetname ="Part_HighlightRect"
Storyboard.TargetProperty ="(Shape.Fill).(SolIDcolorBrush.color)" Storyboard ="00:00:00.2" ="#22000000" ="#00FFFFFF" ="Part_BackgroundRect" strokeThickness ="4" RadiusX ="16" RadiusY ="36" stroke ="#46000000" Rectangle.Fill linearGradIEntBrush EndPoint ="0.5,-0.4" StartPoint
GradIEntStop color ="Gray" Offset ="0.242" ="DarkBlue" ="0.333" linearGradIEntBrush Rectangle ="Part_Caption" VerticalAlignment ="Center" HorizontalAlignment
Foreground ="Gold" Text ="button" TextBlock.Rendertransform Translatetransform X ="0" Y ="-2" TextBlock ="Part_ForegroundRect" ="top"
RadiusY WIDth ="124" Height ="32" ="0.13" ="#FFFFFFFF" ="1" VerticalAlignment Fill x:name
注：这样设计方式本人感觉很有意思，很有“面向对象”的味道，呵呵。
下面简要浏览一下buttonBase.xaml.cs的代码： [TemplatePart(name = " Part_Root " , Type typeof (Panel))]
[TemplatePart(name Part_Caption (TextBlock))]
[TemplatePart(name Part_ForegroundRect (Rectangle))]
[TemplatePart(name Part_BackgroundRect Part_HighlightRect Part_MouseEnter (Storyboard))]
[TemplatePart(name Part_MouseLeave Part_MouseDown Part_MouseUp (Storyboard))]
public abstract partial class buttonBase : Control
{
/// <summary>
定义单击事件
</summary>
event EventHandler Click;
执行单击事件的绑定方法
protected voID OnClick()
{
if (Click != null )
{
Click( this new EventArgs());
}
}
标题属性
string Caption
{
get { return .Part_Caption.Text; }
set .Part_Caption.Text value; }
}
鼠标移入控件区域时启动Part_MouseEnter故事板，下面类似
</summary> <param name="sender"></param> <param name="e"></param> virtual Part_Root_MouseEnter( object sender, MouseEventArgs e)
{
Part_MouseEnter.Begin();
}
Part_Root_MouseLeave( Part_Root_MouseleftbuttonDown( Part_Root_MouseleftbuttonUp( // 执行单击事件的绑定方法 OnClick();
}
Storyboard Part_MouseEnter, Part_MouseDown, Part_MouseLeave, Part_MouseUp;
Rectangle Part_ForegroundRect, Part_BackgroundRect, Part_HighlightRect;
Panel Part_Root;
TextBlock Part_Caption;
}
其实上面的代码与我们平时写.net控件类似，也是属性事件的定义。当然不同的地方就是对故事板的使用，
而故事板会让我们的按钮在鼠标触发事件时在UI上看起来更酷。当然下面还要看一下相应的button中的内容，因
为这才是实际运行时使用的控件，其代码如下： button : buttonBase
{
button()
{
加载button.xaml中的内容，为下面获取元素进行相应 *** 作 xaml ResourceHelper.GetTemplate( .GetType());
ControlTemplate template (ControlTemplate)XamlReader.Load(xaml);
.Template template;
.ApplyTemplate();
}
对当前模板(xaml)中的元素进行（主要是鼠标）事件绑定
overrIDe OnApplyTemplate()
{
Part_Root (Panel)GetTemplateChild( );
Part_Caption (TextBlock)GetTemplateChild( );
Part_ForegroundRect (Rectangle)GetTemplateChild( );
Part_BackgroundRect );
Part_HighlightRect );
Part_MouseEnter (Storyboard)GetTemplateChild( );
Part_MouseLeave );
Part_MouseDown );
Part_MouseUp );
Part_Root.SizeChanged += SizeChangedEventHandler(Part_Root_SizeChanged);
Part_Root.MouseEnter MouseEventHandler(Part_Root_MouseEnter);
Part_Root.MouseLeave MouseEventHandler(Part_Root_MouseLeave);
Part_Root.MouseleftbuttonDown MousebuttonEventHandler(Part_Root_MouseleftbuttonDown);
Part_Root.MouseleftbuttonUp MousebuttonEventHandler(Part_Root_MouseleftbuttonUp);
}
按钮的实际高度或宽度发生变化时的处理事件
Part_Root_SizeChanged( Part_Root.ActualWIDth - 16d;
Part_ForegroundRect.Height Part_Root.ActualHeight 12d;
Part_HighlightRect.WIDth 10d;
Part_HighlightRect.Height 8d;
(Part_Root.ActualWIDth > Part_Root.ActualHeight)
{
Part_BackgroundRect.RadiusX Part_ForegroundRect.RadiusX Part_HighlightRect.RadiusX
Part_Root.ActualHeight / 2d;
Part_BackgroundRect.RadiusY Part_ForegroundRect.RadiusY Part_HighlightRect.RadiusY
Part_Root.ActualWIDth 4d;
}
else
{
Part_BackgroundRect.RadiusX 4d;
Part_BackgroundRect.RadiusY 2d;
}
}
}
到这里还有另一个按钮控件Repeatbutton没有介绍，其实它的内容也上面的button代码相似，所以就不多介绍了。
当然Repeatbutton最终的用处是被放在了ImageSelector控件中做为子控制被加载，这其中与我们开发“复合型”控件
相似。 下面就是button控制的运行效果，如下所示：
当然这个DEMO在控件开发上还有一些有特色的地方，比如CheckBox控件等，我会在接下来的文章中加以说明， 呵呵。 好了，今天的内容就先到这里了。
tag:silverlight,button,imagesnipper 作者:代震军,daizhj 原文链接:[url]http://www.cnblogs.com/daizhj/archive/2008/09/01/1281204.html[/url]
源码下载，请点击这里:) 总结
以上是内存溢出为你收集整理的推荐并简要分析一个silverlight的相册DEMO--ImageSnipper(V2)全部内容，希望文章能够帮你解决推荐并简要分析一个silverlight的相册DEMO--ImageSnipper(V2)所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）