QQ登录

只需要一步,快速开始

APP扫码登录

只需要一步,快速开始

查看: 3043|回复: 0

[C#/.NET] Unity实现鼠标滑过UI时触发动画的操作

[复制链接]

等级头衔

积分成就    金币 : 2861
   泡泡 : 1516
   精华 : 6
   在线时间 : 1322 小时
   最后登录 : 2025-9-17

丰功伟绩

优秀达人突出贡献荣誉管理论坛元老活跃会员

联系方式
发表于 2021-4-10 22:06:25 | 显示全部楼层 |阅读模式
      在有些需求中会遇到,当鼠标滑过某个UI物体上方时,为了提醒用户该物体是可以交互时,我们需要添加一个动效和提示音。这样可以提高产品的体验感。7 y" m- S2 E! x7 D8 w8 L
一、解决方案0 [! b! N8 U5 F0 D
1、给需要有动画的物体制作相应的Animation动画。(相同动效可以使用同一动画复用)
; O& q# f. Q6 o! o2、给需要有动画的物体添加脚本。脚本如下:6 o! j  V& c# G* ^- R% f7 N. e% P
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物体)
3 d+ {& J0 U/ L; _4 k( Q
  • OnMouseEnter() 鼠标进入
  • OnMouseExit() 鼠标离开5 n( W% D+ \& z* [& c( k& i. Y9 ^# G
1 J; B3 ~1 h0 l" B; {  a
二、3D物体- R% M/ Q! g: y2 q9 d& i% p+ Q% u$ P
1.jpg . e: A/ P3 D: Z, c
       OnMouseEnter(),OnMouseExit()都是通过collider触发的,且碰撞器不能是trigger,鼠标进入,或离开collider时,自动调用这两个函数。7 V: `3 W4 D, L' v! }7 ^9 Z
       另外,OnMouseOver()类似,与OnMouseEnter()区别是,OnMouseOver()会当鼠标在该物体上collider内时,每帧调用1次,OnMouseEnter()仅在鼠标进入时调用1次。2 l6 C, K) n9 G0 x5 \- f
二、UI7 P/ X, t* R0 X, R
       UI部分通过eventTrigger组件实现类似功能  l4 z! ~9 r6 b+ p" \% ?
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()方法中实现逐帧渐变效果。
  Y9 {; Q  h: ]; P: R
) S6 G5 c1 V% C9 K# j/ t' x: q
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|手机版|小黑屋|paopaomj.COM ( 渝ICP备18007172号|渝公网安备50010502503914号 )

GMT+8, 2025-9-18 13:39

Powered by paopaomj X3.5 © 2016-2025 sitemap

快速回复 返回顶部 返回列表