WPF/Silverlight 遊戲開發教程 (二十-3)：完美遮罩層與換裝系統實作

完美遮罩層：基於 ZIndex 的畫家算法

第十一節實現的遮罩層仍有瑕疵。本節透過精確控制 Canvas.ZIndex 實現「主角在遮罩前後自然穿梭」的效果。

關鍵實作步驟

1. 截取地圖地標生成 Mask3.png (202×395)，置於 Map 資料夾
2. 初始化：Mask.Opacity=0.7; Canvas.SetZIndex(Mask, 612) (612 = Mask 高度 + Y 值)
3. 遊戲迴圈中同步更新位置與層級：

   Canvas.SetLeft(Mask, MapLeft + 793);
   Canvas.SetTop(Mask, MapTop + 217);
   Canvas.SetLeft(Spirit, Spirit.X - Spirit.CenterX + MapLeft);
   Canvas.SetTop(Spirit, Spirit.Y - Spirit.CenterY + MapTop);
   Canvas.SetZIndex(Spirit, (int)Spirit.Y); // 畫家算法：Y 越大越靠前
   

所有 NPC、怪物同樣設 ZIndex = Y 即可自動形成正確遮擋關係。

完美換裝：三行代碼實現裝備合成與快取

XAML 放置兩個 ComboBox (衣服/武器代號) 與一按鈕，點擊事件：

Spirit.Equipment[0] = Convert.ToInt32(comboBox1.SelectionBoxItem.ToString());
Spirit.Equipment[1] = Convert.ToInt32(comboBox2.SelectionBoxItem.ToString());
Spirit.Source = Super.EquipPart(Spirit.Equipment, Spirit.DirectionNum, Spirit.DirectionFrameNum,
                                Spirit.TotalWidth, Spirit.TotalHeight, Spirit.SingleWidth, Spirit.SingleHeight);

首次換裝觸發圖片合成 (CPU 密集) 會短暫卡頓，後續得益於快取機制即時完成 —— 同網遊裝備穿戴邏輯。