Unity3D+moba+技能指示器（一）

雨点打透心脏的1/2处 2022-08-22 01:16 204阅读 0赞

## 1 功能描述 ##

类似王者荣耀，按下的技能如果是需要预判的或者是可以选择单一目标，产生一个摇杆，在地形上显示辅助的UI提示。存在以下几种情况：

1.扇形范围技能

![Center][]

2.方向性技能

![Center 1][]

3.指向范围性技能

![Center 2][]

4.指向技能

![Center 3][]

这些地形上的UI提示共性是：1.外围大圈的范围；2.内圈UI具有大小,方向，范围角度的特点

## 2 详细设计 ##

要点：

1.所有英雄的技能数量都是固定的，开始战斗时，读表载入技能。

2.Ui上技能摇杆每个都是固定，对应该英雄的第几个技能

3.技能属性有id，施法范围（大圆半径），影响范围（内圈），技能提示种类

4.每个技能摇杆要装填相对应的技能信息。

### 2.1指向范围性技能 ###

主要是摇杆上thumb与bg的相对位置转化为技能提示器上PointRange与bg

的相对位置，然后设置PointRange的loaclPosition即可。如图所示，技能会攻击上方的敌人。

![Center 4][]

### 2.2方向性技能 ###

得到摇杆thumb相对bg位置localPosition的标准化向量，然后改变Direction的方向即可。如图所示，技能会攻击下方敌人。

![Center 5][]

当摇杆移动时，方向性技能和指向范围性指示器调用如下代码:

/// <summary>
        /// 指示器位置更新
        /// </summary>
        /// <param name="skill">摇杆上绑定的技能信息</param>
        /// <param name="dir">摇杆方向向量</param>
        /// <param name="obj">激活的类型指示器</param>
        public void hintUpdate(SkillCtrl skill, Vector2 dir, GameObject obj)
        {
            float bgRange = skill.m_disRange;//施法距离
            Vector3 scale = m_bg.transform.localScale;
            scale.x = bgRange * 0.1f * 2.0f;
            scale.z = scale.x;
            m_bg.transform.localScale = scale;
    
            float smallRange = skill.m_smallRange;//影响范围
            Vector3 scaleSmall = Vector3.zero;
            if (skill.m_hintType == enSkillHintType.PointRange)
            {
                scaleSmall.x = 0.1f * smallRange * 2.0f;
                scaleSmall.z = scaleSmall.x;
            }
            else
            {
                scaleSmall.x = 0.1f * smallRange;
                scaleSmall.z = 1.0f;
            }
            scaleSmall.y = 1.0f;
            obj.transform.localScale = scaleSmall;
    
            if (skill.m_hintType == enSkillHintType.PointRange )
                obj.transform.localPosition = new Vector3(dir.x * bgRange, 0, dir.y * bgRange );
            else
            {
                Vector3 posWorld = obj.transform.position;
                obj.transform.LookAt(new Vector3(posWorld.x + dir.x, posWorld.y, posWorld.z + dir.y));
            }
    
        }

[Center]: /images/20220724/ffc19bdbf25047f78006a00b051a1faf.png
[Center 1]: /images/20220724/231d2c3087c74f7195a97fb15bf724d0.png
[Center 2]: /images/20220724/2a112ce627984405ba5ca1a3fc9be013.png
[Center 3]: /images/20220724/abb6d54aa52e4a13ae4d678948f8cae2.png
[Center 4]: /images/20220724/b3cb317c5a21466280af03edbafde844.png
[Center 5]: /images/20220724/8337534807e849ef90c3e5cf3a0c367f.png