Hoạt ảnh giữa hai trạng thái của chế độ xem, sử dụng hoạt ảnh tùy chỉnh

Question

Tôi muốn tạo hiệu ứng động giữa hai trạng thái của chế độ xem. Ví dụ: giả sử tôi có chế độ xem có nhãn và khi tôi thay đổi văn bản của nhãn, hoạt ảnh sẽ hiển thị thay đổi khi lật trang.

Bây giờ bạn có thể tất nhiên làm điều này với một [UIView setAnimationTransition:forView:cache:]:

- (IBAction)nextPage { 
    [UIView beginAnimation:nil context:nil]; 
    [UIView setAnimationDuration:1]; 
    [UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:pageView cache:NO]; 
    label.text = @"page 2"; 
    [UIView commitAnimations]; 
} 

- (IBAction)previousPage { 
    [UIView beginAnimation:nil context:nil]; 
    [UIView setAnimationDuration:1]; 
    [UIView setAnimationTransition:UIViewAnimationTransitionCurlDown forView:pageView cache:NO]; 
    label.text = @"page 1"; 
    [UIView commitAnimations]; 
} 

... nhưng sau đó bạn không thể sử dụng hình ảnh động tùy chỉnh của riêng bạn, bạn đang bị mắc kẹt vào hình ảnh động built-in (họ đang tốt đẹp nhưng chúng không phù hợp với nhu cầu của tôi).

Vì vậy, các tùy chọn khác là thêm một CAAnimation đến lớp của xem:

- (IBAction)nextPage { 
    CAAnimation *animation = [self animationWithDuration:1 forward:NO]; 
    [pageView.layer addAnimation:animation forKey:@"pageTransition"]; 
    label.text = @"page 2"; 
} 

- (IBAction)previousPage { 
    CAAnimation *animation = [self animationWithDuration:1 forward:YES]; 
    [pageView.layer addAnimation:animation forKey:@"pageTransition"]; 
    label.text = @"page 1"; 
} 

Sau đó, bạn có thể tự do thiết lập bất cứ hoạt hình Core Animation cho phép bạn làm. Điều này hoạt động tốt nếu tôi xác định hoạt ảnh CATransition, ví dụ: kCATransitionReveal: chế độ xem trong trạng thái "trang 2" xuất hiện bên dưới chế độ xem ở trạng thái "trang 1" khi nó trượt ra ngoài.

- (CAAnimation *)animationWithDuration:(float)duration forward:(BOOL)forward { 
    CATransition *animation = [CATransition animation]; 
    [animation setType:kCATransitionReveal]; 
    [animation setSubtype:forward?kCATransitionFromLeft:kCATransitionFromRight]; 
    [animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn]]; 

    animation.duration = duration; 
    return animation; 
} 

Nhưng khi tôi xác định hoạt ảnh là ví dụ: CABasicAnimation, chỉ một trạng thái của chế độ xem được hiển thị.

- (CAAnimation *)animationWithDuration:(float)duration forward:(BOOL)forward { 
    CATransform3D transform = CATransform3DIdentity; 
    transform.m34 = 1.0/-1000; 
    transform = CATransform3DRotate(transform, M_PI, 0.0f, 1.0f, 0.0f); 
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform"]; 
    if(forward) { 
     animation.fromValue = [NSValue valueWithCATransform3D:transform]; 
    } else { 
     animation.toValue = [NSValue valueWithCATransform3D:transform]; 
    } 

    animation.duration = duration; 
    return animation; 
} 

Thay vào đó, tôi muốn xem trong "trang 1" nhà nước vẫn có thể nhìn thấy cho đến khi kết thúc hoạt hình trong khi xem trong "trang 2" nhà nước đi vào khung hình, chính xác như nó cư xử với một hoạt ảnh chuyển tiếp. Tất nhiên, tôi luôn có thể lộn xộn với việc sao chép chế độ xem và có một lần xuất hiện dưới dạng chế độ xem anh chị em trong khi tôi tạo ảnh động ở phía trước và xóa nó khỏi superview khi hoàn thành ... nhưng phải có một cách thẳng thắn hơn để đạt được hiệu ứng hoạt ảnh khá đơn giản này mà không gây rối với các khung nhìn.

