本文和大家重點討論一下Windows Phone開發中一個時鐘的例子，Expressblend工具是開發silverlightUi的重要工具，在這里有一個從silverlight移植過來的時鐘小例子可以看出在Phone7上這個工具一樣也很重要并且可以提高開發效率。

Windows Phone開發中一個時鐘的例子

Expressblend工具是開發silverlightUi的重要工具，在這里有一個從silverlight移植過來的時鐘小例子可以看出Windows Phone開發中在Phone7上這個工具一樣也很重要并且可以提高開發效率。

一．在blend工具中，可以用Ellipse繪制表盤,通過在property中使用漸變色來產生立體效果。還可以能過gradient工具來調整漸變色。

二．用Ellipse工具繪制表針軸，并設置圓的strokethickness來改變線的粗細。

三．用Rectangle工具來繪制三個表針，并放好位置。

四．增加動畫效果

<Storyboardx:NameStoryboardx:Name="clockStoryboard"> 
<!--Thisanimationtargetsthehourhandtransform--> 
<DoubleAnimationx:NameDoubleAnimationx:Name="hourAnimation" 
Storyboard.TargetName="HourHandTransform" 
Storyboard.TargetProperty="Angle" 
Duration="12:0:0"RepeatBehavior="Forever"To="360"/> 
 
<!--Thisanimationtargetstheminutehandtransform--> 
<DoubleAnimationx:NameDoubleAnimationx:Name="minuteAnimation" 
Storyboard.TargetName="MinuteHandTransform" 
Storyboard.TargetProperty="Angle" 
Duration="1:0:0"RepeatBehavior="Forever"To="360"/> 
 
<!--Thisanimationtargetsthesecondhandtransform--> 
<DoubleAnimationx:NameDoubleAnimationx:Name="secondAnimation" 
Storyboard.TargetName="SecondHandTransform" 
Storyboard.TargetProperty="Angle" 
Duration="0:1:0"RepeatBehavior="Forever"To="360"/> 
</Storyboard> 
 

Windows Phone開發中這時運行一下此程序，已經可以看到時鐘的表針在走了。

五．控制表針行為語句

voidMainPage_Loaded(objectsender,RoutedEventArgse)  
{  
//Thecurrentdateandtime.  
System.DateTimecurrentDate=DateTime.Now;  
 
//Findtheappropriateangle(indegrees)forthehourhand  
//basedonthecurrenttime.  
doublehourangle=(((float)currentDate.Hour)/12)*360+currentDate.Minute/2;  
 
//Thesameasfortheminuteangle.  
doubleminangle=(((float)currentDate.Minute)/60)*360;  
 
//Thesameforthesecondangle.  
doublesecangle=(((float)currentDate.Second)/60)*360;  
 
//Setthebeginningoftheanimation(Fromproperty)totheangle  
//correspongingtothecurrenttime.  
hourAnimation.From=hourangle;  
 
//Settheendoftheanimation(Toproperty)totheangle  
//correspondingtothecurrenttimePLUS360degrees.Thus,the  
//animationwillendaftertheclockhandmovesaroundtheclock  
//once.Note:TheRepeatBehaviorpropertyoftheanimationisset  
//to"orever"sotheanimationwillbeginagainassoonasitcompletes.  
hourAnimation.To=hourangle+360;  
 
//Sameaswiththehouranimation.  
minuteAnimation.From=minangle;  
minuteAnimation.To=minangle+360;  
 
//Sameaswiththehouranimation.  
secondAnimation.From=secangle;  
secondAnimation.To=secangle+360;  
 
this.clockStoryboard.Begin();  
}  
 

源代碼：

/Files/randylee/MyClock.rar