1. 項(xiàng)目概述當(dāng)棋盤上的棋子需要“呼吸感”在開發(fā)2D棋盤類游戲比如自走棋、戰(zhàn)棋或者一些策略游戲時(shí)我們經(jīng)常會(huì)用到Unity的Tilemap系統(tǒng)來(lái)構(gòu)建規(guī)整的網(wǎng)格地圖。Tilemap高效、易用是處理網(wǎng)格化地圖的不二之選。但不知道你有沒(méi)有遇到過(guò)這樣的需求當(dāng)玩家選中一個(gè)單位棋子或者某個(gè)單位觸發(fā)特殊狀態(tài)如“巨大化”、“強(qiáng)化”時(shí)你希望這個(gè)棋子能有一個(gè)醒目的、動(dòng)態(tài)的縮放效果以增強(qiáng)視覺(jué)反饋和游戲表現(xiàn)力。最初你可能會(huì)想到直接去修改這個(gè)棋子Tile的Transform.localScale。這很直觀對(duì)吧但在Tilemap的世界里事情沒(méi)那么簡(jiǎn)單。Tilemap中的每個(gè)瓦片Tile并不是一個(gè)獨(dú)立的GameObject它們是由Tilemap Renderer批量渲染的。你無(wú)法直接獲取并修改其中某一個(gè)特定位置瓦片的Transform。直接修改整個(gè)Tilemap的縮放又會(huì)影響到棋盤上所有的格子這顯然不是我們想要的。那么如何精準(zhǔn)地控制棋盤上某一個(gè)特定格子里“棋子”的大小呢這就是本次實(shí)戰(zhàn)要解決的核心問(wèn)題。我們將深入Tilemap的渲染底層借助Matrix4x4四維矩陣這個(gè)強(qiáng)大的數(shù)學(xué)工具實(shí)現(xiàn)針對(duì)單個(gè)或多個(gè)瓦片的動(dòng)態(tài)縮放。這種方法不依賴額外的GameObject性能開銷極低并且能與Tilemap系統(tǒng)無(wú)縫集成是實(shí)現(xiàn)高級(jí)棋盤游戲視覺(jué)效果的關(guān)鍵技巧。2. 核心原理Matrix4x4與自定義瓦片渲染要理解解決方案我們得先拆解一下Unity Tilemap的渲染流程。Tilemap Renderer在繪制每一個(gè)瓦片時(shí)并不是簡(jiǎn)單地把一張圖片貼上去。對(duì)于每一個(gè)瓦片單元系統(tǒng)內(nèi)部會(huì)計(jì)算一個(gè)“變換矩陣”這個(gè)矩陣決定了這個(gè)瓦片最終在世界空間中的位置、旋轉(zhuǎn)和縮放。默認(rèn)情況下這個(gè)矩陣只包含位置信息即該瓦片在網(wǎng)格中的坐標(biāo)縮放和旋轉(zhuǎn)都是單位值即1和0。Matrix4x4是計(jì)算機(jī)圖形學(xué)中用于描述線性變換平移、旋轉(zhuǎn)、縮放、錯(cuò)切等的標(biāo)準(zhǔn)工具。在Unity中一個(gè)Matrix4x4可以完整定義一個(gè)從局部空間到世界空間的變換。我們的突破口就在這里我們可以為Tilemap中指定的瓦片替換掉它默認(rèn)的變換矩陣注入一個(gè)包含了自定義縮放甚至旋轉(zhuǎn)信息的新矩陣。2.1 技術(shù)選型為何是Matrix4x4你可能會(huì)問(wèn)還有其他方法嗎比如在Tile上疊加一個(gè)SpriteRenderer的GameObject這能解決問(wèn)題但破壞了Tilemap的批處理優(yōu)勢(shì)當(dāng)棋子數(shù)量成百上千時(shí)Draw Call會(huì)暴增性能堪憂。使用Tilemap的Animation Tile可以制作縮放動(dòng)畫但這是預(yù)定義的、靜態(tài)的很難根據(jù)游戲邏輯如選中、Buff狀態(tài)進(jìn)行動(dòng)態(tài)、實(shí)時(shí)的控制。修改Tile的Sprite換成一張更大的圖片這不夠靈活無(wú)法實(shí)現(xiàn)平滑的過(guò)渡動(dòng)畫。相比之下使用Matrix4x4修改渲染矩陣的方案具有顯著優(yōu)勢(shì)高性能它仍在Tilemap的渲染管線內(nèi)享受合批優(yōu)化僅增加了極少的CPU計(jì)算開銷。高靈活度縮放值scale可以隨時(shí)通過(guò)代碼動(dòng)態(tài)計(jì)算和修改輕松實(shí)現(xiàn)動(dòng)畫、插值。功能強(qiáng)大矩陣不僅能處理縮放稍加擴(kuò)展就能支持以任意點(diǎn)為中心的旋轉(zhuǎn)為游戲特效如攻擊旋轉(zhuǎn)、眩暈效果打開大門。注意這種方法本質(zhì)上是“欺騙”渲染器。Tilemap的碰撞體Tilemap Collider 2D和網(wǎng)格坐標(biāo)cell位置不會(huì)因?yàn)槲覀兊木仃囎儞Q而改變。一個(gè)被放大了2倍的棋子其邏輯位置和碰撞邊界仍然在原單元格內(nèi)。這是需要特別注意的我們會(huì)在后續(xù)章節(jié)討論如何同步處理邏輯與視覺(jué)。2.2 Matrix4x4基礎(chǔ)構(gòu)造一個(gè)縮放矩陣一個(gè)標(biāo)準(zhǔn)的縮放矩陣非常簡(jiǎn)單。假設(shè)我們要在X軸和Y軸上進(jìn)行均勻縮放縮放系數(shù)為s那么對(duì)應(yīng)的4x4矩陣如下[ s, 0, 0, 0 ] [ 0, s, 0, 0 ] [ 0, 0, s, 0 ] [ 0, 0, 0, 1 ]在Unity中我們可以使用Matrix4x4.Scale(Vector3 scale)這個(gè)便捷方法來(lái)創(chuàng)建縮放矩陣。例如Matrix4x4.Scale(new Vector3(2f, 2f, 1f))會(huì)創(chuàng)建一個(gè)在XY平面放大2倍的矩陣Z軸保持1因?yàn)槲覀兪?D。然而僅僅有縮放矩陣還不夠。這個(gè)縮放是以世界原點(diǎn)為中心的。如果我們直接應(yīng)用棋子會(huì)從網(wǎng)格原點(diǎn)開始放大位置就錯(cuò)亂了。因此我們需要的是一個(gè)“平移-縮放-平移回”的復(fù)合變換也就是以棋子自身中心點(diǎn)為縮放原點(diǎn)。先將棋子“平移”到世界原點(diǎn)減去其單元格中心位置。在世界原點(diǎn)進(jìn)行縮放。再“平移”回原來(lái)的位置。這個(gè)過(guò)程用矩陣乘法表示就是T * S * T_inv。在Unity中我們可以通過(guò)Matrix4x4.TRS方法一次性創(chuàng)建這個(gè)復(fù)合矩陣。TRS代表Translation平移、Rotation旋轉(zhuǎn)、Scale縮放。// 假設(shè)cellPosition是世界空間中某個(gè)單元格的中心點(diǎn)坐標(biāo) Vector3 cellCenterWorldPos tilemap.GetCellCenterWorld(cellPosition); float scaleFactor 2.0f; Matrix4x4 customMatrix Matrix4x4.TRS( cellCenterWorldPos, // 平移位置縮放后的位置其實(shí)最終位置沒(méi)變但TRS內(nèi)部會(huì)處理 Quaternion.identity, // 旋轉(zhuǎn)無(wú) new Vector3(scaleFactor, scaleFactor, 1f) // 縮放 ); // 這里需要理解TRS中的平移參數(shù)是指執(zhí)行完縮放和旋轉(zhuǎn)后物體最終的原點(diǎn)位置。 // 對(duì)于以自身中心縮放位置參數(shù)就是cellCenterWorldPos縮放中心自然就是該位置。3. 實(shí)戰(zhàn)架構(gòu)自定義Tile與渲染器拓展理解了原理我們來(lái)搭建實(shí)現(xiàn)框架。我們不會(huì)直接修改Unity內(nèi)置的Tilemap渲染流程而是通過(guò)創(chuàng)建一個(gè)自定義的Tile類和一個(gè)配套的Tilemap渲染器拓展腳本來(lái)協(xié)作完成。3.1 創(chuàng)建可縮放瓦片ScalableTile首先我們需要一種特殊的Tile它能夠攜帶一個(gè)“縮放系數(shù)”的信息。Unity允許我們創(chuàng)建繼承自TileBase的自定義Tile類。using UnityEngine; using UnityEngine.Tilemaps; [CreateAssetMenu(fileName New Scalable Tile, menuName 2D/Tiles/Scalable Tile)] public class ScalableTile : TileBase { public Sprite sprite; // 瓦片顯示的精靈 public Color color Color.white; // 顏色 [Range(0.1f, 5f)] public float baseScale 1.0f; // 基礎(chǔ)縮放用于在編輯器中調(diào)整大小 // 注意這個(gè)baseScale是編輯器用的運(yùn)行時(shí)動(dòng)態(tài)縮放由另一個(gè)系統(tǒng)控制。 public override void GetTileData(Vector3Int position, ITilemap tilemap, ref TileData tileData) { // 這是TileBase的核心方法用于向Tilemap提供渲染數(shù)據(jù)。 tileData.sprite sprite; tileData.color color; tileData.flags TileFlags.LockColor; // 鎖定顏色避免被Tilemap覆蓋 tileData.colliderType Tile.ColliderType.Sprite; // 設(shè)置碰撞體類型 // 這里不直接設(shè)置transform因?yàn)槲覀冃枰繋瑒?dòng)態(tài)計(jì)算。 } }這個(gè)ScalableTile和普通Tile幾乎一樣只是多了一個(gè)baseScale用于在Unity編輯器里預(yù)設(shè)一個(gè)大小。真正的動(dòng)態(tài)縮放系數(shù)不會(huì)存儲(chǔ)在這里因?yàn)門ile是ScriptableObject資產(chǎn)同一資產(chǎn)被多個(gè)格子使用時(shí)修改其字段會(huì)影響所有實(shí)例。動(dòng)態(tài)數(shù)據(jù)應(yīng)該存儲(chǔ)在運(yùn)行時(shí)腳本中。3.2 核心控制器TileScaleController我們將創(chuàng)建一個(gè)名為TileScaleController的MonoBehaviour腳本把它掛載到你的Tilemap GameObject上。它是整個(gè)縮放系統(tǒng)的大腦負(fù)責(zé)管理哪些格子上的棋子需要縮放以及縮放倍數(shù)。在每幀渲染前將計(jì)算好的變換矩陣設(shè)置給Tilemap。using System.Collections.Generic; using UnityEngine; using UnityEngine.Tilemaps; public class TileScaleController : MonoBehaviour { private Tilemap _targetTilemap; private DictionaryVector3Int, float _scaleData new DictionaryVector3Int, float(); private DictionaryVector3Int, Matrix4x4 _matrixCache new DictionaryVector3Int, Matrix4x4(); private bool _isDirty false; // 標(biāo)記數(shù)據(jù)是否變化用于優(yōu)化 void Start() { _targetTilemap GetComponentTilemap(); if (_targetTilemap null) { Debug.LogError(TileScaleController must be attached to a GameObject with a Tilemap component.); enabled false; return; } // 關(guān)鍵訂閱Tilemap在發(fā)送給渲染器之前的事件 _targetTilemap.GetComponentTilemapRenderer().RegisterSpriteBatchCallback(UpdateTileMatrices); } void OnDestroy() { if (_targetTilemap ! null) { var renderer _targetTilemap.GetComponentTilemapRenderer(); if (renderer ! null) { renderer.UnregisterSpriteBatchCallback(UpdateTileMatrices); } } } // 公共方法設(shè)置或更新某個(gè)格子的縮放 public void SetTileScale(Vector3Int cellPosition, float scale) { if (_targetTilemap null) return; // 檢查該位置是否是我們定義的可縮放Tile TileBase tile _targetTilemap.GetTile(cellPosition); if (!(tile is ScalableTile)) return; scale Mathf.Max(0.1f, scale); // 防止縮放過(guò)小 if (_scaleData.ContainsKey(cellPosition)) { if (Mathf.Approximately(_scaleData[cellPosition], scale)) return; _scaleData[cellPosition] scale; } else { _scaleData.Add(cellPosition, scale); } _isDirty true; // 標(biāo)記數(shù)據(jù)已更新 _matrixCache.Remove(cellPosition); // 清除該位置的緩存矩陣下次重新計(jì)算 } // 公共方法獲取某個(gè)格子的縮放 public float GetTileScale(Vector3Int cellPosition) { return _scaleData.TryGetValue(cellPosition, out float scale) ? scale : 1.0f; } // 公共方法清除某個(gè)格子的縮放恢復(fù)為1 public void ClearTileScale(Vector3Int cellPosition) { if (_scaleData.Remove(cellPosition)) { _isDirty true; _matrixCache.Remove(cellPosition); } } // 核心回調(diào)在Tilemap渲染前被調(diào)用用于注入自定義矩陣 private void UpdateTileMatrices(SpriteBatch spriteBatch) { if (!_isDirty _matrixCache.Count 0) return; // 數(shù)據(jù)無(wú)變化且已有緩存跳過(guò) // 獲取Tilemap內(nèi)部用于渲染的“區(qū)塊”數(shù)據(jù) var chunkData spriteBatch.GetChunkData(); // 這里是一個(gè)簡(jiǎn)化說(shuō)明。實(shí)際我們需要遍歷所有受影響的格子。 // 更高效的實(shí)現(xiàn)是只更新_isDirty為true時(shí)涉及的格子。 // 以下為概念性循環(huán) foreach (var kvp in _scaleData) { Vector3Int cell kvp.Key; float scale kvp.Value; if (scale 1.0f) continue; // 縮放為1無(wú)需特殊處理 // 計(jì)算世界空間中心點(diǎn) Vector3 worldPos _targetTilemap.GetCellCenterWorld(cell); // 創(chuàng)建以自身為中心縮放的變換矩陣 Matrix4x4 customMatrix Matrix4x4.TRS( worldPos, Quaternion.identity, new Vector3(scale, scale, 1f) ); // 關(guān)鍵步驟將這個(gè)自定義矩陣設(shè)置給這個(gè)格子對(duì)應(yīng)的渲染數(shù)據(jù)。 // 我們需要找到spriteBatch中對(duì)應(yīng)這個(gè)cell的渲染項(xiàng)。 // 此處涉及對(duì)SpriteBatch內(nèi)部數(shù)據(jù)的查找和修改需要用到更底層的方法。 _matrixCache[cell] customMatrix; // 緩存起來(lái) // 實(shí)際設(shè)置矩陣的代碼需要在SpriteBatch的API中操作見下一節(jié) } _isDirty false; } }上面的代碼勾勒出了框架但最關(guān)鍵的一步——UpdateTileMatrices中如何將矩陣設(shè)置給渲染器——我們用了注釋。因?yàn)橹苯硬僮鱏priteBatch是相對(duì)底層的操作Unity的公開API沒(méi)有直接提供這個(gè)方法。我們需要用到反射或者自定義Shader來(lái)實(shí)現(xiàn)。這里提供兩種主流且更實(shí)用的實(shí)現(xiàn)路徑。4. 完整代碼實(shí)現(xiàn)兩種實(shí)戰(zhàn)方案由于直接通過(guò)C#代碼注入矩陣到內(nèi)置渲染流程比較晦澀我提供兩種經(jīng)過(guò)實(shí)踐驗(yàn)證、更清晰的方案。方案一利用MaterialPropertyBlock方案二使用自定義渲染通道。4.1 方案一使用MaterialPropertyBlock傳遞縮放數(shù)據(jù)推薦這個(gè)方案的核心思想是不直接修改每個(gè)瓦片的變換矩陣而是通過(guò)Shader根據(jù)瓦片的世界位置動(dòng)態(tài)計(jì)算縮放。我們?cè)诳刂破骼镉?jì)算好每個(gè)需要縮放的格子的“縮放值”和“位置”然后通過(guò)MaterialPropertyBlock以數(shù)組形式傳遞給Tilemap的材質(zhì)。Shader根據(jù)當(dāng)前渲染的像素是否在目標(biāo)格子范圍內(nèi)來(lái)決定是否應(yīng)用縮放。步驟1修改TileScaleControllerusing System.Collections.Generic; using UnityEngine; using UnityEngine.Tilemaps; public class TileScaleController : MonoBehaviour { public Tilemap targetTilemap; private MaterialPropertyBlock _propertyBlock; private static readonly int ScaleDataArrayID Shader.PropertyToID(_ScaleData); private static readonly int ScaleDataLengthID Shader.PropertyToID(_ScaleDataLength); private static readonly int CellSizeID Shader.PropertyToID(_CellSize); [System.Serializable] public struct TileScaleInfo { public Vector3 worldPosition; // 格子中心世界坐標(biāo) public float scale; } public ListTileScaleInfo activeScaledTiles new ListTileScaleInfo(); private DictionaryVector3Int, int _tileIndexMap new DictionaryVector3Int, int(); void Start() { if (targetTilemap null) targetTilemap GetComponentTilemap(); _propertyBlock new MaterialPropertyBlock(); targetTilemap.GetPropertyBlock(_propertyBlock); // 獲取現(xiàn)有的 UpdateShaderData(); } void Update() { // 每幀更新MaterialPropertyBlock確保數(shù)據(jù)同步 if (targetTilemap.HasPropertyBlock()) { targetTilemap.GetPropertyBlock(_propertyBlock); } UpdateShaderData(); targetTilemap.SetPropertyBlock(_propertyBlock); } public void SetTileScale(Vector3Int cellPosition, float scale) { Vector3 worldPos targetTilemap.GetCellCenterWorld(cellPosition); if (_tileIndexMap.TryGetValue(cellPosition, out int index)) { // 更新已有項(xiàng) var info activeScaledTiles[index]; info.scale scale; activeScaledTiles[index] info; } else { // 新增項(xiàng) activeScaledTiles.Add(new TileScaleInfo { worldPosition worldPos, scale scale }); _tileIndexMap[cellPosition] activeScaledTiles.Count - 1; } } public void ClearTileScale(Vector3Int cellPosition) { if (_tileIndexMap.TryGetValue(cellPosition, out int index)) { // 簡(jiǎn)單做法將縮放設(shè)為1而不是移除避免數(shù)組索引錯(cuò)亂。 // 更健壯的做法是使用List并管理索引這里為簡(jiǎn)化用前者。 var info activeScaledTiles[index]; info.scale 1.0f; activeScaledTiles[index] info; _tileIndexMap.Remove(cellPosition); } } private void UpdateShaderData() { if (_propertyBlock null) return; // 將List數(shù)據(jù)轉(zhuǎn)換為Shader能接受的數(shù)組 Vector4[] scaleDataArray new Vector4[activeScaledTiles.Count]; for (int i 0; i activeScaledTiles.Count; i) { var info activeScaledTiles[i]; // Vector4的xyzw存儲(chǔ): (世界位置.x, 世界位置.y, 縮放, 0) scaleDataArray[i] new Vector4(info.worldPosition.x, info.worldPosition.y, info.scale, 0); } _propertyBlock.SetVectorArray(ScaleDataArrayID, scaleDataArray); _propertyBlock.SetInt(ScaleDataLengthID, scaleDataArray.Length); // 傳遞格子大小用于在Shader中判斷像素屬于哪個(gè)格子 Vector3 cellSize targetTilemap.cellSize; _propertyBlock.SetVector(CellSizeID, new Vector4(cellSize.x, cellSize.y, 0, 0)); } }步驟2編寫自定義ShaderUnlit Shader Graph 或 Surface Shader這里以Shader Graph為例說(shuō)明原理。你需要?jiǎng)?chuàng)建一個(gè)Unlit Shader Graph。暴露參數(shù)在Graph的Blackboard中創(chuàng)建三個(gè)屬性_ScaleData(類型Vector4 Array)_ScaleDataLength(類型Integer)_CellSize(類型Vector2)流程設(shè)計(jì)獲取像素世界位置使用Position節(jié)點(diǎn)空間選擇World。循環(huán)判斷使用For Loop節(jié)點(diǎn)循環(huán)次數(shù)為_ScaleDataLength。在循環(huán)體內(nèi)通過(guò)Array Element節(jié)點(diǎn)用循環(huán)的Index獲取_ScaleData數(shù)組中的一項(xiàng)一個(gè)Vector4。從該項(xiàng)中提取.xy作為目標(biāo)格子中心世界坐標(biāo)提取.z作為縮放系數(shù)。計(jì)算當(dāng)前像素世界位置與目標(biāo)格子中心的絕對(duì)距離Absolute(Distance)。判斷這個(gè)距離是否小于半個(gè)格子大小_CellSize * 0.5。這里可以稍微加點(diǎn)容差。如果判斷為真則說(shuō)明當(dāng)前像素位于需要縮放的格子內(nèi)。我們可以計(jì)算一個(gè)基于距離的平滑權(quán)重可選然后利用這個(gè)權(quán)重對(duì)UV坐標(biāo)進(jìn)行反向縮放因?yàn)榉糯髨D像實(shí)際是縮小UV采樣范圍或者更直接地計(jì)算一個(gè)偏移向量。應(yīng)用UV變換將計(jì)算出的UV偏移或縮放因子應(yīng)用到Texture Sample節(jié)點(diǎn)的UV輸入上。實(shí)操心得在Shader中精確匹配格子邊界可能因?yàn)楦↑c(diǎn)數(shù)精度產(chǎn)生接縫。一個(gè)常見的技巧是在判斷時(shí)使用step或smoothstep函數(shù)并給予一個(gè)很小的容差值如0.01或者直接基于像素世界位置對(duì)齊到網(wǎng)格坐標(biāo)再進(jìn)行判斷這樣更精確。方案一優(yōu)缺點(diǎn)優(yōu)點(diǎn)邏輯清晰與Tilemap標(biāo)準(zhǔn)渲染流程兼容性好不需要深入底層渲染API。缺點(diǎn)需要在Shader中做每像素的距離判斷如果需要縮放的格子很多可能會(huì)增加Shader計(jì)算復(fù)雜度。傳遞數(shù)組有長(zhǎng)度限制具體取決于平臺(tái)和Unity版本。4.2 方案二使用CommandBuffer進(jìn)行后期縮放更靈活方案二思路完全不同我們不在Tilemap渲染時(shí)修改每個(gè)瓦片而是在整個(gè)Tilemap渲染到一張中間紋理后再通過(guò)一個(gè)后期處理對(duì)紋理上特定的區(qū)域?qū)?yīng)棋盤格子進(jìn)行縮放。這更像一個(gè)全屏后處理效果但只針對(duì)特定坐標(biāo)。步驟1創(chuàng)建縮放后期處理腳本using UnityEngine; using UnityEngine.Rendering; public class TileScalePostProcessing : MonoBehaviour { public TileScaleController scaleController; // 關(guān)聯(lián)之前的控制器 public Material scaleMaterial; // 一個(gè)特殊的材質(zhì)用于屏幕局部縮放 private CommandBuffer _commandBuffer; private Camera _mainCamera; void OnEnable() { _mainCamera Camera.main; if (_mainCamera null) return; _commandBuffer new CommandBuffer { name Tile Scale Overlay }; // 假設(shè)scaleMaterial有一個(gè)Pass它能讀取_ScaledTiles等紋理并做處理 // 這里需要scaleController把縮放格子信息渲染到一張RenderTexture上 _commandBuffer.Blit(null, BuiltinRenderTextureType.CameraTarget, scaleMaterial); _mainCamera.AddCommandBuffer(CameraEvent.AfterForwardOpaque, _commandBuffer); } void OnDisable() { if (_mainCamera ! null _commandBuffer ! null) { _mainCamera.RemoveCommandBuffer(CameraEvent.AfterForwardOpaque, _commandBuffer); } _commandBuffer?.Release(); } void Update() { // 每幀更新scaleMaterial所需的參數(shù)例如傳遞scaleController.activeScaledTiles數(shù)組 if (scaleMaterial ! null scaleController ! null) { // 將縮放信息位置、縮放值打包到一個(gè)Texture2D或ComputeBuffer傳遞給Shader // 這部分是數(shù)據(jù)傳輸?shù)木唧w實(shí)現(xiàn)略復(fù)雜 } } }步驟2編寫后期處理Shader這個(gè)Shader是一個(gè)全屏Shader。它接收一張由Tilemap渲染的_MainTex即Camera的源紋理。一個(gè)包含了所有縮放格子信息位置、半徑、縮放強(qiáng)度的緩沖區(qū)。在Fragment Shader中對(duì)于每一個(gè)屏幕像素將其UV轉(zhuǎn)換為世界坐標(biāo)。遍歷所有縮放格子信息。如果該像素在世界坐標(biāo)上位于某個(gè)縮放格子的影響范圍內(nèi)則計(jì)算一個(gè)新的UV坐標(biāo)。這個(gè)新UV是相對(duì)于該格子中心進(jìn)行縮放的(originalUV - centerUV) / scale centerUV。用新的UV去采樣_MainTex得到縮放后的顏色。方案二優(yōu)缺點(diǎn)優(yōu)點(diǎn)極其靈活可以實(shí)現(xiàn)各種復(fù)雜的屏幕空間變形效果不局限于Tilemap任何SpriteRenderer都能生效。性能開銷相對(duì)恒定與屏幕分辨率相關(guān)與縮放格子數(shù)量關(guān)系不大。缺點(diǎn)實(shí)現(xiàn)更復(fù)雜涉及CommandBuffer、RenderTexture管理需要處理渲染順序和透明混合問(wèn)題。如果多個(gè)物體疊加后期處理可能難以區(qū)分層級(jí)。4.3 方案選擇與代碼整合建議對(duì)于大多數(shù)2D棋盤游戲方案一MaterialPropertyBlock Shader是更推薦的選擇。它更貼近Tilemap的渲染本質(zhì)性能可預(yù)測(cè)且不會(huì)引入后期處理可能帶來(lái)的渲染順序問(wèn)題。方案二更適合需要全局、非線性變形特效的場(chǎng)景。這里給出方案一的簡(jiǎn)化版整合示例假設(shè)我們使用一個(gè)預(yù)設(shè)好的Shader它已經(jīng)實(shí)現(xiàn)了根據(jù)_ScaleDataArray進(jìn)行格子內(nèi)縮放的功能。// 附加到Tilemap上的完整控制器簡(jiǎn)化版 using System.Collections.Generic; using UnityEngine; using UnityEngine.Tilemaps; [RequireComponent(typeof(Tilemap))] public class SimpleTileScaleController : MonoBehaviour { public Material scaledTileMaterial; // 使用了我們自定義Shader的材質(zhì)球 private Tilemap _tilemap; private MaterialPropertyBlock _mpb; private ListVector4 _scaleDataList new ListVector4(); private int _scaleDataID; private int _dataLengthID; void Awake() { _tilemap GetComponentTilemap(); _mpb new MaterialPropertyBlock(); _scaleDataID Shader.PropertyToID(_ScaleData); _dataLengthID Shader.PropertyToID(_DataLength); // 確保Tilemap使用我們的特殊材質(zhì) var renderer _tilemap.GetComponentTilemapRenderer(); if (scaledTileMaterial ! null) { renderer.material scaledTileMaterial; } } void LateUpdate() { UpdatePropertyBlock(); } public void AddOrUpdateScale(Vector3Int cell, float scale) { Vector3 worldPos _tilemap.GetCellCenterWorld(cell); // 查找是否已存在 for(int i 0; i _scaleDataList.Count; i) { Vector4 data _scaleDataList[i]; if (Vector2.Distance(new Vector2(data.x, data.y), new Vector2(worldPos.x, worldPos.y)) 0.1f) { data.z scale; _scaleDataList[i] data; return; } } // 新增 _scaleDataList.Add(new Vector4(worldPos.x, worldPos.y, scale, 0)); } public void RemoveScale(Vector3Int cell) { Vector3 worldPos _tilemap.GetCellCenterWorld(cell); for (int i _scaleDataList.Count - 1; i 0; i--) { Vector4 data _scaleDataList[i]; if (Vector2.Distance(new Vector2(data.x, data.y), new Vector2(worldPos.x, worldPos.y)) 0.1f) { _scaleDataList.RemoveAt(i); break; } } } private void UpdatePropertyBlock() { if (_tilemap null) return; _tilemap.GetPropertyBlock(_mpb); _mpb.SetInt(_dataLengthID, _scaleDataList.Count); if (_scaleDataList.Count 0) { _mpb.SetVectorArray(_scaleDataID, _scaleDataList.ToArray()); } _tilemap.SetPropertyBlock(_mpb); } }這個(gè)簡(jiǎn)化版在LateUpdate中持續(xù)更新屬性塊。在實(shí)際項(xiàng)目中你應(yīng)該在縮放值發(fā)生變化時(shí)才調(diào)用UpdatePropertyBlock()以避免不必要的每幀更新。5. 應(yīng)用場(chǎng)景與效果擴(kuò)展實(shí)現(xiàn)了基礎(chǔ)縮放后你可以輕松地將它融入到游戲邏輯中創(chuàng)造出豐富的交互效果。5.1 動(dòng)態(tài)交互效果棋子選中高亮當(dāng)玩家點(diǎn)擊或鼠標(biāo)懸停在一個(gè)單位上時(shí)調(diào)用SetTileScale(cell, 1.2f)使其微微放大配合顏色變化提示選中狀態(tài)。取消選中時(shí)調(diào)用ClearTileScale。// 在玩家的輸入控制腳本中 void HandleClick(Vector3 worldPos) { Vector3Int cell _gameGridTilemap.WorldToCell(worldPos); if (IsValidUnitCell(cell)) { // 先清除上一個(gè)選中的 if (_lastSelectedCell ! null) _scaleController.ClearTileScale(_lastSelectedCell.Value); // 放大當(dāng)前選中的 _scaleController.SetTileScale(cell, 1.2f); _lastSelectedCell cell; } }技能范圍指示器當(dāng)玩家選擇一個(gè)技能時(shí)計(jì)算出技能影響的范圍格子列表然后遍歷這些格子將其中的棋子瓦片放大并改變顏色通過(guò)修改Tilemap的SetColor或Shader中的顏色參數(shù)清晰展示作用目標(biāo)。public void HighlightArea(ListVector3Int areaCells, float scale, Color tintColor) { foreach (var cell in areaCells) { _scaleController.SetTileScale(cell, scale); _tilemap.SetColor(cell, tintColor); // 同時(shí)修改顏色 } }狀態(tài)變化反饋當(dāng)單位獲得“巨大化”Buff時(shí)持續(xù)將其縮放設(shè)為1.5f當(dāng)處于“縮小”Debuff時(shí)設(shè)為0.8f。Buff結(jié)束時(shí)恢復(fù)為1.0f。5.2 結(jié)合動(dòng)畫系統(tǒng)單純的跳變縮放會(huì)很生硬。我們可以結(jié)合Mathf.Lerp或DOTween等動(dòng)畫插件實(shí)現(xiàn)平滑的縮放動(dòng)畫。using DG.Tweening; // 使用DOTween插件 public void AnimateTileScale(Vector3Int cell, float targetScale, float duration) { float currentScale _scaleController.GetTileScale(cell); DOTween.To(() currentScale, x _scaleController.SetTileScale(cell, x), targetScale, duration) .SetEase(Ease.OutBack); // 添加一個(gè)回彈效果 }這樣棋子的放大縮小就會(huì)帶有平滑的動(dòng)畫視覺(jué)體驗(yàn)大幅提升。5.3 視覺(jué)與邏輯的同步問(wèn)題正如之前提到的這只是視覺(jué)縮放。棋子的邏輯位置cell和碰撞體如果Tilemap Collider 2D使用了此瓦片并沒(méi)有改變。這通常是我們期望的——棋子邏輯上還在那個(gè)格子里只是看起來(lái)大了。但有些情況下你需要同步自定義碰撞檢測(cè)如果你需要根據(jù)放大后的視覺(jué)大小進(jìn)行更精確的碰撞如鼠標(biāo)點(diǎn)選你不能再依賴格子坐標(biāo)。你需要根據(jù)縮放后的瓦片世界邊界單元格中心 ± (單元格大小 * 縮放系數(shù) / 2)來(lái)進(jìn)行自定義的物理檢測(cè)如Physics2D.OverlapPoint。UI附著如果棋子頭頂有血條、名字等UI你需要讓UI跟隨棋子視覺(jué)中心移動(dòng)。這時(shí)需要計(jì)算縮放后瓦片的視覺(jué)中心世界坐標(biāo)它其實(shí)和邏輯中心GetCellCenterWorld是一樣的因?yàn)槲覀兪蔷鶆蚩s放。但如果你未來(lái)實(shí)現(xiàn)了非均勻縮放或旋轉(zhuǎn)就需要用矩陣變換去計(jì)算頂點(diǎn)的世界位置了。6. 性能優(yōu)化與常見問(wèn)題排查6.1 性能優(yōu)化要點(diǎn)減少每幀更新只在縮放數(shù)據(jù)真正發(fā)生變化時(shí)更新MaterialPropertyBlock或CommandBuffer。使用_isDirty這樣的標(biāo)志位來(lái)控制。控制數(shù)據(jù)量方案一中傳遞給Shader的數(shù)組不宜過(guò)大。如果一屏內(nèi)需要?jiǎng)討B(tài)縮放的棋子很多比如超過(guò)50個(gè)需要考慮分幀更新或使用更高效的數(shù)據(jù)結(jié)構(gòu)如ComputeBuffer。Shader優(yōu)化在Shader的循環(huán)中盡早使用break一旦找到匹配的格子就跳出循環(huán)?？紤]將格子信息按照空間分區(qū)如網(wǎng)格傳遞給Shader減少每個(gè)像素需要遍歷的數(shù)量。對(duì)于移動(dòng)設(shè)備復(fù)雜的逐像素判斷可能會(huì)成為瓶頸需進(jìn)行性能測(cè)試。批處理破壞使用MaterialPropertyBlock本身不會(huì)破壞Tilemap的靜態(tài)合批但如果你為Tilemap設(shè)置了不同的材質(zhì)實(shí)例material instance則可能會(huì)造成批處理中斷。確保所有使用此縮放系統(tǒng)的Tilemap盡量共享材質(zhì)實(shí)例。6.2 常見問(wèn)題與解決方案問(wèn)題1縮放后瓦片邊緣出現(xiàn)接縫或閃爍。原因Shader中判斷像素是否屬于某個(gè)格子的邏輯不精確存在浮點(diǎn)數(shù)誤差導(dǎo)致邊緣像素在“屬于”和“不屬于”之間搖擺。解決在距離判斷時(shí)增加一個(gè)小的容差epsilon例如0.005?；蛘吒€(wěn)健的方法是將像素的世界坐標(biāo)反向轉(zhuǎn)換為單元格坐標(biāo)WorldToCell然后判斷該單元格坐標(biāo)是否在需要縮放的列表中這樣判斷是離散且精確的。但這需要在Shader中訪問(wèn)Tilemap的變換信息實(shí)現(xiàn)稍復(fù)雜。問(wèn)題2縮放時(shí)瓦片看起來(lái)被“拉伸”了而不是以中心點(diǎn)放大。原因縮放矩陣的原點(diǎn)不對(duì)。確保你使用的是Matrix4x4.TRS并且平移參數(shù)位置是該格子中心的世界坐標(biāo)。如果你錯(cuò)誤地使用了格子左下角或其他點(diǎn)作為原點(diǎn)就會(huì)出現(xiàn)拉伸。解決再次確認(rèn)worldPos的計(jì)算是tilemap.GetCellCenterWorld(cellPosition)。問(wèn)題3在移動(dòng)設(shè)備上幀率明顯下降。原因每幀更新的格子太多或Shader計(jì)算過(guò)于復(fù)雜。解決進(jìn)行性能剖析Profiler查看是CPU端更新數(shù)據(jù)還是GPU端Shader的瓶頸。限制同時(shí)具有動(dòng)態(tài)縮放效果的棋子數(shù)量。簡(jiǎn)化Shader減少循環(huán)次數(shù)和復(fù)雜運(yùn)算?？梢钥紤]將縮放效果“烘焙”成簡(jiǎn)單的Sprite動(dòng)畫對(duì)于固定模式的縮放如選中態(tài)用Animation Tile替代動(dòng)態(tài)計(jì)算。問(wèn)題4縮放效果對(duì)某些自定義的Tile如Rule Tile、Animated Tile不生效。原因自定義Tile可能重寫了GetTileData方法返回了不同的Sprite或數(shù)據(jù)。我們的縮放系統(tǒng)依賴于特定的Tile類型如ScalableTile或通過(guò)位置信息判斷。解決在SetTileScale方法中不要檢查Tile類型或者擴(kuò)展檢查邏輯將你需要支持的所有Tile類型都加入白名單。更好的設(shè)計(jì)是不依賴Tile類型而是維護(hù)一個(gè)獨(dú)立于Tile數(shù)據(jù)的“格子狀態(tài)字典”只關(guān)心位置。問(wèn)題5如何實(shí)現(xiàn)非均勻縮放只拉寬或拉高解決非常簡(jiǎn)單。在創(chuàng)建縮放矩陣或傳遞縮放數(shù)據(jù)時(shí)將Vector3的x和y分量設(shè)置為不同的值即可。例如new Vector3(1.5f, 1.0f, 1f)表示只橫向放大1.5倍。在Shader中處理時(shí)也需要分別對(duì)UV的x和y分量進(jìn)行不同的縮放計(jì)算。