Как получить правильный Z-порядок CATransform3D

Когда я применяю CATransform3DRotate вокруг оси Y к двум UIViews, их z-упорядочение кажется обратным. Разделы UIView, которые были повернуты назад по оси z, появляются перед разделами, которые повернуты к экрану. Эта анимация показывает, что я имею в виду:

анимация вращения

Как мне получить так, чтобы z-порядок вел себя как положено?

Код, который я использовал для создания этой анимации, приведен ниже (двойной [UIView animateWithDuration] просто нужно чтобы правильно до полного оборота):

@interface ViewController ()

@property (strong, nonatomic) UIView *blueSquare;
@property (strong, nonatomic) UIView *redSquare;

@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];

    self.blueSquare = [[UIView alloc] initWithFrame:(CGRect){.origin = {160,234}, .size = {400,300}}];
    self.blueSquare.backgroundColor = [UIColor blueColor];
    [self.view addSubview:self.blueSquare];

    self.redSquare = [[UIView alloc] initWithFrame:(CGRect){.origin = {464,234}, .size = {400,300}}];
    self.redSquare.backgroundColor = [UIColor redColor];
    [self.view addSubview:self.redSquare];
}

- (void)viewDidAppear:(BOOL)animated {
    [super viewDidAppear:animated];

    [UIView animateWithDuration:5 delay:0 options:UIViewAnimationOptionCurveLinear animations:^{
        CATransform3D transform = CATransform3DIdentity;

        transform.m34 = 1.0/900.0;  // for perspective

        transform = CATransform3DRotate(transform, M_PI, 0, 1, 0);

        self.blueSquare.layer.transform = transform;
        self.redSquare.layer.transform = transform;
    } completion:^(BOOL finished) {
        [UIView animateWithDuration:5 delay:0 options:UIViewAnimationOptionCurveLinear animations:^{
            CATransform3D transform = CATransform3DIdentity;

            transform.m34 = 1.0/900.0;  // for perspective

            transform = CATransform3DRotate(transform, 2*M_PI-0.001, 0, 1, 0);

            self.blueSquare.layer.transform = transform;
            self.redSquare.layer.transform = transform;
        } completion:nil];
    }];
}

@end

1 ответ

Решение

Перспектива в ваших трансформациях перевернута. Обычно вы бы использовали отрицательное значение для m34 (3-й столбец, 4-й ряд в матрице преобразования) компонент преобразования.

Другие вопросы по тегам