《捕鱼达人3》讲解Cocos引擎3D技术（四）：旋涡特效

最新推荐文章于 2024-08-16 20:33:59 发布

我的無力双臂

最新推荐文章于 2024-08-16 20:33:59 发布

阅读量2k

点赞数

本文链接：https://blog.csdn.net/sunyazhou13/article/details/38579915

版权

在《捕鱼达人3》中，旋涡特效为玩家提供了旋转扭曲的视觉体验。本文介绍了实现这一效果的三个步骤：屏幕渲染到纹理、使用扭曲Shader和随着时间更新顶点坐标。通过创建VortexLayer类和使用特定Shader，详细讲解了如何创建旋涡特效，并提供了DEMO以供学习。

摘要由CSDN通过智能技术生成

大家好，经过前面三节课的学习，我们已经可以掌握将模型加载到游戏中进行显示，并且做出模型在水中受波光影响的效果，也学会了如何产生闪电链。这一节课，我们来学习一下如何开发旋涡特效。

在《捕鱼达人3》里，有这样一个效果，它实现了对屏幕画面进行旋转扭曲，感觉就像带着玩家通过旋涡进入了海底的世界。如图：

哈哈！看起来是不是很流弊！

具体怎么实现呢？现在我们来学习一下。

要现实这样的效果主要分为三个步骤：

一、将屏幕画面渲染到一张纹理上。

二、创建一个平面网格模型，然后将第一步取得的纹理做为贴图传入一个顶点纹理坐标扭曲Shader进行渲染。

三、随着时间的增加，更新Shader中顶点纹理坐标扭曲的角度和半径。

为了方便使用，我们创建一个基于Layer的派生类，命名为VortexLayer，然后我们在其中加入一个CCRenderTexture成员指针，在初始化时创建为屏幕大小:

 
        // 创建渲染目标纹理 
       
        auto  WinSize  = Director::getInstance()->getWinSize(); 
       
        m_pTarget = CCRenderTexture::create(WinSize.width, WinSize.height, kCCTexture2DPixelFormat_RGBA8888); 
       
        m_pTarget->setClearColor(Color4F(0, 0, 0, 0)); 
       
        m_pTarget->setVisible( 
        false 
        ); 
       
        addChild(m_pTarget);

并通过它我们在draw的时候将目标Layer结点中的所有物体绘制到它的纹理中。

 
        void  
        VortexLayer::draw(Renderer* renderer,  
        const  
        Mat4 &transform, uint32_t flags) 
       
        {
          
        if 
        ( m_pTarget && m_TargetLayer) 
       
        {
          
        m_pTarget->clear(0,0,0,0); 
       
        m_pTarget->begin(); 
       
        m_TargetLayer->visit(); 
       
        m_pTarget->end(); 
       
        } 
       
        … 
       
        }