Windows Phone 7 技巧三則

Windows Phone 7開發中涉及到許多技巧，下面就三個小技巧與大家分享，分别如下： 

 1. 設定應用程式的圖示

2. Windows Phone 7中的啟動畫面

3. 設定應用程式的橫排顯示

1. 設定應用程式的圖示

右擊Wp7應用程式的解決方案，選擇屬性，設定Icon為自己想要的圖檔，如下圖

<a href="http://blog.51cto.com/attachment/201105/210651718.jpg" target="_blank"></a>

<a href="http://blog.51cto.com/attachment/201105/210719935.jpg" target="_blank"></a>

并且要確定圖檔的build方式為Content，如上圖。最終的運作效果如下

<a href="http://blog.51cto.com/attachment/201105/210744190.jpg" target="_blank"></a>

預設情況下，Windows Phone 7 應用程式會使用如下的預設圖檔作為程式的啟動畫面，我們可以自己設定Windows Phone 7中的啟動畫面，可以設定為：1.使用自己的圖檔作為啟動畫面 2. 帶動畫效果的啟動畫面 3.不使用啟動畫面

對于1，我們隻要将SplashScreenImage替換為自己的圖檔即可。而對于3，如果不想使用啟動畫面，我們隻需将SplashScreenImage圖檔移出項目即可。下面着重講一下如果實作動畫啟動畫面.

<a href="http://blog.51cto.com/attachment/201105/210838199.jpg" target="_blank"></a>

 這裡使用BackgroundWorker類來實作，BackgroundWorker類是開辟一個背景線程來處理一些操作而同時你的UI也能繼續響應使用者操作的類。更多的關于BackgroundWorker類大家可以Google其用法。在WP7的渲染線程中，如果你想要一個持續響應的使用者界面，那麼BackgroundWorker類會變得很有用。你可以監聽你想要做的操作的程序的事件以及操作完成的信号。我們使用RunWorkerAsync開啟背景操作。

注意：我們不應該在BackgroundWorker類的DoWork去操作使用者界面。我們可以在ProgressChanged 和RunWorkerCompleted事件中去操作與使用者界面相關的操作。關于更多的可以參考MSDN http://msdn.microsoft.com/en-us/library/system.componentmodel.backgroundworker%28VS.95%29.aspx

下面開始建立動畫的啟動動畫的步驟

1. 建立WP7項目，并添加名為AnimatedSplashScreen.xaml的使用者控件（UserControl）

2. 在MainPage.xaml.cs添加如下的命名空間，并且編輯後置代碼如下

using System.Threading;

using System.Windows.Controls.Primitives;

public partial class MainPage : PhoneApplicationPage  

{  

BackgroundWorker backroungWorker;  

Popup myPopup;  

// Constructor  

public MainPage()  

InitializeComponent();  

myPopup = new Popup() { IsOpen = true, Child = new AnimatedSplashScreen() };  

backroungWorker = new BackgroundWorker();  

RunBackgroundWorker();  

}  

private void RunBackgroundWorker()  

backroungWorker.DoWork += ((s, args) =&gt;  

Thread.Sleep(5000);   

});  

backroungWorker.RunWorkerCompleted += ((s, args) =&gt;  

this.Dispatcher.BeginInvoke(() =&gt;  

this.myPopup.IsOpen = false;  

);  

backroungWorker.RunWorkerAsync();  

} 

3. 編輯AnimatedSplashScreen.xaml前台代碼如下

&lt;StackPanel x:Name="LayoutRoot" Background="Black" Height="800" Width="480"&gt;  

&lt;TextBlock Text="WindowsPhoneGeek Sample Splash Screen" x:Name="text" Foreground="Green" FontSize="65" TextWrapping="Wrap" Margin="0,20,0,0"/&gt;  

&lt;Image Source="logo.png" x:Name="logoImage" Stretch="None" Margin="0,0,0,50"&gt;  

&lt;Image.Projection&gt;  

&lt;PlaneProjection/&gt;  

&lt;/Image.Projection&gt;  

&lt;/Image&gt;  

&lt;toolkit:PerformanceProgressBar IsIndeterminate="True" Foreground="Green"/&gt;  

&lt;/StackPanel&gt; 

并且添加如下的動畫資源

&lt;UserControl.Resources&gt;  

&lt;Storyboard x:Key="flippingAnimation" &gt;  

&lt;DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationX)" Storyboard.TargetName="logoImage"&gt;  

&lt;EasingDoubleKeyFrame KeyTime="0" Value="0"/&gt;  

&lt;EasingDoubleKeyFrame KeyTime="0:0:1" Value="1"/&gt;  

&lt;EasingDoubleKeyFrame KeyTime="0:0:2" Value="360"/&gt;  

&lt;/DoubleAnimationUsingKeyFrames&gt;  

&lt;ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="text"&gt;  

&lt;DiscreteObjectKeyFrame KeyTime="0"&gt;  

&lt;DiscreteObjectKeyFrame.Value&gt;  

&lt;SolidColorBrush Color="White"/&gt;  

&lt;/DiscreteObjectKeyFrame.Value&gt;  

&lt;/DiscreteObjectKeyFrame&gt;  

&lt;DiscreteObjectKeyFrame KeyTime="0:0:2"&gt;  

&lt;SolidColorBrush Color="Green"/&gt;  

&lt;/ObjectAnimationUsingKeyFrames&gt;  

&lt;/Storyboard&gt;  

&lt;/UserControl.Resources&gt; 

4. 最後編輯其後置代碼如下

public AnimatedSplashScreen()  

Storyboard flippingAnimation = this.Resources["flippingAnimation"] as Storyboard;  

flippingAnimation.Begin();  

3. 設定應用程式的Orientations

 Windows Phone 7預設的Orientations是Portrait 的

<a href="http://blog.51cto.com/attachment/201105/211115958.png" target="_blank"></a>

則切換到橫排是如下圖

<a href="http://blog.51cto.com/attachment/201105/211229117.jpg" target="_blank"></a>

我們可以做如下的修改 ，将SupportedOrientations設為PortaitOrLandscape，如下圖

<a href="http://blog.51cto.com/attachment/201105/211312526.png" target="_blank"></a>

 則再次運作程式，切換到橫排時，效果如下圖

<a href="http://blog.51cto.com/attachment/201105/211411740.jpg" target="_blank"></a>

    本文轉自xshf12345 51CTO部落格，原文連結：http://blog.51cto.com/alexis/574966，如需轉載請自行聯系原作者