Cocos2d实现视差滚动的背景可以使用CCParallaxNode实现。
1.创建CCparallaxNode对象,并将其添加到层中
2.创建希望产生视差滚动效果的节点对象,并添加为CCParallax的子节点
3.移动CCParallax以滚动背景。根据设置的parallaxRatio可以让子节点比CCParallaxNode更快或者慢
Action.h文件实现如下:
[code lang=”objc”]
// Created by wildcat on 14-4-20.
// Copyright 2014年 com.wildcat. All rights reserved.
//
#import <Foundation/Foundation.h>
#import "cocos2d.h"
@interface ActionLayer : CCLayer {
CCSprite *_mainBg;
CCSprite *_mainBg2;
CCSprite *_cloud1;
CCSprite *_cloud2;
CCSprite *_cloud3;
CCParallaxNode *_backgroundNode;
}
+(id)scene;
@end
[/code]
Action.m文件实现如下:
[code lang=”objc”]
// Created by wildcat on 14-4-20.
// Copyright 2014年 com.wildcat. All rights reserved.
//
#import "ActionLayer.h"
@interface ActionLayer()
//场景初始化
-(void)setupBackground;
-(void)updateBackground:(ccTime) dt;
@end
@implementation ActionLayer
+(id)scene{
CCScene *scene=[CCScene node];
ActionLayer *layer=[ActionLayer node];
[scene addChild:layer];
return scene;
}
-(id)init{
if (self=[super init]) {
[self setupBackground];
[self scheduleUpdate];
}
return self;
}
#pragma mark – 添加滚动背景
-(void)setupBackground{
CGSize winSize=[[CCDirector sharedDirector] winSize];
//1.创建CCParallaxNode 视差滚动节点
_backgroundNode=[CCParallaxNode node];
[self addChild:_backgroundNode z:-2];
//2.创建需要添加到CCParallaxNode视察滚动节点的精灵对象
_mainBg=[CCSprite spriteWithFile:@"bg.png"];
_mainBg2=[CCSprite spriteWithFile:@"grass.png"];
_cloud1=[CCSprite spriteWithFile:@"bg_cloud_1.png"];
_cloud2=[CCSprite spriteWithFile:@"bg_cloud_2.png"];
_cloud3=[CCSprite spriteWithFile:@"bg_cloud_3.png"];
//3.设置云彩的浮动速度和背景速度
CGPoint cloudSpeed=ccp(0.1f, 0.1f);
CGPoint bgSpeed=ccp(0.05f, 0.05f);
//4.将背景对象添加为CCParallaxNode视察滚动节点的子节点
[_backgroundNode addChild:_cloud1 z:0 parallaxRatio:cloudSpeed positionOffset:ccp(0, winSize.height*0.6)];
[_backgroundNode addChild:_cloud2 z:0 parallaxRatio:cloudSpeed positionOffset:ccp(winSize.width*0.5, winSize.height*0.7)];
[_backgroundNode addChild:_cloud3 z:0 parallaxRatio:cloudSpeed positionOffset:ccp(winSize.width*0.9, winSize.height*0.8)];
[_backgroundNode addChild:_mainBg z:-1 parallaxRatio:bgSpeed positionOffset:ccp(200, winSize.height*0.5)];
[_backgroundNode addChild:_mainBg2 z:0 parallaxRatio:bgSpeed positionOffset:ccp(winSize.width*0.5,0)];
}
#pragma mark – 更新背景图片方法
-(void)updateBackground:(ccTime) dt{
CGSize size = [CCDirector sharedDirector].winSize;
CGPoint backgroundScrollVel = ccp(-size.width, 0);
_backgroundNode.position =ccpAdd(_backgroundNode.position,ccpMult(backgroundScrollVel, dt));
CGSize winSize = [CCDirector sharedDirector].winSize;
NSArray *backgrounds = [NSArray arrayWithObjects:_mainBg, _mainBg2, _cloud1, _cloud2,_cloud3, nil];
for (CCSprite *background in backgrounds) {
if ([_backgroundNode convertToWorldSpace:background.position].x < -background.contentSize.width) {
_backgroundNode.position = ccp(winSize.width*4,0);
}
}
}
#pragma mark – 更新
-(void)update:(ccTime)delta{
[self updateBackground:delta];
}
@end
[/code]
注意:
1.设置子节点的速度时:
CGPoint cloudSpeed=ccp(0.1f, 0.1f);
CGPoint bgSpeed=ccp(0.05f, 0.05f);
小于1代表比背景速度慢,反之则快。
2._backgroundNode.position = ccp(winSize.width*4,0);
之所以设置为四倍,是因为所选背景图片是屏幕的两倍。。
结果展示:
源码下载:http://pan.baidu.com/s/1kTkcSE7