Silverlight 2.5D RPG游戲技巧與特效處理：（三）動態光影

作者: 深藍色右手來源: 博客園發布時間: 2011-02-28 14:47 閱讀: 1025 次推薦: 0 原文鏈接 [收藏]

　　通常來說，只要談到影子及影子制作，首先想到的不外乎3D。游戲中的影子設計大致可分為硬實現和軟實現兩種，比如像“游戲影子制作技術”這篇文章所談到3D游戲影子制作方案Projective Shadow、Shadow Map以及Shadow Volume均屬于硬實現。硬實現的效果最逼真，相對的運算量也較高；而對于Silverlight開發2.5D網游來說，我們通常會采用折中的軟實現去表述場景中的動態光影效果。精致的光影能讓玩家充分體驗到空間立體感，當然也是2.5D網游所不可或缺的條件之一。

　　Silverlight 2.5D網游中的光影效果軟實現主要采用模擬仿真方法，傳統的處理方案大致有三種：

　　一）垂直照射的固定圓影。我們可以假想當角色被頭頂上的光源所照射時會產生圓形光影，游戲中我們僅需一個圓影素材，根據角色的占地比例進行縮放匹配，2.5D立體效果立刻顯現：

　　二）基于紙娃娃系統的動態光影。原理也很簡單，就是將影子作為角色紙娃娃的部件之一根據角色的實時動作與其他部件進行動態組合。以增加美術的工作量為代價換取程序設計簡單化：

　　三）動作同步映射的動態光影。與上一種方法所達到的效果一致，區別在于此方案我們無需額外的影子圖片資源，而是通過Silverlight內置的WriteableBitmap配合上OpacityMask(透明蒙版)來實現，比如類似如下邏輯：

WriteableBitmap writeableBitmap = new WriteableBitmap(role.OverallWidth, role.OverallHeight);
writeableBitmap.Render(role.Entity, null);
writeableBitmap.Invalidate();
Rectangle rectangle = new Rectangle() { Width = role.OverallWidth, Height = role.OverallHeight, Fill = new SolidColorBrush(Colors.Black) };
rectangle.OpacityMask = new ImageBrush() { ImageSource = writeableBitmap };

　　大致思路是首先創建一個角色最大可能面積時的尺寸作為寬、高的WriteableBitmap對象；然后將該角色的實體部分(除去名字、血條等的外形部分)繪入WriteableBitmap中；最后再將該WriteableBitmap作為與其尺寸一致的黑色矩形的透明蒙版圖像源。將整個邏輯置入角色的動作切幀方法(事件)中，一個黑黝黝的實時影子便會橫空出世。當然，此時的影子還需要按照假想的場景光源位置進行偏移才能達到最終的模擬仿真效果。在Silverlight中實現透視和扭曲變形不外乎兩種方案：TransformGroup和PlaneProjection。本節中我選擇使用后者來實現目標：

shadow.Projection = new PlaneProjection() {
GlobalOffsetX = -p.X + shadow.Center.X,
GlobalOffsetY = -p.Y + shadow.Center.Y,
LocalOffsetX = -48,
LocalOffsetY = 92,
RotationX = 86,
RotationY = 7.6
};
shadow.Opacity = 0.5;

　　PlaneProjection的變換參數多達12個，相當強大，任意基于平面的3D透視效果都可輕松實現：

　　最后需要指出的是，如果計劃為游戲添加全局的陰影開關/切換功能，建議編寫一個單獨的陰影管理器作為所有角色影子的存放和管理容器，而不是將影子內置到角色控件中。本節源碼我對場景部分進行了重構，層次更顯分明。最底層為背景地圖，采用400*400切片依據主角所處位置動態加載，相關參數為屏幕分辨率(通過調用Javascript的 screen.width 和 screen.height函數獲取)以及OOB模式時的窗口尺寸；往上一層便是陰影層，角色移動及動作變換時都會觸發與其ID一致的影子同步行動，當然前提是該角色在以主角為中心的屏幕范圍內(Visible)；再往上一層便是場景空間層(Space)，一切角色、動畫、遮擋等均處于該層中，畢竟它們需要交互彼此之間的Z層次關系。