Silverlight 遊戲開發小技巧:透明背景的Silverlight程序

一些朋友在玩窩窩世界的時候,發現官方網站上的進入入口程序是Silverlight,但是有趣的是一個透明背景的Silverlight程序,這個效果最早我也未找資料,在未來Silverlight程序會在各個方面應用,透明背景的效果就會涉及,這種效果預覽如下:

 

下面一步一步的告訴大家這個小技巧,

首先要準備一個Silverlight,然後將MainPage的填充色設置爲透明的,還有LayoutRoot也是一樣,我在這裏用了一張來自網絡的圖片,

 

爲了穩定,最好將MainPage的寬高定死,這樣有助於我們在網頁中呈現

 

我這張圖是256x256的,大家可以依據自己的需要設置大小,但是一定要符合最終呈現的需求。

現在我們在這個上面,小做幾個故事板動畫,比如鼠標移入移出,這樣能夠更好的看這個效果,具體實現我們就不做太多的說明,大家可以直接在最後下載源工程瀏覽。

現在我們要整合到網頁中,同樣,簡單準備了一個帶背景的網頁

 

現在我們需要添加Silverlight程序到網頁中:

 

  1. <div>   
  2. <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="300" height="220">   
  3. <param name="source" value="/ClientBin/youSilverlight.xap"/>   
  4. <param name="windowless" value="true"/>   
  5. <param name="background" value="#0F00" />   
  6. <param name="minRuntimeVersion" value="4.0.50401.0" />   
  7. </object><iframe id="_sl_historyFrame" style="visibility:hidden;height:0px;width:0px;border:0px"></iframe>   
  8. </div>   
請source屬性裏寫你的Silverlight程序目標,可能注意background這個屬性,這裏設置了一個#0f00,它是一個顏色表示字段,爲標準的ARGB色值,而我們將A的色值已經設置爲0,有興趣的朋友可以瞭解有關background的屬性部分:http://msdn.microsoft.com/zh-cn/library/cc838148(VS.95).aspx

但是如果你直接運行的話,將會得到一個不是透明背景的效果,這是因爲現在的Silverlight程序暫時還不是無窗口的模式,你需要將Windowless設置爲true,就如上面的代碼所述。

相關的資料可以查詢http://msdn.microsoft.com/zh-cn/library/cc838156(VS.95).aspx

剩下的工作你需要一個頁面設計師來幫你完成,比如將程序顯示在什麼地方之類的工作,

那麼下面我們預覽一下效果吧。這是和網頁結合的技巧,可以製作例如登錄、Banner等需要透明背景的特效程序。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章