Question

我为mac制作应用程序。我连续有5张牌，点击一个按钮，所有的牌都应该顺序翻转（第一张牌的翻转应该是第二张牌的翻转）。我遇到的问题如下

当我点击动画按钮并且卡片应该从后向前翻转（颜色到数字）时，一切都很好。它们围绕Y轴旋转旋转，一个接一个地完美地动画。

但是当我点击动画按钮并且卡片应该反过来（数字到颜色）时会发生以下情况：所有的卡都用背面层替换了他们的初始图层，没有任何动画，一下子就完成了。

之后，每张卡片一张一张（顺序）变成正确的前层，并动画到后层。

这是一个动画视频

https://www.youtube.com/watch?v=fznUFR6pHCQ&feature=youtu.be

我可以改变什么，这样我就可以动画了。

我像这样初始化了这张卡

flip1= [[PKRGSPFlipAnimationController alloc] initWithParent:firstCardView newFrontImage:[NSImage imageNamed:@"front.png"]];
    flip2= [[PKRGSPFlipAnimationController alloc] initWithParent:secondCardView newFrontImage:[NSImage imageNamed:@"front.png"]];
    flip3= [[PKRGSPFlipAnimationController alloc] initWithParent:thirdCardView newFrontImage:[NSImage imageNamed:@"front.png"]];
    flip4= [[PKRGSPFlipAnimationController alloc] initWithParent:fourthCardView newFrontImage:[NSImage imageNamed:@"front.png"]];
    flip5= [[PKRGSPFlipAnimationController alloc] initWithParent:fifthCardView newFrontImage:[NSImage imageNamed:@"front.png"]];

点击按钮即可调用此功能

[flip1 flip:1];
[flip2 flip:2];
[flip3 flip:3];
[flip4 flip:4];
[flip5 flip:5];

这是翻转的类（flip1-5）： .m文件

define FLIP_TIME 1.0 // Time taken to do the animation.
#define PERSPECTIVE 1000
#define RECT NSMakeRect(0, 0, 134, 198) // Value of the coordiantes of the parent view.
#define DEGREES_TO_RADIANS(angle) (angle * M_PI / 180.0)
#import "PKRGSPFlipAnimationController.h"

@implementation PKRGSPFlipAnimationController

@synthesize cardLayer;
@synthesize frontLayer;
@synthesize backLayer;

@synthesize parentView;

@synthesize isFront;

-(id)initWithParent:(NSView *)newParent newFrontImage:(NSImage *)newFront{
    self = [super init];
    if (self) {
        parentView = newParent;
        isFront = false;

        cardLayer =[CATransformLayer layer];
        [cardLayer setFrame:RECT];

        frontLayer = [CALayer layer];
        [frontLayer setFrame:RECT];
        [frontLayer setZPosition:1.0];
        [frontLayer setDoubleSided:NO];
        [frontLayer setContents:(id)newFront];
        [cardLayer addSublayer:frontLayer];

        backLayer = [CALayer layer];
        [backLayer setFrame:RECT];
        [backLayer setZPosition:2.0];
        [backLayer setDoubleSided:NO];
        [backLayer setContents:(id)[NSImage imageNamed:@"back.png"]];

        [cardLayer addSublayer:backLayer];

        [parentView setLayer:[CALayer layer]];
        [parentView setWantsLayer:YES];
        [parentView.layer addSublayer:cardLayer];

    }
    return self;
}

- (CAAnimation*) createAnimFrom:(double)frAngl to:(double)toAngl
{
    //For the card to rotate on the
    //  Y axis - @"transform.rotation.y"
    //  X axis - @"transform.rotation.x"

    NSString* rotationAxis = @"transform.rotation.y";

    CABasicAnimation* ba = [CABasicAnimation animationWithKeyPath:rotationAxis];
    ba.fromValue = [NSNumber numberWithFloat:frAngl];
    ba.toValue = [NSNumber numberWithFloat:toAngl];

    CABasicAnimation *shrinkAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
    shrinkAnimation.toValue = [NSNumber numberWithFloat:0.7f];
    shrinkAnimation.duration =  FLIP_TIME*0.5;
    shrinkAnimation.autoreverses = YES;

    CAAnimationGroup *animationGroup = [CAAnimationGroup animation];
    animationGroup.animations = [NSArray arrayWithObjects:ba, shrinkAnimation, nil];
    animationGroup.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    animationGroup.duration = FLIP_TIME;
    animationGroup.fillMode = kCAFillModeForwards;
    animationGroup.removedOnCompletion = NO;
    return animationGroup;
}

-(void) flip: (int) beginTime
{
    CALayer * currLayer;
    CALayer * nextLayer;
    if(isFront){
        currLayer=frontLayer;
        nextLayer=backLayer;
    }
    else{
        currLayer=backLayer;
        nextLayer=frontLayer;
    }
    NSLog(@"%hhd", isFront);
    isFront=!isFront;

    [CATransaction begin];
    CAAnimation* anim1 = [self createAnimFrom:0.0 to:M_PI];
    anim1.duration  = FLIP_TIME;
    anim1.beginTime = CACurrentMediaTime()+beginTime;
    CAAnimation* anim2 = [self createAnimFrom:-M_PI to:0.0];
    anim2.duration  = FLIP_TIME;
    anim2.beginTime = CACurrentMediaTime()+beginTime;
    [CATransaction commit];


    //add perspective
    CATransform3D mt = CATransform3DIdentity;
    mt.m34 = 1.0/(double)PERSPECTIVE;

    currLayer.transform = mt;
    nextLayer.transform = mt;

    NSPoint ap = {0.5,0.5};
    currLayer.anchorPoint = ap;
    nextLayer.anchorPoint = ap;

    [CATransaction begin];
    [currLayer addAnimation:anim1 forKey:@"flip"];
    [nextLayer addAnimation:anim2 forKey:@"flip"];
    [CATransaction commit];
}
@end

.h文件

#import <Cocoa/Cocoa.h>
#import <QuartzCore/QuartzCore.h>

@interface PKRGSPFlipAnimationController : NSObject

-(id)initWithParent:(NSView *)newParent newFrontImage:(NSImage *)newFront;
- (void) flip: (int) beginTime;

@property (nonatomic, strong) NSView* parentView;

@property (nonatomic, strong) CATransformLayer * cardLayer;
@property (nonatomic, strong) CALayer *frontLayer; // Front side (Number side) of the card.
@property (nonatomic, strong) CALayer *backLayer; // Back side (Blank side) of the card.

@property (nonatomic) BOOL isFront; // Boolean value for the card to check if it is turned.
@end

Answer 1

我添加了一个动画停止并再次初始化它。这解决了问题

动画无法正常工作

1 个答案: