如何使用Core Animation創建無限滾動循環

Question

我是蘋果開發人員的新手，對Core Animation有個疑問，根據我的理解，您可以使用Objects/Images創建動畫。

有多個教程，但他們都只是簡單地顯示代碼，並沒有真正解釋它是如何工作的。正因爲如此，當試圖在我的應用程序中使用Core Animation時，我遇到了一些困難。

我的目標是創建一個永無止境的圖像使用可收回圖像的錯覺。我有一個基本概念的理解，我有2個UIImageViews設置，最初我嘗試使用NSTimer每隔0.01秒調用2個方法來設置它們。一次移動對象時，每次調用時只需將Y值加1，另一次在每次調用時檢查每個UIImageView的位置，然後當它到達允許它完全離開屏幕底部的像素時，重置它到頂部，不幸的是它非常滯後，重置從未正常工作。

現在我轉向了Core Animation，因爲我覺得這是創建移動對象的目標方式。我用我最小的知識創造了一些動畫，但沒有任何我嘗試過的。

希望有人能幫助我用兩個UIImageView創建無限圖像的幻覺。我不介意你是否解釋瞭如何使用Core Animation創建一個，或者如果你想修復我寫的原始代碼的想法。

任何幫助，非常感謝。

Answer 1

下面是一個樣本UIViewController我鞭打。它使用基本的UIView實例而不是UIImageView，但這些應該是直接交換項目。

在我的測試中，效果是一個永不停息的紅色和藍色橫幅的外觀（即視圖控制器的白色背景從未見過）。

這確實不使用CAAnimation，而是利用提供UIView塊爲基礎的動畫，我認爲這是一個更容易管理。

這是否給你你想要的？

注意：這忽略包括頭文件ViewController.h，但它是完全空的任何代碼。

// ViewController.m 
#import "ViewController.h" 

// Private Interface 
@interface ViewController() 

#pragma mark - 
#pragma mark - UI Controls 
@property (strong, nonatomic) UIView *view1; 
@property (strong, nonatomic) UIView *view2; 

#pragma mark - 
#pragma mark - Private Properties 
@property (assign, nonatomic) BOOL isVisible; 
@property (strong, nonatomic) NSLayoutConstraint *view1HeightConstraint; 
@property (strong, nonatomic) NSLayoutConstraint *view2HeightConstraint; 
@property (strong, nonatomic) NSLayoutConstraint *view1TopConstraint; 
@property (strong, nonatomic) NSLayoutConstraint *view2TopConstraint; 
@end 

@implementation ViewController 

#pragma mark - 
#pragma mark - View Lifecycle 
- (void)viewDidLoad { 
    [super viewDidLoad]; 
    [self setupUserInterface]; 
} 
- (void)viewWillAppear:(BOOL)animated { 
    [super viewWillAppear:animated]; 

    // At this point, self.view has its correct size, 
    // so use it to set the height of the sub views 
    self.view1HeightConstraint.constant = self.view.frame.size.height; 
    self.view2HeightConstraint.constant = self.view.frame.size.height; 

} 

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

    // The screen has been shown, so store this value and begin the animations 
    self.isVisible = YES; 
    [self slideDown1]; 
} 

- (void)viewDidDisappear:(BOOL)animated { 
    [super viewDidDisappear:animated]; 
    // So that the animations will stop and this view controller can be released 
    self.isVisible = NO; 
} 

#pragma mark - 
#pragma mark - Animations 
- (void)slideDown1 { 
    // This sets the top of view1's frame equal to the bottom of self.view.frame 
    self.view1TopConstraint.constant = self.view.frame.size.height; 
    // This sets the top of view2's frame equal to the top of self.view.frame 
    self.view2TopConstraint.constant = 0.0f; 

    // If we didn't call this block, the changes set above would take effect "immediately" 
    [UIView animateWithDuration:1.0f 
        animations:^{ 
         // Calling this inside of an animation causes the changes above to be animated 
         [self.view layoutIfNeeded]; 
        } 
        completion:^(BOOL finished) { 
         // This block will execute when the animations finish 

         // This moves self.view1 so that its bottom is aligned with the top of self.view 
         self.view1TopConstraint.constant = -1.0f * self.view.frame.size.height; 

         // This causes the line above to take place immediately 
         [self.view layoutIfNeeded]; 

         if (self.isVisible == YES) { 
          // If the screen is still visible, start the next animation 
          [self slideDown2]; 
         } 
        } 
    ]; 
} 
- (void)slideDown2 { 
    self.view1TopConstraint.constant = 0.0f; 
    self.view2TopConstraint.constant = self.view.frame.size.height; 
    [UIView animateWithDuration:1.0f 
        animations:^{ 
         [self.view layoutIfNeeded]; 
        } 
        completion:^(BOOL finished) { 
         self.view2TopConstraint.constant = -1.0f * self.view.frame.size.height; 
         [self.view layoutIfNeeded]; 
         if (self.isVisible == YES) { 
          [self slideDown1]; 
         } 
        } 
    ]; 
} 
#pragma mark - 
#pragma mark - UI Setup 
- (void)setupUserInterface { 
    [self createControls]; 
    [self setupControls]; 
    [self layoutControls]; 
} 
- (void)createControls { 
    self.view1 = [[UIView alloc] init]; 
    self.view2 = [[UIView alloc] init]; 
} 
- (void)setupControls { 
    self.view1.backgroundColor = [UIColor redColor]; 
    // This line is required for our "full auto layout", 
    // which just means (in this case) that we're doing it all in code 
    [self.view1 setTranslatesAutoresizingMaskIntoConstraints:NO]; 

    self.view2.backgroundColor = [UIColor blueColor]; 
    [self.view2 setTranslatesAutoresizingMaskIntoConstraints:NO]; 

} 
- (void)layoutControls { 
    // The subviews have to be added to self.view before we can constrain them 
    [self.view addSubview:self.view1]; 
    [self.view addSubview:self.view2]; 

    // This sets up the subviews to make their width equal to self.view's width 
    // You could have also used this method for the views' heights 
    [self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.view1 
                  attribute:NSLayoutAttributeWidth 
                  relatedBy:NSLayoutRelationEqual 
                  toItem:self.view 
                  attribute:NSLayoutAttributeWidth 
                 multiplier:1.0f 
                  constant:0.0f]]; 
    [self.view addConstraint:[NSLayoutConstraint constraintWithItem:self.view2 
                  attribute:NSLayoutAttributeWidth 
                  relatedBy:NSLayoutRelationEqual 
                  toItem:self.view 
                  attribute:NSLayoutAttributeWidth 
                 multiplier:1.0f 
                  constant:0.0f]]; 

    // This gives us properties we can use later to animate the views' movements 
    self.view1TopConstraint  = [NSLayoutConstraint constraintWithItem:self.view1 
                   attribute:NSLayoutAttributeTop 
                   relatedBy:NSLayoutRelationEqual 
                    toItem:self.view 
                   attribute:NSLayoutAttributeTop 
                   multiplier:1.0f 
                   constant:0.0f]; 
    // You created the constraint, but it has to be installed/added 
    [self.view addConstraint:self.view1TopConstraint]; 

    // A different and probably less effective way to set the heights of the subviews 
    self.view1HeightConstraint = [NSLayoutConstraint constraintWithItem:self.view1 
                   attribute:NSLayoutAttributeHeight 
                   relatedBy:NSLayoutRelationEqual 
                    toItem:nil 
                   attribute:NSLayoutAttributeNotAnAttribute 
                   multiplier:1.0f 
                   constant:0.0f]; 
    [self.view addConstraint:self.view1HeightConstraint]; 

    self.view2TopConstraint  = [NSLayoutConstraint constraintWithItem:self.view2 
                   attribute:NSLayoutAttributeTop 
                   relatedBy:NSLayoutRelationEqual 
                    toItem:self.view 
                   attribute:NSLayoutAttributeTop 
                   multiplier:1.0f 
                   constant:0.0f]; 
    [self.view addConstraint:self.view2TopConstraint]; 

    self.view2HeightConstraint = [NSLayoutConstraint constraintWithItem:self.view2 
                   attribute:NSLayoutAttributeHeight 
                   relatedBy:NSLayoutRelationEqual 
                    toItem:nil 
                   attribute:NSLayoutAttributeNotAnAttribute 
                   multiplier:1.0f 
                   constant:0.0f]; 
    [self.view addConstraint:self.view2HeightConstraint]; 
} 
@end