(译)Cocos2d_for_iPhone_1_Game_Development_Cookbook
著作权声明:本文由iam126 翻译,欢迎转载分享。
请尊重作者劳动,转载时保留该声 明和作者博客链接,谢谢!
相关程序代码下载:http://download.csdn.net/detail/iam126/4068610
或搜索“Cocos2d_for_iPhone_1_Game_Development_Cookbook代码”于CSDN;
新手翻译,不准确请见谅,参考代码与原书。
1.2多彩的精灵
在上一个案例中,我们使用了彩色长方形绘制的天空和地面。设置材质颜色以及透明度的方式可以创造出非常好的效果。在这个案例中,我们将会创建一个类似电影中的场景,两个武士拿着发光的宝剑面对面站着。
如何工作…
#import "CCLayerGradient.h
@implementation Ch1_ColoringSprites
-(CCLayer*) runRecipe
{
[self initButtons];
//The Fade Scene Sprite
//淡入淡出的精灵
CCSprite *fadeSprite = [CCSprite spriteWithFile:@"blank.png"];
[fadeSprite setOpacity:0];
[fadeSprite setPosition:ccp(240,160)];
[fadeSprite setTextureRect:CGRectMake(0,0,480,320)];
[self addChild:fadeSprite z:3 tag:TAG_FADE_SPRITE];
//Add a gradient below the mountains
//为山加入一个渐变
//CCGradientDirectionT_B is an enum provided by CCLayerGradient
//CCGradientDirectionT_B是CCLayerGradient的效果之一
CCLayerGradient *gradientLayer = [CCLayerGradient layerWithColor:ccc4(61,33,62,255)fadingTo:ccc4(65,89,54,255) alongVector:ccp(480,100)];
[gradientLayer setPosition:ccp(0,50)];
[self addChild:gradientLayer z:0 tag:TAG_GROUND_GRADIENT];
//Add a sinister red glow gradient behind the evil samurai
//为那个邪恶的武士配备一个诡异的红色渐变
CCLayerGradient *redGradient = [CCLayerGradientlayerWithColor:ccc4(0,0,0,0) fadingTo:ccc4(255,0,0,100)alongVector:ccp(200,200)];
[redGradient setPosition:ccp(280,60)];
[redGradient setRotation:-90];
[self addChild:redGradient z:2 tag:TAG_RED_GRADIENT];
// Make the swords glow
//上光!
[self glowAt:ccp(230,280) withScale:CGSizeMake(3.0f, 11.0f)withColor:ccc3(0,230,255) withRotation:45.0f withSprite:goodSamurai];
[self glowAt:ccp(70,280) withScale:CGSizeMake(3.0f, 11.0f)withColor:ccc3(255,200,2) withRotation:-45.0f withSprite:evilSamurai];
return self;
}
-(void) initButtons
{
[CCMenuItemFont setFontSize:16];
//'Fade To Black' button
//"颜色变黑"的按钮制作
CCMenuItemFont* fadeToBlack = [CCMenuItemFont itemFromString:@"FADETO BLACK" target:self selector:@selector(fadeToBlackCallback:)];
CCMenu *fadeToBlackMenu = [CCMenu menuWithItems:fadeToBlack, nil];
fadeToBlackMenu.position = ccp( 180 , 20 );
[self addChild:fadeToBlackMenu z:4 tag:TAG_FADE_TO_BLACK];
}
/* Fade the scene to black */
//场景变黑
-(void) fadeToBlackCallback:(id)sender
{
CCSprite *fadeSprite = [self getChildByTag:TAG_FADE_SPRITE];
[fadeSprite stopAllActions];
[fadeSprite setColor:ccc3(0,0,0)];
[fadeSprite setOpacity:0.0f];
[fadeSprite runAction:
[CCSequence actions:[CCFadeIn actionWithDuration:2.0f], [CCFadeOutactionWithDuration:2.0f], nil]];
}
/* Create a glow effect */
//创建发光效果
-(void) glowAt:(CGPoint)positionwithScale:(CGSize)size withColor:(ccColor3B)color withRotation:(float)rotationwithSprite:(CCSprite*)sprite
{
CCSprite *glowSprite = [CCSprite spriteWithFile:@"fire.png"];
[glowSprite setColor:color];
[glowSprite setPosition:position];
[glowSprite setRotation:rotation];
[glowSprite setBlendFunc: (ccBlendFunc) { GL_ONE, GL_ONE }];
[glowSprite runAction: [CCRepeatForever actionWithAction:[CCSequenceactions:[CCScaleTo actionWithDuration:0.9f scaleX:size.widthscaleY:size.height], [CCScaleToactionWithDuration:0.9f scaleX:size.width*0.75fscaleY:size.height*0.75f], nil] ] ];
[glowSprite runAction: [CCRepeatForever actionWithAction:[CCSequenceactions:[CCFadeTo actionWithDuration:0.9f opacity:150], [CCFadeToactionWithDuration:0.9f opacity:255], nil]]];
[sprite addChild:glowSprite];
}
@end
如何工作…
这个案例向我们展示了通过代码所制作的颜色。
设置精灵颜色:
最简单的颜色设置方法是这种:
-(void)setColorLccColor3B)color;
设置精灵的颜色在一定程度上减少了可以显示的颜色,不过同时也为程序绘图增加了很多灵活性。在这个案例中,我们使用了多次setColor,包括绘制蓝天,太阳,黑色的“电影外框”等等。
ccColor3B是一个C结构体包括3个GLubyte变量。使用辅助宏来创建ccColor3B结构体:
ccColor3Bccc3(const GLubyte r,const GLubyte g,const GLubyte b);
cocos2d也设定了一些颜色常量。包括如下几个:
ccWHITE,ccYELLOW,ccBLUE,ccGREEN,ccRED,ccMAGENTA,ccBLACK,ccORANGE,ccGRAY.
渐变颜色:
在上面这个案例中,我们使用blank.png来为渐变场景指定一个颜色。我们首先话了一个跟屏幕差不多大的图片,然后使他透明,最后运行CCFadeIn动作去渐变出他的颜色。
[fadeSprite setColor:ccc3(255,255,255)];
[fadeSprite setOpacity:0.0f];
[fadeSprite runAction: [CCFadeInactionWithDuration:2.0f] ];
使用CCGradientLayer(现在新版本是CCLayerGradient)
使用CCGradientLayer类,我们可以用代码实现渐变色。制作山体到地面的渐变色,我们用的是如下的方法:
CCLayerGradient *gradientLayer =[CCLayerGradient layerWithColor:ccc4(61,33,62,255) fadingTo:ccc4(65,89,54,255)alongVector:ccp(480,100)];
[gradientLayer setPosition:ccp(0,50)];
[self addChild:gradientLayer z:0tag:TAG_GROUND_GRADIENT];
因为CCGradientLayer让你控制透明度很简单,所以他其实具备很多的用途。正如你所见,一个邪恶的红色光体在那个邪恶的武士身上。
制作精灵的发光:
为了让剑发出光,我们微妙的操纵着颜色,使用了混合渐变以及改变尺寸的方式。首先我们读取一个fire.png作为精灵。通过分别控制他的俄X、Y的尺寸,我们可以让图片或长或短。尺寸大小根据你的需要(本例中使用3:11的比例是因为剑特别瘦),你可以随意的控制尺寸以及透明度来实现你需要的效果。你也需要设置混合模式{CL_ONE,GL_ONE}。最后,把这个特效精灵添加给实际的精灵使它看起来真的在发光~
CCSprite *glowSprite = [CCSpritespriteWithFile:@"fire.png"];
[glowSprite setColor:color];
[glowSprite setPosition:position];
[glowSprite setRotation:rotation];
[glowSprite setBlendFunc: (ccBlendFunc) { GL_ONE,GL_ONE }];
[glowSprite runAction: [CCRepeatForeveractionWithAction:
[CCSequence actions:[CCScaleToactionWithDuration:0.9f
scaleX:size.width scaleY:size.height], [CCScaleTo
actionWithDuration:0.9f scaleX:size.width*0.75fscaleY:size.
height*0.75f], nil] ] ];
[glowSprite runAction: [CCRepeatForeveractionWithAction:
[CCSequence actions:[CCFadeToactionWithDuration:0.9f
opacity:150], [CCFadeTo actionWithDuration:0.9fopacity:255], nil]
] ];
[sprite addChild:glowSprite];
(译)Cocos2d_for_iPhone_1_Game_Development_Cookbook
著作权声明:本文由iam126 翻译,欢迎转载分享。
请尊重作者劳动,转载时保留该声 明和作者博客链接,谢谢!
相关程序代码下载:http://download.csdn.net/detail/iam126/4068610
或搜索“Cocos2d_for_iPhone_1_Game_Development_Cookbook代码”于CSDN;
新手翻译,不准确请见谅,参考代码与原书。