在有些需求中会遇到,当鼠标滑过某个UI物体上方时,为了提醒用户该物体是可以交互时,我们需要添加一个动效和提示音。这样可以提高产品的体验感。
! N( @! U# R" `) h" y一、解决方案
, Z$ L0 {2 q Q3 u) d; v$ C5 Z- S1、给需要有动画的物体制作相应的Animation动画。(相同动效可以使用同一动画复用), ]- f6 s4 d$ H
2、给需要有动画的物体添加脚本。脚本如下:8 L$ S$ ^9 g$ B$ l( O9 t" A' x
- 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物体)
" T7 ^8 Y& A* V6 c& o" |- OnMouseEnter() 鼠标进入
- OnMouseExit() 鼠标离开
% S8 G4 r+ M/ m! G 0 M+ u. I# G; T
二、3D物体
4 e% M6 D* v. F7 R! J
0 a& a) }8 y) D, K( d
OnMouseEnter(),OnMouseExit()都是通过collider触发的,且碰撞器不能是trigger,鼠标进入,或离开collider时,自动调用这两个函数。
' A: V R0 ~+ A! ? 另外,OnMouseOver()类似,与OnMouseEnter()区别是,OnMouseOver()会当鼠标在该物体上collider内时,每帧调用1次,OnMouseEnter()仅在鼠标进入时调用1次。7 ]) ^+ e7 E5 l" q9 m
二、UI
6 I- `' a7 c* K* |. n UI部分通过eventTrigger组件实现类似功能) @: V9 C: ^- M; B. [: J$ z7 m
- 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()方法中实现逐帧渐变效果。
; A0 w1 Q! R, F C i
1 ~2 v0 S) R5 a |