3-4 修复地图单元坐标

发表于 分类于 本文字数： 893 阅读时长 ≈ 1 分钟

　　在上一章中我们实现了通过UI设置地图单元的高度，点击任意一个地图单元后，该地图单元的高度会根据UI的值发生改变。但是跟随地图单元的坐标文字却没有随着改变，在这一章中我们来解决这个问题。
　　要让地图单元的坐标发生改变，就要让每个地图单元获取到自身UI的RectTransform实例，以便接下来改变其高度。

HexCell.cs
1
2
3
4
5
6
7
public class HexCell : MonoBehaviour
{
    //自身坐标UI的RectTransform组件实例
    public RectTransform uiRect;
    
    …
}

　　回到HexGrid.cs中，在CreateCell方法的最后，让每个地图单元获取其UI的RectTransform组件实例

HexGrid.cs
1
2
3
4
5
6
7
private void CreateCell(int x, int z, int i)
{
    …

    //获取cell对应UI的rectTransform组件实例
    cell.uiRect = label.rectTransform;
}

　　现在，我们就可以在HexCell.Elevation.set方法中进行对应UI高度的设置了。这里要注意，我们之前在设置地图单元做标canvas的时候，在x方向旋转了90度。所以这里应该是在z轴负方向进行高度设置，而不是y轴。

HexCell.cs
1
2
3
4
5
6
7
8
9
10
11
12
13
14
public int Elevation
{
    …

    set
    {
        …

        //设置cell对应UI的高度
        Vector3 uiPosition = uiRect.localPosition;
        uiPosition.z = elevation * (-HexMetrics.elevationStep);
        uiRect.localPosition = uiPosition;
    }
}

　　这样，我们在UI上设置好高度后，点击任意地图单元，其对应的地图坐标会随着被点击的地图单元高度变化而变化。

　　现在地图单元的UI显示已经修复了。在下一章中，我们来修复两个相邻且高度不同的地图单元之间连接区域断开的问题。

Github代码