UIView sıçrama animasyonu nasıl oluşturulur?

Bir UIView için aşağıdaki CATransition çağrısına sahibim finalScoreView, bu da ekrana üstten girmesini sağlar:

CATransition *animation = [CATransition animation];
animation.duration = 0.2;
animation.type = kCATransitionPush;
animation.subtype = kCATransitionFromBottom;
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];

[gameOver.layer addAnimation:animation forKey:@"changeTextTransition"];
[finalScoreView.layer addAnimation:animation forKey:@"changeTextTransition"];

Aşağı indikten sonra sıçrayıp sabit kalmasını nasıl sağlayabilirim? Yine de yukarıdan ekrana girmeli, ancak aşağı indiğinde zıplamalıdır.

Herhangi bir yardım çok takdir edilecektir, teşekkürler!

İOS7 ve UIKit Dynamics ile artık kullanıma CAKeyframeAnimationsveya UIViewanimasyonlara gerek yok !

Apple'ın UIKit Dynamics Katalog uygulamasına bir göz atın . Alternatif olarak, Teehanlax'ın github'daki tam proje ile açık ve öz bir öğreticisi var . Dinamiklerin giriş ve çıkışları hakkında daha ayrıntılı bir eğitim istiyorsanız, Ray Winderlich eğitimi harikadır. Her zaman olduğu gibi, Apple dokümanları harika bir ilk duraktır, bu nedenle dokümanlardaki UIDynamicAnimator Sınıfı referansına bakın.

İşte Teenhanlax eğitiminden bir parça kod:

self.animator = [[UIDynamicAnimator alloc] initWithReferenceView:self.view];

UIGravityBehavior *gravityBehavior = 
                [[UIGravityBehavior alloc] initWithItems:@[self.redSquare]];
[self.animator addBehavior:gravityBehavior];
    
UICollisionBehavior *collisionBehavior = 
                [[UICollisionBehavior alloc] initWithItems:@[self.redSquare]]; 
collisionBehavior.translatesReferenceBoundsIntoBoundary = YES;
[self.animator addBehavior:collisionBehavior];
    
UIDynamicItemBehavior *elasticityBehavior = 
                [[UIDynamicItemBehavior alloc] initWithItems:@[self.redSquare]];
elasticityBehavior.elasticity = 0.7f;
[self.animator addBehavior:elasticityBehavior];

Ve işte sonuçlar

UIKit Dynamics, iOS7'ye gerçekten güçlü ve kullanımı kolay bir eklentidir ve ondan harika görünümlü bir UI elde edebilirsiniz.

Diğer örnekler:

UIKit dinamiklerini uygulama adımları her zaman aynıdır:

1. Bir oluşturun UIDynamicAnimatorve güçlü bir mülkte depolayın
2. Bir veya daha fazla oluşturun UIDynamicBehaviors. Her davranışın bir veya daha fazla öğesi olmalıdır, tipik olarak canlandırılacak bir görünüm.
3. Kullanılan öğelerin başlangıç ​​durumunun simülasyon UIDynamicBehaviorsiçinde geçerli bir durum olduğundan emin olun UIDynamicAnimator.

UIDynamicAnimatorİOS 7'ye göre daha basit bir alternatif , size sönümleme ve hız ile hoş bir sıçrama efekti verebilen Spring Animation'dır (yeni ve güçlü bir UIView blok animasyonu): Objective C

[UIView animateWithDuration:duration
  delay:delay
  usingSpringWithDamping:damping
  initialSpringVelocity:velocity
  options:options animations:^{
    //Animations
    }
  completion:^(BOOL finished) {
    //Completion Block
}];

Swift

UIView.animateWithDuration(duration,
     delay: delay,
     usingSpringWithDamping: damping,
     initialSpringVelocity: velocity,
     options: options,
     animations: {
            //Do all animations here
            }, completion: {
            //Code to run after animating
                (value: Bool) in
        })

Swift 4.0

UIView.animate(withDuration:duration,
     delay: delay,
     usingSpringWithDamping: damping,
     initialSpringVelocity: velocity,
     options: options,
     animations: {
            //Do all animations here
            }, completion: {
            //Code to run after animating
                (value: Bool) in
        })

usingSpringWithDamping 0.0 == çok zıplayan. 1.0, aşırı hızlanmadan sorunsuz bir şekilde yavaşlamasını sağlar.

initialSpringVelocitykabaca "istenen mesafenin, istenen saniyeye bölünmesidir". 1.0, bir saniyede geçilen toplam animasyon mesafesine karşılık gelir. Örneğin, toplam animasyon mesafesi 200 noktadır ve animasyonun başlangıcının 100 pt / s'lik bir görüntüleme hızıyla eşleşmesini istiyorsanız, 0,5 değerini kullanın.

Daha ayrıntılı öğretici ve örnek uygulama bu eğiticide bulunabilir . Umarım bu birisi için yararlıdır.

İşte animasyonu doğru bir şekilde yapmanıza yardımcı olmak için oluşturduğum bir demo proje. Zevk almak!

SpringDampingDemo

- (IBAction)searchViewAction:(UIButton*)sender
{
  if(sender.tag == 0)
  {
    sender.tag = 1;

    CGRect optionsFrame2 = self.defaultTopView.frame;
    optionsFrame2.origin.x = -320;

    CGRect optionsFrame = self.searhTopView.frame;
    optionsFrame.origin.x = 320;
    self.searhTopView.frame = optionsFrame;

    [UIView animateWithDuration:1.0 delay:0.0 usingSpringWithDamping:0.5 initialSpringVelocity:1.0 options:0 animations:^{

        CGRect optionsFrame = self.searhTopView.frame;

        optionsFrame.origin.x = 0;
        self.searhTopView.frame = optionsFrame;
        self.defaultTopView.frame = optionsFrame2;
    } completion:^(BOOL finished) {
    }];        
}
else
{
    sender.tag = 0;

    CGRect optionsFrame2 = self.defaultTopView.frame;
    optionsFrame2.origin.x = 0;

    CGRect optionsFrame = self.searhTopView.frame;
    optionsFrame.origin.x = 320;

    [UIView animateWithDuration:1.0 delay:0.0 usingSpringWithDamping:0.5 initialSpringVelocity:1.0 options:0 animations:^{

        CGRect optionsFrame = self.searhTopView.frame;

        optionsFrame.origin.x = 320;
        self.searhTopView.frame = optionsFrame;
        self.defaultTopView.frame = optionsFrame2;
    } completion:^(BOOL finished) {
    }];
}
}