ios - 如何在 iOS 中使用 Cocos2d V3 制作类似 Candy Crush Saga 应用程序的 Ray Animation

Question

我在 iPhone 和 iPad 中使用 Cocos2d V3 创建了一个类似于 Candy Crush Saga 应用程序的应用程序。我想要糖果上的射线动画。光线应该从不同的方向和不同的距离通过。我已附上图片以供引用。

我也有像这样的动画图像序列，

任何人都可以帮助我如何做到这一点吗？

Answer 1

求旋转角度:

CGPoint difference = ccpSub(targetCloud.position, sourceCloud.position);
CGFloat rotationRadians = ccpToAngle(difference);
CGFloat rotationDegrees = -CC_RADIANS_TO_DEGREES(rotationRadians);
rotationDegrees -= 90.0f;
CGFloat rotateByDegrees = rotationDegrees - targetCloud.rotation;

找到比例:

float dist = ccpDistance(targetCloud.position,sourceCloud.position);
CCSprite *line = [CCSprite spriteWithImageNamed:@"0_light.png"];
float scale = dist / line.boundingBox.size.width;

创建动画:

-(CCActionSequence *)createRayAnimationFrom:(CGPoint)startPosition atAngle:(float)angle toScale:(float)scale
{
 //Using Texture packer
CCSpriteBatchNode *batchNode = [CCSpriteBatchNode batchNodeWithFile:@"light.pvr.ccz"];
[self addChild:batchNode];


[[CCSpriteFrameCache sharedSpriteFrameCache] addSpriteFramesWithFile:@"light.plist"];

CCSprite *raySprite = [CCSprite spriteWithSpriteFrameName:@"0_light.png"];
raySprite.position = startPosition;
raySprite.anchorPoint = ccp(0.5, 0.0);

[batchNode addChild:raySprite];

NSMutableArray *animFrames = [NSMutableArray array];
for( int i=1;i<=12;i++)
{
    CCSpriteFrame *frame = [[CCSpriteFrameCache sharedSpriteFrameCache] spriteFrameByName:[NSString stringWithFormat:@"%d_light.png",i]];
    [animFrames addObject:frame];
}

CCAnimation *animation = [CCAnimation animationWithSpriteFrames:animFrames];
animation.delayPerUnit = 0.1f;
animation.restoreOriginalFrame = YES;


    CCActionAnimate *animAction  = [CCActionAnimate actionWithAnimation:animation];
    CCActionSequence *animSequence = [CCActionSequence actions:[CCActionRotateBy actionWithDuration:0.1 angle:angle],[CCActionScaleBy actionWithDuration:0.1 scaleX:1.0f scaleY:scale],animAction,[CCActionCallBlock actionWithBlock:^{

        [CCActionRemove action];

    }], nil];

[raySprite runAction:animSequence];
 }

您必须为每个目标云调用此函数:

[self createRayAnimationFrom:sourceCloud atAngle:rotateByDegrees toScale:scale];