Unity 实现鼠标滑过UI时触发动画的操作

在有些需求中会遇到，当鼠标滑过某个ui物体上方时，为了提醒用户该物体是可以交互时，我们需要添加一个动效和提示音。这样可以提高产品的体验感。

解决方案

1、给需要有动画的物*作相应的animation动画。（相同动效可以使用同一动画复用）

2、给需要有动画的物体添加脚本。脚本如下：

using system;
using system.collections;
using system.collections.generic;
using unityengine;
using unityengine.eventsystems;
public class onbtnenter : monobehaviour, ipointerenterhandler,ipointerexithandler
{
    //鼠标进入按钮触发音效和动画
    public void onpointerenter(pointereventdata eventdata)
    {
      //  audiomanager.audiomanager.playenteraudio();//这里可以将播放触发提示音放在这里，没有可以提示音可以将该行注释掉
        if (gameobject.getcomponent<animation>()!=null) {
            if ( gameobject.getcomponent<animation>() .isplaying) {
                return;
            }
            gameobject.getcomponent<animation>().wrapmode = wrapmode.loop;
            gameobject.getcomponent<animation>().play();
        }
    }
//鼠标离开时关闭动画
    public void onpointerexit(pointereventdata eventdata)
    {
        if ( gameobject.getcomponent<animation>() != null )
        {
            if ( gameobject.getcomponent<animation>().isplaying )
            {
                gameobject.getcomponent<animation>().wrapmode = wrapmode.once;
                return;               
            }
            gameobject.getcomponent<animation>().stop();
        }
    }
}

补充：unity 通过onmouseenter()，onmouseexit()实现鼠标悬停时各种效果（ui+3d物体）

onmouseenter() 鼠标进入

onmouseexit() 鼠标离开

一、3d物体

onmouseenter()，onmouseexit()都是通过collider触发的，且碰撞器不能是trigger，鼠标进入，或离开collider时，自动调用这两个函数。

另外，onmouseover()类似，与onmouseenter()区别是，onmouseover()会当鼠标在该物体上collider内时，每帧调用1次，onmouseenter()仅在鼠标进入时调用1次。

二、ui

ui部分通过eventtrigger组件实现类似功能

using system.collections;
using system.collections.generic;
using unityengine;
using unityengine.ui;//使用text，image组件
public class eventtriggrttest : monobehaviour { 
    public image image;
    float coloralpha = 0f;//图片透明程度
    public float speed = 0.75f;
 
    bool flag = false;
    private void start()
    {
        image.getcomponent<image>().color = new color(255, 255, 255, coloralpha);
    }
    void update()
    {
    //    debug.log("onmouseenter");
        if(flag == true)
        {
            if (coloralpha <= 0.75)
            {
                coloralpha += time.deltatime * speed;
                image.getcomponent<image>().color = new color(255, 255, 255, coloralpha);
            }
 
        }
           debug.log(coloralpha);
    }
    public void onmouseenter()
    {
        flag = true;
    }
    public void onmouseexit()
    {
        //    debug.log("onmouseexit");
        flag = false;
            coloralpha = 0;
            image.getcomponent<image>().color = new color(255, 255, 255, coloralpha);       
    }    
}

因ui无法使用onmouseover()，所以想实现渐变效果，可通过添加一个bool flag判断，在update()方法中实现逐帧渐变效果。

以上为个人经验，希望能给大家一个参考，也希望大家多多支持。如有错误或未考虑完全的地方，望不吝赐教。