左右左動畫子視圖

Question

我想創建一個類似於Android中的QuickActionBar的視圖，當點擊左上角的按鈕時只是簡單地打開它，但子視圖看起來好像它們來自右側，離開牆壁，並反彈回來，然後進駐。 視圖正在出現，但我無法爲子視圖設置動畫..

Answer 1

CAKeyframeAnimation爲您的問題尋找正確答案。我之前已經編寫了這個動畫功能，讓標籤在屏幕上滑動。我爲你的目的稍微更新了xValues，但很可能你必須和他們一起玩。同樣在擊中牆壁後，您可能想要玩scale.y值，您可以輕鬆地將其集成到關鍵幀動畫中。

+ (void) slideAcrossScreen:(UIView *) view Duration:(CGFloat) duration FromLeft:(BOOL) fromLeft 
{ 
    //This is to make it work with both left-right-left and right-left-right anims. 
    CGFloat slideLength = fromLeft ? -view.frame.origin.x : [[UIScreen mainScreen] bounds].size.width - (view.frame.origin.x + view.frame.size.width); 

    CAKeyframeAnimation *anim = [CAKeyframeAnimation animationWithKeyPath:@"transform.translation.x"]; 

    NSArray *xValues = 
       @[[NSNumber numberWithFloat:view.bounds.origin.x], 
       [NSNumber numberWithFloat:view.bounds.origin.x + 10 * slideLength/10], 
       [NSNumber numberWithFloat:view.bounds.origin.x + 10 * slideLength/10], 
       [NSNumber numberWithFloat:view.bounds.origin.x + 9 * slideLength/10]]; 

    [anim setValues:xValues]; 

    NSArray *timeFrames = 
       @[[NSNumber numberWithFloat:0.0], 
       [NSNumber numberWithFloat:0.85], 
       [NSNumber numberWithFloat:0.9], 
       [NSNumber numberWithFloat:1.0]]; 

    [anim setKeyTimes:timeFrames]; 
    [anim setDuration:duration]; 
    [anim setFillMode:kCAFillModeForwards]; 
    [anim setRemovedOnCompletion:FALSE]; 

    [view.layer addAnimation:anim forKey:@"slide"]; 
} 

Answer 2

我只是花了15分鐘來解決你的麻煩，因爲動畫視圖總是有趣的部分。所以這裏是片段，你將你的view傳遞給它，它會動畫。當然，如果你願意，你可以添加更多。

+ (void) animateView : (UIView *) view{ 
    __block CGRect frame = view.frame; 
    frame.origin.x = - 320; 
    [view setFrame:frame]; 
    [UIView animateWithDuration:1.5f animations:^{ 
     frame.origin.x = 10.0f; 
     frame.size.width = 310.0f; 
     [view setFrame:frame]; 
    } completion:^(BOOL finished) { 
     if (finished) { 
      [UIView animateWithDuration:0.5 animations:^{ 
       frame.origin.x = 0.0f; 
       frame.size.width = 320.0f; 
       [view setFrame:frame]; 
      } completion:^(BOOL finished) { 
      }]; 
     } 
    }]; 
} 

乾杯。