Unity关于新手引导中实现遮罩镂空效果

这篇具有很好参考价值的文章主要介绍了Unity关于新手引导中实现遮罩镂空效果。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

在新手引导每一步中实现可以遮掉其他部分而显示当前需要点击的部分,只需要在每一步引导的时候设置对应的镂空区域的RectTransform.效果如下图:

Unity关于新手引导中实现遮罩镂空效果,unity,游戏引擎

代码:文章来源地址https://www.toymoban.com/news/detail-807111.html

public class SelfMaskSet : MaskableGraphic, ICanvasRaycastFilter
{
    [SerializeField]
    public RectTransform _target;

    private Vector3 _targetMin = Vector3.zero;
    private Vector3 _targetMax = Vector3.zero;

    private bool _canRefresh = true;
    private Transform _cacheTrans = null;

    /// <summary>
    /// 设置镂空的目标
    /// </summary>
    public void SetTarget(RectTransform target)
    {
        _canRefresh = true;
        _target = target;
        _RefreshView();
    }

    private void _SetTarget(Vector3 tarMin, Vector3 tarMax)
    {
        if (tarMin == _targetMin && tarMax == _targetMax)
            return;
        _targetMin = tarMin;
        _targetMax = tarMax;
        SetAllDirty();
    }

    private void _RefreshView()
    {
        if (!_canRefresh) return;
        _canRefresh = false;

        if (null == _target)
        {
            _SetTarget(Vector3.zero, Vector3.zero);
            SetAllDirty();
        }
        else
        {
            Bounds bounds = RectTransformUtility.CalculateRelativeRectTransformBounds(_cacheTrans, _target);
            _SetTarget(bounds.min, bounds.max);
        }
    }

    protected override void OnPopulateMesh(VertexHelper vh)
    {
        if (_targetMin == Vector3.zero && _targetMax == Vector3.zero)
        {
            base.OnPopulateMesh(vh);
            return;
        }

        vh.Clear();

        // 填充顶点
        UIVertex vert = UIVertex.simpleVert;
        vert.color = color;

        Vector2 selfPiovt = rectTransform.pivot;
        Rect selfRect = rectTransform.rect;
        float outerLx = -selfPiovt.x * selfRect.width;
        float outerBy = -selfPiovt.y * selfRect.height;
        float outerRx = (1 - selfPiovt.x) * selfRect.width;
        float outerTy = (1 - selfPiovt.y) * selfRect.height;
        // 0 - Outer:LT
        vert.position = new Vector3(outerLx, outerTy);
        vh.AddVert(vert);
        // 1 - Outer:RT
        vert.position = new Vector3(outerRx, outerTy);
        vh.AddVert(vert);
        // 2 - Outer:RB
        vert.position = new Vector3(outerRx, outerBy);
        vh.AddVert(vert);
        // 3 - Outer:LB
        vert.position = new Vector3(outerLx, outerBy);
        vh.AddVert(vert);

        // 4 - Inner:LT
        vert.position = new Vector3(_targetMin.x-10, _targetMax.y +10);
        vh.AddVert(vert);
        // 5 - Inner:RT
        vert.position = new Vector3(_targetMax.x + 10, _targetMax.y + 10);
        vh.AddVert(vert);
        // 6 - Inner:RB
        vert.position = new Vector3(_targetMax.x +10, _targetMin.y -10);
        vh.AddVert(vert);
        // 7 - Inner:LB
        vert.position = new Vector3(_targetMin.x -10, _targetMin.y-10);
        vh.AddVert(vert);

        // 设定三角形
        vh.AddTriangle(4, 0, 1);
        vh.AddTriangle(4, 1, 5);
        vh.AddTriangle(5, 1, 2);
        vh.AddTriangle(5, 2, 6);
        vh.AddTriangle(6, 2, 3);
        vh.AddTriangle(6, 3, 7);
        vh.AddTriangle(7, 3, 0);
        vh.AddTriangle(7, 0, 4);
    }

    bool ICanvasRaycastFilter.IsRaycastLocationValid(Vector2 screenPos, Camera eventCamera)
    {
        if (null == _target) return true;
        // 将目标对象范围内的事件镂空(使其穿过)
        return !RectTransformUtility.RectangleContainsScreenPoint(_target, screenPos, eventCamera);
    }

    protected override void Awake()
    {
        base.Awake();
        _cacheTrans = GetComponent<RectTransform>();
    }

    void Update()
    {
        _canRefresh = true;
        _RefreshView();
    }

    public void OnButtonClick() 
    {
        Debug.Log("测试镂空区域!");
    }
}

