现在的位置: 首页 > 综合 > 正文

cocos2d-x重复纹理与遮罩 cocos2d-x重复纹理与遮罩

2018年02月10日 ⁄ 综合 ⁄ 共 1895字 ⁄ 字号 评论关闭

本文为firedragonpzy原创,转载务必在明显处注明:
转载自【Softeware MyZone】原文链接: 
http://www.firedragonpzy.com.cn/index.php/archives/3252

欢迎热爱编程的朋友们参与到cocos2d-x编程中,为了给大家提供良好的交流环境,网站以开启QQ群
Software MyZone:66202765(群号,欢迎加入,若满,请加1群)
Software MyZone 1群(2dx):286504621
【加群请写:Software MyZone或者是firedragonpzy】
群论坛:火龙论坛正试运营阶段,欢迎大家多提些建设性意见……

最近研究了一下重复纹理和遮罩的问题,简单与大家分享一下:

重复纹理:

先解释下什么是重复纹理。

大家在做游戏的时候,可能会有类似win桌面的平铺效果。如果你做web开发,这个你肯定知道的:background-repeat : repeat | no-repeat | repeat-x | repeat-y,是不是?这就是本文所谓的平铺,它是 在你设置的范围区域内repeat-x,repeat-y全部填充的。

这个纹理的重复,主要设计结构体:ccTexParams。定义如下:

/**
 
Extension to set the Min / Mag filter
 
*/
 
//定义了纹理的一些参数
typedef struct _ccTexParams {
GLuint    minFilter;//纹理过滤器:缩小过滤器
GLuint    magFilter;//纹理过滤器:放大过滤器
GLuint    wrapS;//横向纹理寻址模式
GLuint    wrapT;//纵向纹理寻址模式
} ccTexParams;
?

例子:

CCRect rect(0, 0, 255, 160);
 
CCSprite* firedragonpzy = CCSprite::create("firedragonpzy.png");
 
firedragonpzy->setTextureRect(rect);//CCRect描述了要重复贴图的范围
 
ccTexParams params = {
 
GL_LINEAR,
 
GL_LINEAR,
 
GL_REPEAT,
 
GL_REPEAT
 
};
 
firedragonpzy->getTexture()->setTexParameters(¶ms);
 
this->addChild(firedragonpzy);

这样,我们的重复纹理贴图就ok了,大家可以自己尝试下。。。

遮罩:

和重复纹理一样,先解释下所谓的遮罩:

想必大家都用过ps吧,当时我记得是设置个蒙版,然后进行遮罩处理,做了2dx的遮罩后突然间明白了ps遮罩原理,当时用的时候也没有考虑这个。【注:我这里讲述的是用CCRenderTexture来处理遮罩,不过这方法可能效率比较低,主要是为了看看CCRenderTexture】

遮罩原理:利用遮罩图片的透明度来处理被遮罩的图片。

cocos2d-x 遮罩,主要涉及到opengl-es的混合ccBlendFunc和渲染纹理CCRenderTexture。

遮罩需要两张图片,遮罩图片A和被遮罩图片B,遮罩图片A就是你想要遮罩的形状,图片颜色以白色填充就好,颜色无所谓,我们主要利用遮罩图片A的透明度。

遮罩代码:

intw = A->getContentSize().width ;
 
inth = A->getContentSize().height ;
 
CCRenderTexture* rt = CCRenderTexture::create(w, h);//创建纹理渲染范围
ccBlendFunc blendFunc;
 
blendFunc.src = GL_DST_ALPHA; //表示使用目标颜色的alpha值来作为因子
 
blendFunc.dst = GL_ZERO; //不使用目标颜色
 
B->setBlendFunc(blendFunc);
 
rt->begin();
 
A->visit();//注意,这里需要先绘制A,遮罩图片
 
B->visit();//注意渲染顺序,先渲染的为的精灵的颜色为目标颜色,后渲染的精灵的颜色为源颜色。
 
rt->end();
 
CCSprite* firedragonpzy = CCSprite::createWithTexture(rt->getSprite()->getTexture());
 
this->addChild(firedragonpzy);
?

好了,遮罩也ok了,关于opengl的混合 ,大家可以参考:http://www.firedragonpzy.com.cn/index.php/archives/3246

抱歉!评论已关闭.