UIImageView'lar nasıl açıldı Kapak kapıları açıldı

Question

Kullanıcıya doğru açılan 2 adet fransız kapı (veya 2 kapaklı kapı) gibi görünen bir animasyon yaratmaya çalışıyorum.

UIViewAnimationOptionTransitionFlipFromRight geçişinde yerleşik kullanmayı denedim, ancak geçişin kökeni sol kenardan ziyade UIImageView'in merkezi gibi görünüyor. Temel olarak, her bir doldurmanın ekrana sahip olduğu 2 UIImageView var. Animasyonun UIImageViews ekranın ortasından kenarlara doğru kaldırılması gibi görünmesini istiyorum.

[UIView transitionWithView:leftView 
        duration:1.0 
        options:UIViewAnimationOptionTransitionFlipFromRight       
       animations:^ { leftView.alpha = 0; } 
       completion:^(BOOL finished) { 
        [leftView removeFromSuperview]; 
       }]; 

Daha önce böyle bir şey yapan oldu mu? Herhangi bir yardım harika olurdu!

GÜNCELLEME: Nick Lockwood Çalışma kod sayesinde

leftView.layer.anchorPoint = CGPointMake(0, 0.5); // hinge around the left edge 
leftView.frame = CGRectMake(0, 0, 160, 460); //reset view position 

rightView.layer.anchorPoint = CGPointMake(1.0, 0.5); //hinge around the right edge 
rightView.frame = CGRectMake(160, 0, 160, 460); //reset view position 

[UIView animateWithDuration:0.75 animations:^{ 
    CATransform3D leftTransform = CATransform3DIdentity; 
    leftTransform.m34 = -1.0f/500; //dark magic to set the 3D perspective 
    leftTransform = CATransform3DRotate(leftTransform, -M_PI_2, 0, 1, 0); 
    leftView.layer.transform = leftTransform; 

    CATransform3D rightTransform = CATransform3DIdentity; 
    rightTransform.m34 = -1.0f/500; //dark magic to set the 3D perspective 
    rightTransform = CATransform3DRotate(rightTransform, M_PI_2, 0, 1, 0); 
    rightView.layer.transform = rightTransform; 
}]; 

Answer 1

İlk projenize QuartzCore kütüphane ekleyip #import <QuartzCore/QuartzCore.h>

Her görünüm canlandırılabilir alt özelliklere sahip layer özelliğine sahiptir. Bu, animasyon yetenekleri söz konusu olduğunda gerçekten harika şeyleri bulacağınız yerdir (CALayer sınıf özelliklerini okuyabilmenizi öneririm - aklınızı uçuracak - herhangi bir görünümde dinamik yumuşak damla gölgeleri?)

Neyse, konuya geri dönün. Kapılarınızı 3 boyutlu olarak açmak için, önce onları kapalı olarak konumlandırın, böylece her bir kapı ekranın yarısını doldurur.

leftDoorView.layer.anchorPoint = CGPoint(0, 0.5); // hinge around the left edge 
rightDoorView.layer.anchorPoint = CGPoint(1.0, 0.5); // hinge around the right edge 

Şimdi aşağıdaki animasyon

[UIView animateWithDuration:0.5 animations:^{ 
    CATransform3D leftTransform = CATransform3DIdentity; 
    leftTransform.m34 = -1.0f/500; //dark magic to set the 3D perspective 
    leftTransform = CATransform3DRotate(leftTransform, M_PI_2, 0, 1, 0); //rotate 90 degrees about the Y axis 
    leftDoorView.layer.transform = leftTransform; 
    //do the same thing but mirrored for the right door, that probably just means using -M_PI_2 for the angle. If you don't know what PI is, Google "radians" 
}]; 

uygulamak aşağıdaki Ve bunu gerektiği gibi

Şimdi onların view.layer.anchorPoint özelliklerini ayarlayın.

YASAL UYARI: Aslında bunu test etmedim, bu yüzden açıları geriye doğru olabilir ve perspektif sert olabilir, vb. En azından iyi bir başlangıç ​​olmalıdır.

GÜNCELLEME: Merakım benden daha iyi oldu.

- (void)viewDidLoad 
{ 
    [super viewDidLoad]; 

    leftDoorView.layer.anchorPoint = CGPointMake(0, 0.5); // hinge around the left edge 
    leftDoorView.center = CGPointMake(0.0, self.view.bounds.size.height/2.0); //compensate for anchor offset 
    rightDoorView.layer.anchorPoint = CGPointMake(1.0, 0.5); // hinge around the right edge 
    rightDoorView.center = CGPointMake(self.view.bounds.size.width,self.view.bounds.size.height/2.0); //compensate for anchor offset 
} 

- (IBAction)open 
{ 
    CATransform3D transform = CATransform3DIdentity; 
    transform.m34 = -1.0f/500; 
    leftDoorView.layer.transform = transform; 
    rightDoorView.layer.transform = transform; 

    [UIView animateWithDuration:0.5 animations:^{ 

     leftDoorView.layer.transform = CATransform3DRotate(transform, M_PI_2, 0, 1, 0); 
     rightDoorView.layer.transform = CATransform3DRotate(transform, -M_PI_2, 0, 1, 0); 
    }]; 
} 

- (IBAction)close 
{ 
    [UIView animateWithDuration:0.5 animations:^{ 

     CATransform3D transform = CATransform3DIdentity; 
     transform.m34 = -1.0f/500; 
     leftDoorView.layer.transform = transform; 
     rightDoorView.layer.transform = transform; 
    }]; 
}