[Unity]UGUI ScrollView特效裁剪

Unity特效在ScrollView中的裁剪

1.序列帧

按照特效的效果,做序列帧动画

---

问题和缺点

效果会差点

2.添加相机

添加一个Camera,这个Canera只显示ScrollView的实际显示区域
我们先添加一个新的Layer层RewardEffect,并将新添加的Camera的显示层设置为RewardEffect.
Camera中的Viewport Rect是其可见的区域,这里我们要调整为这个区域与ScrollView的显示区域吻合.
特效的Layer要设置为RewardEffect,特效不再会出现在UICamera中，而是由新的Camera负责显示.由于相机区域的设置,特效在区域内的部分会正常显示,拖动超出相机范围后,就看不到了,实现了裁剪的效果。

如何比较方便准确的设置摄像范围,有一个脚本UIViewport,将这个脚本挂在新加的摄像机上.在ScrollView的左上角和右下角位置各放一个Transform,设置到UIViewport

---

问题和缺点
1.特效所属的Layer层级要高于UI的的Layer层,当这个界面弹出另一个界面(比如奖励领取界面),特效就显示在新界面之上了(可选择在新界面出现的时候监听暂时隐藏特效，但解决方案不够完美).

3.使用RenderTexture

1.创建相机,相机提前做好prefab,然后在使用的时候动态创建.

GameObject camera = (GameObject)Resources.Load(@"UI/Prefabs/Camera/RoleCameraVariateInfo", typeof(GameObject));

if (camera != null)  
{  
    GameObject go = GameObject.Instantiate(camera) as GameObject;

    if (go != null &&
        go.camera != null)
    {
       m_Camera = go.camera;
    }  
}  

2.加载特效文件,并设置特效及相机位置

Object model = Resources.Load("Effect/UI/Business/Busi_Effect001Test");

if (null == model)
{
    return;
}

m_Model = GameObject.Instantiate(model) as GameObject;

if (null == m_Model)
{
    return;
}

var t = m_Model.transform;
t.localPosition = new Vector3(0f, m_nIndex * MODEL_OFFSET, 0f);
t.localScale = modelScale > 0 ? new Vector3(modelScale, modelScale, modelScale) : new Vector3(1f, 1f, 1f);

m_Camera.transform.localPosition = new Vector3(cameraX, cameraY + m_nIndex * MODEL_OFFSET, cameraZ);

3.给相机设置targetTexture

m_Camera.clearFlags = CameraClearFlags.Color;
m_Camera.renderingPath = RenderingPath.DeferredLighting;
RenderTexture rt = RenderTexture.GetTemporary(uiTexture.width, uiTexture.height, 0);
if (rt != null)
{
   m_Camera.targetTexture = rt;
   m_Camera.mainTexture = rt;
   m_Camera.Render();
}

---

问题和缺点
1.当特效种类较多,不同应用场景多的时候,开发成本偏高.

4.通过Shader实现裁剪

将ScrollView的显示区域传给特效的Shader,超出显示区域部分将透明度设置为0,实现裁剪.这个方案实施分为两个部分:修改特效的Shader和显示区域传给Shader.
1.修改特效的Shader，下面是我们修改后的Shader，其中// add clip的部分是为了实现裁剪添加的部分：

// 裁剪shader
Shader "Effect_Mid/ScrollClipAdditive"
{
    Properties
    {
        ......
        // add c