非常酷的WPF的抽奖程序

 

 

头段时间为公司的年会写了个使用WPF技术的抽奖程序，实际效果很不错，就是内存占的大一些....（实际上更好的解决方案不是大批量的创建对象，而是变换固定一组对象的显示内容。）厄，今天一时兴起，决定分享下开发这个程序的一些心得，对这个程序的代码感兴趣的朋友请到微软的MSDN Code Library下载该代码. http://code.msdn.microsoft.com/annualfestivallotter

需求：    

1，每一个音符绑定一个抽奖号码。     

2，主持人喊开始， 一组标有数字的被打乱顺序的音符开始在波浪状的五线谱上流动，见下图。

        

3，主持人喊结束，则在无线谱上的音符停止流动，同时从当前五线谱上的音符中随机抽取指定数量的音符，以动画的方式放大到前面,如下图。

实现机制：    

1. 实现音符     

    由于整个程序需要大量的音符生成和流动，而且考虑到音符绑定了抽奖号码以及抽奖按钮按下时要执行跨越动画特效，所以特将它实现为了控件Note。 xaml代码如下：

 1 < UserControl  x:Class ="AnnualFestivalLottery.Note"  2     xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  3     xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"  4     Height ="40"  Width ="60"  5     x:Name ="root"      6              7               >  8      < UserControl.Resources >  9          < Storyboard  x:Key ="Pop"  Storyboard.TargetName ="root" > 10              < DoubleAnimation  x:Name ="PopResizeX"  Storyboard.TargetName ="SizeTransform"  Storyboard.TargetProperty ="ScaleX"  To ="1.5"  Duration ="0:0:0.3" /> 11              < DoubleAnimation  x:Name ="PopResizeY"  Storyboard.TargetName ="SizeTransform"  Storyboard.TargetProperty ="ScaleY"  To ="1.5"  Duration ="0:0:0.3" /> 12              < DoubleAnimation  x:Name ="PopTranslateX"  Storyboard.TargetName ="Translate"  Storyboard.TargetProperty ="X" ></ DoubleAnimation > 13              < DoubleAnimation  x:Name ="PopTranslateY"  Storyboard.TargetName ="Translate"  Storyboard.TargetProperty ="Y" ></ DoubleAnimation > 14          </ Storyboard > 15      </ UserControl.Resources > 16      < UserControl.RenderTransform > 17          < TransformGroup > 18              < ScaleTransform  x:Name ="SizeTransform"    /> 19              < RotateTransform  x:Name ="Rotation"   /> 20              < TranslateTransform  x:Name ="Translate" /> 21          </ TransformGroup > 22      </ UserControl.RenderTransform > 23      < Canvas > 24          < Image  Source ="note1.png"  x:Name ="NoteImage"  Height ="40"  Width ="30" ></ Image > 25          < TextBlock  x:Name ="NoteNumber"  Canvas.Right ="2px"  Canvas.Top ="2px"  Text =" {Binding Number,ElementName=root} "   Foreground ="White"  FontFamily ="Corbel Bold"  FontSize ="18px"   /> 26      </ Canvas > 27 </ UserControl >

后端代码如下：

/**/ /// <summary>     /// Interaction logic for Note.xaml     /// </summary>      public   partial   class  Note : UserControl      {         public event EventHandler NoteFlowCompleted;         private Storyboard moveNoteFlowStoryboard;         private Storyboard popStoryboard;         public Note()         {             InitializeComponent();         }         public Note(int number):this()         {             this.Number = number;         }         public static readonly DependencyProperty NumberProperty =         DependencyProperty.Register("Number", typeof(int), typeof(Note));         public int Number         {             get { return (int)GetValue(NumberProperty); }             set