到了这里,关于Unity关于新手引导中实现遮罩镂空效果的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Unity | 简单高效的强制新手引导

      游戏中的新手引导可以帮助玩家快速了解游戏规则和操作方式,对于玩家体验来说非常重要 实现强制新手引导有很多种方式,这里基于 OnPopulateMesh 方法,相比 Shader、Mask 等方式,该方法通过减少 DrawCall 来提高 UI 渲染性能 点击镂空区域按的钮触发对应事件 3.1 构成分析 强

    2024年01月18日
    浏览(35)
  • Unity Shader ASE基础效果思路与代码(一):遮罩、硬边溶解、光边溶解、UV扰动

    效果展示: 思路与代码 :主纹理和遮罩纹理相乘,其中,两个纹理给到UV流动 步骤与详解 :panner节点:平移 效果展示: 思路与代码 :原图和噪声贴图的透明通道混合,改变噪声贴图的透明度即可 步骤与详解 : 在SubShader中关掉深度写入,混合模式为Alpha Blend,Tags设为透明

    2024年02月22日
    浏览(51)
  • Unity 问题 之 UGUI 的 Mask 真机打包的遮罩效果失效问题的简单处理

    Unity 问题整理,自己整理的一些游戏开发遇到的问题做简单整理,方便游戏开发。 本节介绍,在使用 cardboard 做 XR 开发中,在使用 Mask  遮罩的时候,编辑器下 Mask 的 遮罩效果正常,但是运行到真机上,Mask 的遮罩效果却失效了,这里简单说明,如果你有更好的方法,欢迎留

    2024年02月15日
    浏览(51)
  • Unity实现杀戮尖塔出牌效果( 三. 贝塞尔曲线引导箭头绘制,卡牌使用效果制作)

    1. 攻击类型卡牌 ①拖拽超过一定高度之后卡牌会移动到手牌中心位置 ②出现攻击引导箭头 (塞贝尔曲线) ③成功指向目标怪物后打出 2. 技能能力类型卡牌 ①可自由拖动 ②脱离手牌高度后打出 这里只展示此效果核心代码内容,重复代码不做赘述,上期(二.鼠标指向卡牌时,

    2024年04月12日
    浏览(57)
  • unity中实现碰撞效果(无废话),不用代码,简单好抄

     1.首先建立2个物理静态精灵并设置他们的颜色。 2.给两个物体添加碰撞器组件     3.给物体添加刚体属性将静态的改为Dynamic,这里可以两个都添加,也可以只添加其中一个物体的  4.将重力大小设置为0,不然运行的时候物体会直接掉下去  5.运行游戏并随便选择旁边刚刚创

    2024年01月17日
    浏览(74)
  • 使用DoTween插件在Unity中实现物体或场景的振动效果

    在Unity中,我们可以使用DoTween插件来实现物体或场景的振动效果。DoTween是一个功能强大的插件,可以简化动画的创建和管理过程,并提供了丰富的插值和缓动函数,使得振动效果的实现变得更加容易。 首先,我们需要确保已经安装了DoTween插件,并将其导入到Unity项目中。接

    2024年04月17日
    浏览(71)
  • CSS mask 实现鼠标跟随镂空效果,阿里面试官必问

    }` 效果如下: 已经全部都模糊了,只是圆形区域外暗一些。由于::before的尺寸占据整个容器,所以整个背后都变模糊了,圆形外部比较暗是因为半透明渐变的影响。 总之还是不能满足我们的需求,需要寻求新的解决方式。 五、CSS MASK 实现镂空 与其说是让圆形区域不模糊,还

    2024年04月25日
    浏览(60)
  • 【Unity小技巧】Unity中实现带有Sprite Shape的2D水效果(附项目源码)

    本文是自己的学习笔记,最近发现一个很有意思的2d水效果,所以把它的实现过程写下来分享给大家。 当在 Unity 中实现带有 Sprite Shape 的 2D 水效果时,首先需要理解 Sprite Shape 和水效果的基本概念和工作原理。Sprite Shape 是 Unity 提供的一种 2D 图形工具,用于创建基于轮廓的精

    2024年02月21日
    浏览(39)
  • 【Unity3D小功能】Unity3D中实现UI擦除效果、刮刮卡功能

    推荐阅读 CSDN主页 GitHub开源地址 Unity3D插件分享 简书地址 我的个人博客 大家好,我是佛系工程师 ☆恬静的小魔龙☆ ,不定时更新Unity开发技巧,觉得有用记得一键三连哦。 使用Unity3D实现UI的擦拭效果、刮刮卡功能的效果实现方式比较多,比如说用Shader、Texture渲染都是可以

    2024年02月04日
    浏览(224)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包