UGUI 特效怎样在UI上裁剪
刚好碰到有人问怎样把粒子特效放到 UI 上并且能正确被 Mask 裁剪, 首先想到给粒子效果的 Shader 添加模板模仿一般 UI 的模板方式, 应该就能正确裁剪了吧, 不过没那么简单, 我们看到在一般 UI 上, 没在 Mask 下的 UI 对比在 Mask 下的 UI, 它们的材质设置是不一样的, 也就是说有哪个组件对材质进行了修改, 查了一下就是 Mask 组件, 它会收集子节点下的所有对象, 然后对可以修改的材质进行修改, 所以才能自动控制裁剪.
为了搞清楚, 这里做了一下测试:
1. 创建一个 UI Shader, 直接从 UI/Default 复制过来, 代码和內建完全一样.
2. 创建 ScrollView, 并添加一个默认图片, 添加一个 Quad 使用 MyImage 材质
普通 Image 看到材质被修改了
这个 Quad 就跟普通特效一样, 材质是没有被修改的
3. 我们创建一个类继承 MaskableGraphic 看看添加上去之后有什么效果
using UnityEngine;
using UnityEngine.UI; [ExecuteInEditMode]
public class MyUI : MaskableGraphic
{
}
看到只要它继承了MaskableGraphic 就会被 Mask 找到, 然后材质就会被设置为裁剪了. 只不过这个 Quad 的渲染已经完全跟它的模型没有任何关系了...
--------------------------------------------------------------------------------------------------------------------------
引擎提供的方法就比较简单了, 只要加一个 Sprite Mask, 外加粒子渲染器中选上 Masking 选项即可. 不过由于使用上的原因, UI 系统就只能使用相机渲染模式了, 因为 Overlay 模式不能控制显示对象, 粒子系统就无法被显示出来.
1. 添加 Sprite Mask
2. 粒子效果打开 Masking, 让它在 Mask 范围内显示
这样就能在 Sprite Mask 范围内显示了, 不过官方提供的方法如果越简单, 出问题的几率就越大, 果然, 如果有多个 Sprite Mask 的话, 它们之间即使没有层级关系, 也是会穿插的...
同一个层级的两个 Mask, 两个粒子发射器发射不同颜色的球, 结果粒子能在另一个 Sprite Mask 中显示出来...
接下来看看它们在 Scroll View 中的表现吧 :
好吧, 直接跪了, Scroll View 的 Mask 或者换成 RectMask2D 都是无法对 Sprite Mask 裁剪的, 厉害了...
问题越来越多了哈, 继续来, 眼睛一瞟发现 Scroll View 内的例子效果比窗口外的模糊? 检查一下 :
原来渲染顺序都不符合需求啊, 它是在 UI 渲染之前渲染的, 把 Scroll View 的背景设成不透明, 就知道玩蛋了 :
所以这条路是行不通的, 再见.
UGUI 特效怎样在UI上裁剪的更多相关文章
- UGUI EventSystem.current.IsPointerOverGameObject(),判断是否进入了UI上
EventSystem.current.IsPointerOverGameObject(); //返回一个布尔值,进入了UI上就返回true,用的时候要 using UnityEngine.Event ...
- Unity3D_UGUI判断鼠标或者手指是否点击在UI上
比如战斗场景,UI和3D场景同时都需要响应触摸事件,如果同时响应可能就会出现触摸UI的时候影响到了3D部分.为了解决这个问题在判断3D响应之前要先判断手指是否点击在UI上. 以前NGUI的时候都是自己 ...
- (转载)Unity UGUI鼠标点击UI不受影响方法IsPointerOverGameObject
这几天在做捕鱼达人游戏时发现,当鼠标点击UI时,炮台的子弹也会发射子弹,这样会影响用户体验. 然后网上百度了一波,发现在UGUI系统上,EventSystem提供了一些方法.那就是EventSyste ...
- UGUI的优点新UI系统四 开源
UGUI的优点新UI系统四 开源 新UI系统是开源的,所以开发者可以看到新UI系统实现的源码,并加以修改和使用. 开源授权协议——MIT/X11 Unity所搭载的新UI系统,是在开源授权协议MIT/ ...
- Jquery easy UI 上中下三栏布局 分类: ASP.NET 2015-02-06 09:19 368人阅读 评论(0) 收藏
效果图: 源代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...
- UGUI的优点新UI系统
UGUI的优点新UI系统 第1章 新UI系统概述 UGUI的优点新UI系统,新的UI系统相较于旧的UI系统而言,是一个巨大的飞跃!有过旧UI系统使用体验的开发者,大部分都对它没有任何好感,以至于在过 ...
- unity区分点击在3D物体还是2D UI上
当场景中的3D物体需要响应点击,但同时有UI显示时,存在判断点击是在3D物体上还是UI上的问题,办法如下: 1. 射线检测所有2D 3D物体,有2D物体被检测到时表明当前有UI.但无论Physics2 ...
- unity检测鼠标是点击在UI上还是物体上
void Update() { if (Input.GetMouseButtonDown(0)||(Input.touchCount >0 && Input.GetTouch(0 ...
- element ui 上传文件,读取内容乱码解决
element ui 上传文件,读取内容乱码解决: 加第二个参数 reader.readAsText(file.raw,'gb2312'); <el-upload class="upl ...
随机推荐
- svn怎么修改用户名和密码
链接:https://blog.csdn.net/qq_36826506/article/details/80915431
- MySQL 5.5.62 安装方法(标准配置版)
1.此安装方法适用于绝大多数MySQL版本,首先在MySQL官网上下载好所需版本. 2.(官网可能不太好找)在我的博客列表中有一篇是MySQL官网下载链接,直达下载界面,方便. 3.下载.(安装版 ...
- datename()计算一个日期是星期几
- SpringCloud全家桶学习之Feign负载均衡----Feign(四)
一.Feign概述 (1)Feign是什么? 官网地址:https://projects.spring.io/spring-cloud/spring-cloud.html#spring-cloud-f ...
- SQL 层级数据查询出树形状态
WITH TEST AS (SELECT DEPTID,PARENTDEPT,SORTORDER,1 SPAC,CONVERT(CHAR(200),RTRIM(DEPTID)+CONVERT(CHA ...
- JavaScript 种一颗二叉树
/* 实现一颗树 结点类:Tree 包含左子树left,右子树right,根节点root,缺省为null 构造设置value 树类:Trees 构造:默认根节点为null insert: 如果当前根节 ...
- 27 JavaScript的引入&注释&弹窗&变量常量&数据类型及转换&内存&垃圾回收
JS的引入: 1 内部引入 绑定元素事件如onclick="" 绑定锚点如href="JavaScript:void(0)" script标签引入,注意:如果标 ...
- ISE主备注册和同步
Synchronize Primary and Secondary Cisco ISE Nodes You can make configuration changes to Cisco ISE on ...
- QRious入门
qrious是一款基于HTML5 Canvas的纯JS二维码生成插件.通过qrious.js可以快速生成各种二维码,你可以控制二维码的尺寸颜色,还可以将生成的二维码进行Base64编码. qrious ...
- [].slice.call(k).filter(function(l) { return l != 0 });
[].slice.call(k).filter(function(l) { return l != 0 }); 将类数组调用数组方法.