如何使用从 Facebook Origami 导出的 iOS 代码？答案

【问题标题】：How do I use the exported iOS code from Facebook Origami?如何使用从 Facebook Origami 导出的 iOS 代码？
【发布时间】：2015-02-28 14:52:02
【问题描述】：

各位动画专家您好！

我偶然发现了 Facebook 的 Origami，它使用他们的 iOS 版 Pop 库。

Origami Examples

所有的教程（在他们的网站 + 其他任何在线的地方）似乎都集中在掌握 Quartz Composer 方面。我对如何获取导出的代码感兴趣（单击 QC 中的 Origami 图标并选择导出 iOS 代码。）进入我的 iOS 应用程序。

所以我开始下载“2D Waggle”示例：2D Waggle Example

导出的代码如下所示：

#import "ViewController.h"
#import <POP/POP.h>
#import <POP/POPLayerExtras.h>

@interface ViewController ()
@property (nonatomic) CGFloat popAnimationProgress;
@property (nonatomic) CGFloat popAnimationProgress;
@end

@implementation ViewController

// popAnimation transition

- (void)togglePopAnimation:(BOOL)on {
  POPSpringAnimation *animation = [self pop_animationForKey:@"popAnimation"];

  if (!animation) {
    animation = [POPSpringAnimation animation];
    animation.springBounciness = 5;
    animation.springSpeed = 10;
    animation.property = [POPAnimatableProperty propertyWithName:@"popAnimationProgress" initializer:^(POPMutableAnimatableProperty *prop) {
      prop.readBlock = ^(ViewController *obj, CGFloat values[]) {
        values[0] = obj.popAnimationProgress;
      };
      prop.writeBlock = ^(ViewController *obj, const CGFloat values[]) {
        obj.popAnimationProgress = values[0];
      };
      prop.threshold = 0.001;
    }];

    [self pop_addAnimation:animation forKey:@"popAnimation"];
  }

  animation.toValue = on ? @(1.0) : @(0.0);
}

- (void)setPopAnimationProgress:(CGFloat)progress {
    _popAnimationProgress = progress;
    POPLayerSetTranslationX(self.layer.layer, POPPixelsToPoints(progress));
}

// popAnimation transition

- (void)togglePopAnimation:(BOOL)on {
  POPSpringAnimation *animation = [self pop_animationForKey:@"popAnimation"];

  if (!animation) {
    animation = [POPSpringAnimation animation];
    animation.springBounciness = 5;
    animation.springSpeed = 10;
    animation.property = [POPAnimatableProperty propertyWithName:@"popAnimationProgress" initializer:^(POPMutableAnimatableProperty *prop) {
      prop.readBlock = ^(ViewController *obj, CGFloat values[]) {
        values[0] = obj.popAnimationProgress;
      };
      prop.writeBlock = ^(ViewController *obj, const CGFloat values[]) {
        obj.popAnimationProgress = values[0];
      };
      prop.threshold = 0.001;
    }];

    [self pop_addAnimation:animation forKey:@"popAnimation"];
  }

  animation.toValue = on ? @(1.0) : @(0.0);
}

- (void)setPopAnimationProgress:(CGFloat)progress {
    _popAnimationProgress = progress;
    POPLayerSetTranslationY(self.layer.layer, POPPixelsToPoints(-progress));
}

// Utilities

static inline CGFloat POPPixelsToPoints(CGFloat pixels) {
    static CGFloat scale = -1;
    if (scale < 0) {
        scale = [UIScreen mainScreen].scale;
    }
    return pixels / scale;
}

这是我尝试用来与生成的东西交互的代码：

-(void)awakeFromNib
{
    UIPanGestureRecognizer* pan = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(move:)];
    [self addGestureRecognizer:pan];
}


static float firstX=0,firstY=0;



-(void)move:(id)sender {
    [self bringSubviewToFront:[(UIPanGestureRecognizer*)sender view]];
    CGPoint translatedPoint = [(UIPanGestureRecognizer*)sender translationInView:self];

    if ([(UIPanGestureRecognizer*)sender state] == UIGestureRecognizerStateBegan) {
        firstX = [[sender view] center].x;
        firstY = [[sender view] center].y;

        [self togglePopAnimationX:YES];
        [self togglePopAnimationY:YES];
    }
    else    if ([(UIPanGestureRecognizer*)sender state] == UIGestureRecognizerStateEnded) {
        [self togglePopAnimationX:NO];
        [self togglePopAnimationY:NO];
    }



    translatedPoint = CGPointMake(firstX+translatedPoint.x, firstY+translatedPoint.y);

    //

    if ([(UIPanGestureRecognizer*)sender state] == UIGestureRecognizerStateChanged) {

        POPLayerSetTranslationX(self.layer, translatedPoint.x);
        POPLayerSetTranslationY(self.layer, translatedPoint.y);
        //[[sender view] setCenter:translatedPoint];
    }
}

可以这么说，这不起作用:(

所以我想我的问题是如何启动动画？

我要做的是在 QC Origami 中模拟“滑动”输入补丁（见截图）

如果有人对我做错了什么以及如何正确调用动画有任何想法，我将不胜感激。

非常感谢！

【问题讨论】：

标签： ios facebook-pop

【解决方案1】：

关键是在屏幕截图中为每个框/动画/设置命名，使其拥有自己的objectName，这样您就知道它指的是哪个 CA 层。然后，在导出代码时，每个popAnimation 都会有一个特定的名称并应用于特定的对象。

示例：而不是

@property (nonatomic) CGFloat popAnimationProgress;
self.layer.layer

你会看到

@property (nonatomic) CGFloat popAnimationProgress_Object1;
self.object2.layer

【讨论】：