cocos2d:スプライトをドラッグアンドドロップする

2012/11/10

category: cocos2d | tag: cocos2d, iOS, iPhone, Objective-C | no comments

cocos2dのタッチイベントのハンドリングを確認中。
スライダーのようなUIも実現したかったので、スプライトをドラッグアンドドロップするコードを書いてみました。

cocos2dでは、以下の2つの方法でタッチイベントのハンドリングができます。

CCStandardTouchDelegateプロトコルを使う
CCTargetedTouchDelegateプロトコルを使う

ここでは、1.の方法でおこないます。

スプライトの追加

ファイルからスプライトを作成してレイヤーに追加します。
スプライトの移動範囲も予め計算しておきます。

-(id) init
{
	// always call "super" init
	// Apple recommends to re-assign "self" with the "super's" return value
	if( (self=[super init]) ) {
		
		CGSize size = [[CCDirector sharedDirector] winSize];
        
        sp = [[CCSprite alloc] initWithFile:@"squareOrange.png"];
        sp.position = ccp(size.width / 2, size.height * 0.6);
        [self addChild:sp];
        
        po = ccp(-999, -999);
        poMinX = sp.boundingBox.size.width * 0.5;
        poMaxX = size.width - sp.boundingBox.size.width * 0.5;
        
        self.isTouchEnabled = YES;
	}
	return self;
}

-(id) init

{

// always call "super" init

// Apple recommends to re-assign "self" with the "super's" return value

if( (self=[super init]) ) {

CGSize size = [[CCDirector sharedDirector] winSize];

sp = [[CCSprite alloc] initWithFile:@"squareOrange.png"];

sp.position = ccp(size.width / 2, size.height * 0.6);

[self addChild:sp];

po = ccp(-999, -999);

poMinX = sp.boundingBox.size.width * 0.5;

poMaxX = size.width - sp.boundingBox.size.width * 0.5;

self.isTouchEnabled = YES;

}

return self;

}

9-11行目：ファイルからスプライトを作成し、位置を設定してレイヤーに追加
14-15行目：スプライトが画面から飛び出さないように可動範囲を計算
17行目：タッチイベントを有効にします

タッチ開始時に呼び出されるメソッド

スプライトがタッチされたかどうかを確認し、タッチ開始時の座標を保存します。

- (void)ccTouchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
    UITouch *touch = [touches anyObject];
    CGPoint poNow = [touch locationInView:[touch view]];
    poNow = [[CCDirector sharedDirector] convertToGL:poNow];
    
    if (CGRectContainsPoint(sp.boundingBox, poNow))
    {
        printf("*** ccTouchesBegan (x:%f, y:%f)\n", poNow.x, poNow.y);
        po = poNow;
    }
}

- (void)ccTouchesBegan:(NSSet *)touches withEvent:(UIEvent *)event

{

UITouch *touch = [touches anyObject];

CGPoint poNow = [touch locationInView:[touch view]];

poNow = [[CCDirector sharedDirector] convertToGL:poNow];

if (CGRectContainsPoint(sp.boundingBox, poNow))

{

printf("*** ccTouchesBegan (x:%f, y:%f)\n", poNow.x, poNow.y);

po = poNow;

}

3行目：配列からtouchオブジェクトを取得
4行目：touchオブジェクトからタッチされた座標を取得
5行目：OpenGL系の座標に変換
7行目：スプライトがタッチされたかを、スプライトのバウンディングボックスとタッチされた座標から判断
10行目：タッチされた座標を保持

ドラッグ中に呼び出されるメソッド

範囲内でドラッグされていることを確認し、スプライトを移動します。

- (void)ccTouchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
    UITouch *touch = [touches anyObject];
    CGPoint poNow = [touch locationInView:[touch view]];
    poNow = [[CCDirector sharedDirector] convertToGL:poNow];
    
    if (po.x >= 0)
    {
        CGFloat x = sp.position.x + poNow.x - po.x;
        
        if (x < poMinX) x = poMinX;
        if (x > poMaxX) x = poMaxX;
        
        sp.position = ccp(x, sp.position.y);
        po = poNow;
        
    }
}

- (void)ccTouchesMoved:(NSSet *)touches withEvent:(UIEvent *)event

{

UITouch *touch = [touches anyObject];

CGPoint poNow = [touch locationInView:[touch view]];

poNow = [[CCDirector sharedDirector] convertToGL:poNow];

if (po.x >= 0)

{

CGFloat x = sp.position.x + poNow.x - po.x;

if (x < poMinX) x = poMinX;

if (x > poMaxX) x = poMaxX;

sp.position = ccp(x, sp.position.y);

po = poNow;

}

7行目：タッチが開始されているかを判断(開始前は-999が格納されている)
9行目：スプライトの新たな位置をタッチ開始座標と現在ドラッグ中の座標の差分から計算
10,11行目：移動範囲を超えていないか確認し補正する
13行目：補正された位置をスプライトに適用
14行目：次のドラッグ操作にむけて、現在の座標をタッチ開始位置にセット

タッチ終了時に呼び出されるメソッド

ドラッグ中を認識し、タッチ開始位置をリセットします。

- (void)ccTouchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
{
    if (po.x >= 0)
    {
        printf("ccTouchesEnded:\n\n");
        po = ccp(-999, -999);
    }
}

- (void)ccTouchesEnded:(NSSet *)touches withEvent:(UIEvent *)event

{

if (po.x >= 0)

{

printf("ccTouchesEnded:\n\n");

po = ccp(-999, -999);

}

3行目：ドラッグ中かを確認(po.xは、ドラッグされていないと-999)
6行目：タッチ開始位置をリセット

※ ソースコードは、こちら：spriteDragAndDrop

Pocket

Check

コメントを残すコメントをキャンセル

コメントを投稿するにはログインしてください。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください。

Trackback URL:

devlog [naru design]