Có lẽ một cái gì đó để nói với lớp, nhưng sau đó tôi không biết gì, và đó là nơi tôi cần sự giúp đỡ của bạn, guys :)

Cảm ơn!

Answer 1

Vâng, bạn có thể tạo một lớp, đặt nội dung đó thành một hình ảnh thể hiện trạng thái cuối cùng của chế độ xem của bạn, so với áp dụng hoạt ảnh cho lớp này. Khi hoạt ảnh được thực hiện, bạn có thể xóa lớp và chuyển trạng thái xem.

Tôi nghĩ điều này sẽ hoạt động tốt hơn so với kích hoạt toàn bộ chế độ xem.

Answer 2

Gần đây, tôi đã thực hiện chuyển đổi trang trình bày tùy chỉnh giữa các bản xem trước trong bộ điều khiển. Cách tiếp cận của tôi là lấy một bitmap của chế độ xem và chế độ xem, thêm chúng vào chế độ xem và tạo hiệu ứng cho chế độ xem đó. Cuối cùng, bạn chỉ có thể xóa chế độ xem chuyển đổi và hiển thị chế độ xem. Dưới đây là một đoạn trích phương pháp chuyển đổi:

-(void) transitionToView:(UIView *)viewIn lastView:(UIView *)viewOut slideRight:(BOOL)isRight { 
UIGraphicsBeginImageContext(viewOut.frame.size); 

UIImageView *bitmapOut = [[UIImageView alloc] initWithFrame: viewOut.frame]; 

[viewOut.layer renderInContext:UIGraphicsGetCurrentContext()]; 
UIImage *viewOutImage = UIGraphicsGetImageFromCurrentImageContext(); 
UIGraphicsEndImageContext(); 
bitmapOut.image = viewOutImage; 

UIImageView *bitmapIn = [[UIImageView alloc] initWithFrame: viewIn.frame ]; 
bitmapIn.frame = CGRectMake(isRight ? 320 : -320, bitmapIn.frame.origin.y, bitmapIn.frame.size.width, bitmapIn.frame.size.height); 
UIGraphicsBeginImageContext(viewIn.frame.size); 

[viewIn.layer renderInContext:UIGraphicsGetCurrentContext()]; 
UIImage *viewInImage = UIGraphicsGetImageFromCurrentImageContext(); 
UIGraphicsEndImageContext(); 

bitmapIn.image = viewInImage; 

[self.view addSubview:transitionContainer]; 

[transitionContainer addSubview:bitmapIn]; 
[transitionContainer addSubview:bitmapOut]; 

[self removeAllViews]; 

[UIView beginAnimations:nil context:nil]; 
[UIView setAnimationDuration:0.5f]; 
[UIView setAnimationDelegate:self]; 
[UIView setAnimationDidStopSelector:@selector(swapViewsAtEndOfTransition:)]; 
transitionContainer.frame = CGRectMake(isRight ? -320 : 320, 0, 640, 411); 
[UIView commitAnimations]; 

[bitmapOut release]; bitmapOut = nil; 
[bitmapIn release]; bitmapIn = nil;} 

Sau đó, trong bộ chọn swapViewsAtEndOfTransition bạn có thể cập nhật chế độ xem cho phù hợp.

Answer 3

Đã trôi qua nhưng tôi đoán tôi đã tìm được giải pháp cho bạn. Chỉ cần sử dụng kCATransitionPush thay vì kCATransitionReveal. Như thế này:

- (CAAnimation *)animationWithDuration:(float)duration forward:(BOOL)forward { 
    CATransition *animation = [CATransition animation]; 
    [animation setType:kCATransitionPush]; 
    [animation setSubtype:forward?kCATransitionFromLeft:kCATransitionFromRight]; 
    [animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn]]; 

    animation.duration = duration; 
    return animation; 
}