C# 開發 WPF/Silverlight 動畫與遊戲系列教程（三十一）：矢量魔法——激光篇

前言

回憶經典網遊《奇跡》（MU）的激光魔法：畫面華麗、直線穿透群攻。本節以此為藍本，展示矢量魔法製作。

素材分析與 XAML 繪製

用 PS 漸變工具+外發光畫草圖，WPF 中以圓角矩形 + 彩虹筆刷 + OuterGlowBitmapEffect 實現：

建立 QXLaser 使用者控件：

<Canvas>
  <Rectangle x:Name="Body" Width="700" Height="80" RadiusX="80" RadiusY="80">
    <Rectangle.RenderTransform>
      <RotateTransform x:Name="Rotate"/>
    </Rectangle.RenderTransform>
    <Rectangle.BitmapEffect>
      <OuterGlowBitmapEffect x:Name="Outer" GlowSize="40" Noise="0" Opacity="1"/>
    </Rectangle.BitmapEffect>
  </Rectangle>
</Canvas>

RadiusX/Y 定義圓角，OuterGlowBitmapEffect 外發光（WPF 佔資源，Silverlight 效能優）。加 RotateTransform 因激光有方向性，需旋轉。

參數配置與傷害判定

Config.xml 新增 Type 區分魔法類型（範圍、方向、傷害處理差異大）。

激光屬矩形直線穿梭類，傷害範圍為不規則矩形。點擊 B 點，從主角手部 A 發射，計算角度旋轉，傷害區域為粉色點陣包圍區。已知 A、B 座標與長度，可算出 4 頂點，用 System.Drawing.GraphicsPath + Region 判斷精靈是否在內：

public static bool PointInPolygon(System.Drawing.Point[] range, System.Drawing.Point target) {
    GraphicsPath myGraphicsPath = new GraphicsPath();
    Region myRegion = new Region();
    myGraphicsPath.Reset();
    myGraphicsPath.AddPolygon(range);
    myRegion.MakeEmpty();
    myRegion.Union(myGraphicsPath);
    return myRegion.IsVisible(target);
}

此法可擴充至任意多邊形，所有範圍攻擊魔法通用，本節精華！

矢量魔法的萬變魅力

修改 Fill、OuterFill 即可換膚：

// 深藍激光
laser.Fill = Super.CreateRainbowBrush(231,255,255,0,255,255,255,0.5,231,255,255,1);
laser.OuterFill = Colors.MidnightBlue;

// 紅色激光
laser.Fill = Super.CreateRainbowBrush(255,225,225,0,255,255,255,0.5,255,225,225,1);
laser.OuterFill = Colors.Pink;

甚至可動態拉長再消失：

矢量魔法可依參數自由改色、尺寸、旋轉，效能優於位圖，是 WPF/Silverlight 高性能遊戲必備技能。源碼中新增魔法名稱帶屬性標籤（如「激光[雷]」），下節將講解魔法屬性效果實現。敬請期待。

出處：https://alamiye010.cnblogs.com