【Cocos Shader】Shader Animation 跳动的心
2015-10-25 20:01
579 查看
最终效果:
本Shader算法来自自Shadertoy, 原地址:https://www.shadertoy.com/view/XsfGRn
Shader的实现:
vs: heart.vert
2.应用Shader:
本Shader算法来自自Shadertoy, 原地址:https://www.shadertoy.com/view/XsfGRn
Shader的实现:
vs: heart.vert
attribute vec4 a_position; attribute vec2 a_texCoord; #ifdef GL_ES varying lowp vec2 v_texCoord; #else varying vec2 v_texCoord; #endif void main() { gl_Position = CC_PMatrix * a_position; v_texCoord = a_texCoord; }ps:heart.frag
#ifdef GL_ES varying lowp vec2 v_texCoord; #else varying vec2 v_texCoord; #endif uniform vec2 u_screenSize;//视口大小,Director::getInstance()->getVisibleSize(); //uniform vec4 u_heartColor; uniform float u_heartColorR;//heart的RGB值 uniform float u_heartColorG; uniform float u_heartColorB; void main() { vec4 u_heartColor = vec4(u_heartColorR, u_heartColorG, u_heartColorB, 1.); vec2 fragCoord = vec2(v_texCoord.x, 1-v_texCoord.y)*u_screenSize.xy; vec4 u_bgColor = vec4(1.0);//背景颜色 float _Blur = 0.02;//heart边缘模糊大小 float _Duration = 1.5;//跳动周期 vec2 p = (2.0*fragCoord.xy-u_screenSize.xy)/min(u_screenSize.y,u_screenSize.x); p.y -= 0.25; // heart跳动算法 float tt = mod(CC_Time.y,1.5)/1.5; tt = mod(CC_Time.y,_Duration)/_Duration; float ss = pow(tt,.2)*0.5 + 0.5; ss = 1.0 + ss*0.5*sin(tt*6.2831*3.0 + p.y*0.5)*exp(-tt*4.0); p *= vec2(0.5,1.5) + ss*vec2(0.5,-0.5); // heart形状算法 float a = atan(p.x,p.y)/3.141593; float r = length(p); float h = abs(a); float d = (13.0*h - 22.0*h*h + 10.0*h*h*h)/(6.0-5.0*h); // Color float s = 1.0-0.5*clamp(r/d,0.0,1.0); s = 0.75 + 0.75*p.x; s *= 1.0-0.25*r; s = 0.5 + 0.6*s; s *= 0.5+0.5*pow( 1.0-clamp(r/d, 0.0, 1.0 ), 0.1 ); vec3 hcol = vec3(1.0,0.5*r,0.3)*s; hcol = u_heartColor.xyz *s; vec3 col = mix( u_bgColor.xyz, hcol, smoothstep( -0.01, 0.01, d - r) ); col = mix( u_bgColor.xyz, hcol, smoothstep( -_Blur, _Blur, d - r) ); vec4 texColor = texture2D(CC_Texture0, v_texCoord); gl_FragColor = texColor * vec4(col, 1.0); }
2.应用Shader:
auto bg = Sprite::create("HelloWorld.png"); bg->setPosition(winSize / 2); this->addChild(bg); auto programState = GLProgramState::getOrCreateWithGLProgram(GLProgram::createWithFilenames("shader/heart.vert", "shader/heart.frag")); //heart animation programState->setUniformVec2("u_screenSize", Director::getInstance()->getWinSize()); programState->setUniformFloat("u_heartColorR", 1.0);//RGB值传入Shader programState->setUniformFloat("u_heartColorG", 0.0); programState->setUniformFloat("u_heartColorB", 0.0); programState->applyUniforms(); bg->setGLProgramState(programState);
相关文章推荐
- 5、Cocos2dx 3.0小游戏开发的例子寻找测试三个简单的介绍和总结
- [Cocos2d塔防游戏开发]Cocos2dx-3.X完成塔防游戏《王国保卫战》--防御塔(五)之高级箭塔
- Xcode7中CocosPods 编译报错
- [Cocos2d塔防游戏开发]Cocos2dx-3.X完成塔防游戏《王国保卫战》--防御塔(四)之升级防御塔
- 【cocos2dx】游戏逻辑+cocos2dx+编译器 导致的TouchEvent异常
- Cocos2d-x3.0 lua捆绑C++分类
- cocos2dx中RichText富文本的换行问题
- 界面的滑动01(cocos3.8)
- 初学cocos2dx-lua之Mac配置sumblime Text3 编译lua
- cocos2d-lua集成Mob-SMSSDK-for-android
- [Cocos2d塔防游戏开发]Cocos2dx-3.X完成塔防游戏《王国保卫战》--防御塔(三)之初级炮塔
- Cocos2d-x 3.8.1学习之路:(2)从windows到android
- Cocos2D-x内存管理的原则
- Cocos2d-JS使用log方法控制台无法打印出结果
- Cocos2d-JS屏幕适配
- Cocos2d-x下Lua调用自定义C++类和函数的最佳实践
- android台 cocos2d-x 翻阅相册数据
- cocos2d-x项目目录梳理
- cocos-2d HelloWorld项目运行报错解决
- Protobuf2.6集成到cocos2dx(Android和ios平台)