09123945_FRQG 
Silverlight 4(SL4)和Windows Phone 7(WP7)大家已經都很熟悉了,作為WP7 開發框架之一的Silverlight,使廣大開發者方便快捷的開發WP7 應用程式或遊戲。如果您是一位SL 開發人員,那WP7 的應用程式開發也會使你得心應手。

前不久WP7 已經在國外上市,這意味著相應的WP7 應用程式和遊戲將會蜂擁而至,由於之前研究過一陣SL,看到WP7 到來手便開始發癢。本篇將原來一個SL 類比Nano5 的程式移植到WP7,為大家簡單演示一下移植過程。SL 程式請參考《Silverlight 類比Nano5 介面效果》。

素材移植
注意,您的電腦上需要安裝Windows Phone Developer Tools首先我們來新建一個WP7 應用程式。

09123945_Non7  

由於SL 程式比較簡單只包含一些圖片,所以將所有素材資源複製到WP7 專案。如下圖SL4 與WP7 專案清單對比。
09123945_LpDh09123945_hihQ  


程式移植
接下來先對XAML 程式進行移植,原來SL4 程式裡XAML 只有一個<Canvas>。

<Canvas x:Name="LayoutRoot" MouseLeftButtonDown="LayoutRoot_MouseLeftButtonDown" />
在WP7 中需要將<Canvas> 放入ContentPanel <Grid>。

<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"
ManipulationDelta="ContentPanel_ManipulationDelta">
<Canvas x:Name="imageList" Background="Transparent"/>
</Grid>


下面移植C# 程式,可以將SL4 的C# 程式全部複製到WP7 中再逐一對錯誤提示進行修改和調整。



MainPage() 方法

SL4:

public MainPage()
{
InitializeComponent();
addImages();
HtmlPage.Window.AttachEvent("DOMMouseScroll", LayoutRoot_MouseWheel);
HtmlPage.Window.AttachEvent("onmousewheel", LayoutRoot_MouseWheel);
HtmlPage.Document.AttachEvent("onmousewheel", LayoutRoot_MouseWheel);
startShow();
}WP7:不再需要支援不同瀏覽器的滑鼠滾輪事件。

public MainPage()
{
InitializeComponent();
addImages();
startShow();
}

事件觸發

SL4:通過MouseWheel 滑鼠滾輪事件來切換專輯封面。

private void LayoutRoot_MouseWheel(object sender, HtmlEventArgs args)
{

double mouseDelta = 0;
ScriptObject e = args.EventObject;
// Mozilla and Safari
if (e.GetProperty("detail") != null)
{
mouseDelta = ((double)e.GetProperty("detail"));
}

// IE and Opera
else if (e.GetProperty("wheelDelta") != null)
mouseDelta = ((double)e.GetProperty("wheelDelta"));

mouseDelta = Math.Sign(mouseDelta);

moveIndex((mouseDelta > 0) ? 1 : -1);
}WP7:通過ManipulationDelta 觸屏事件來完成。

private void ContentPanel_ManipulationDelta(object sender, ManipulationDeltaEventArgs e)
{
if (e.DeltaManipulation.Translation.X > 0)
{
moveIndex(1);
}
else {
moveIndex(-1);
}
}測試回合
打開WP7 模擬器後,原來的SL4 程式仍然可以在WP7 中正常運行,唯一區別就是原來的滑鼠操作變為了觸屏操作。

09123945_FRQG  

總結
當然本篇的SL4 程式相對來說比較簡單,沒有複雜的動態效果或類庫調用。在本次Teched2010 大會也和泳濤兄(WP7 MVP)交流了一下。其實SL 程式移植到WP7 也並非易事。首先,要將原來SL 專案裡所有使用的資源全部複製到WP7 專案。除圖、音、影以外,更重要的是專案中引用的類庫,有些類庫可能在WP7 中並不支援。其次,要將SL 的XAML 代碼移植到WP7,所謂WP7 中的SL 開發平臺只是SL 的一部分,也就是說有些SL 的控制項、屬性在WP7 不能使用,所以要做進一步的調整。最後,要把C# 程式移植到WP7,這也是很複雜的過程,其中涉及的因素很多,可借助VS 強大的調試功能進行修改。後續我還會對一些稍微複雜些的程式進行移植,也希望大家分享自己的開發經驗。

原始程式碼

Teched2010
最後上幾張Teched2010 中用於Demo 演示和展示的WP7 真機。機型:三星

可以按自己的喜好設置主題顏色:

09123945_1Xub09123945_wVLc  

手機遊戲:刺客信條、極品飛車,都是大作啊!玩了一下極品飛車,運行很流暢,通過重力感應控制賽車轉向。

09123945_qoKH  

美中不足的是當前WP7 本身還不支援中文輸入,也沒有手寫輸入。要是用WP7 發短信可麻煩了,但似乎有協力廠商開發的軟體可以支援。期待WP7 早日登陸國內市場。


原文連結:HTTP://www.cnblogs.com/gnielee/archive/2010/12/03/sl4-to-wp7.html

 

創作者介紹
創作者 shadow 的頭像
shadow

資訊園

shadow 發表在 痞客邦 留言(0) 人氣()