Падающий эффект - перемещение по оси z

Question

Я пытаюсь сделать эффект падения как. Я имею в виду движение к оси z.

До сих пор я сделал это:

CATransform3D transform = CATransform3DIdentity; 
transform.m34 = 1.0/-2000; 

Благодаря this вопросу.

Но это не помогает мне достичь моей цели.

Я хочу анимировать падающий эффект, так как направление глаз пользователя - направление падения.

See this animation to explain my effect.

Answer 1

Я сделал UIView под названием «Падение View», который использует CATransform слой в качестве поддерживающего слоя, на котором размещены преобразования вы уже предоставили. Любой вид или слой, добавленный в «Падающий вид», имеет это преобразование, применяемое к нему, поэтому все, что вам нужно сделать, это изменить слой zPosition слоя, чтобы создать эффект масштабирования/падения.

В этом примере я создал CALayer под названием orangeSquare, который является оранжевым квадратом, который находится в центре экрана. Когда вы вызываете метод animate, значение zPosition таблицы изменяется на расстояние, используемое в CATransform3D, которое является наибольшим значением, которое может быть до того, как оно перестанет быть видимым.

#import "FallingView.h" 

#define zDistance 2000.0 

@interface FallingView() 

@property (nonatomic) CATransformLayer *backgroundLayer; 
@property (nonatomic) CALayer *orangeSquare; 

@end 

@implementation FallingView 

-(void)awakeFromNib { 
    //set up the layers 
    [self setupLayers]; 
} 

- (id)initWithFrame:(CGRect)frame 
{ 
    self = [super initWithFrame:frame]; 
    if (self) { 
     //set up the layers 
     [self setupLayers]; 
    } 
    return self; 
} 

-(void)setupLayers { 
    //set up the background layer property to point to this view's layer 
    self.backgroundLayer = (CATransformLayer *)self.layer; 

    //add a transform to the layer 
    CATransform3D transform = CATransform3DIdentity; 
    transform.m34 = -1.0/zDistance; 
    self.backgroundLayer.transform = transform; 

    //set up the orange square 
    self.orangeSquare = [CALayer layer]; //initialize the orange square layer 
    self.orangeSquare.backgroundColor = [UIColor orangeColor].CGColor; //set its background color to orange 
    self.orangeSquare.frame = CGRectMake(0, 0, 50, 50); //set its size to width and height to 50 
    self.orangeSquare.position = CGPointMake(self.bounds.size.width/2, self.bounds.size.height/2); //center the square 

    //add the orange square to the background 
    [self.backgroundLayer addSublayer:self.orangeSquare]; 
} 

-(void)animateSquare { 
    [CATransaction begin]; //Begin a new transaction 
    [CATransaction setAnimationDuration:2.0]; //set its duration 
    [CATransaction setAnimationTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn]]; //ease in for a falling effect 

    //create a basic animation to alter a layer's zPosition 
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"zPosition"]; 
    animation.fromValue = @0; 
    animation.toValue = @zDistance; 

    //add the animation to the orange square 
    [self.orangeSquare addAnimation:animation forKey:@"falling_effect"]; 

    [CATransaction commit]; //commit the transaction 
} 

//change the default backing layer to a CATransformLayer 
+(Class)layerClass { 
    return [CATransformLayer class]; 
} 

@end 

Вы можете сделать то же самое с помощью UIView вместо CALayer вы просто должны изменить zPosition слоя вида по по

UIView *orangeSquareView; 
orangeSquareView.layer.zPosition = 2000; 

---

Файл заголовка просто состоит из метода общественного animateSquare

#import <UIKit/UIKit.h> 

@interface FallingView : UIView 

-(void)animateSquare; 

@end