Wie erstelle ich eine UIView-Bounce-Animation?

Ich habe die folgende CATransition für eine aufgerufene UIView finalScoreView, wodurch sie von oben auf den Bildschirm gelangt :

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"];

Wie mache ich es so, dass es einmal springt, nachdem es heruntergekommen ist, und dann still bleibt? Es sollte immer noch von oben in den Bildschirm eintreten, aber dann abprallen, wenn es herunterkommt.

Jede Hilfe wäre sehr dankbar, danke!

Mit iOS7 und UIKit Dynamics, ist es nicht mehr nötig zu verwenden CAKeyframeAnimationsoder UIViewAnimationen!

Schauen Sie sich Apples UIKit Dynamics Catalog-App an . Alternativ hat Teehanlax ein klares , präzises Tutorial mit dem vollständigen Projekt in Github . Wenn Sie ein detaillierteres Tutorial über die Vor- und Nachteile der Dynamik wünschen, ist das Ray Winderlich-Tutorial großartig. Wie immer sind die Apple-Dokumente eine gute erste Anlaufstelle. Lesen Sie daher die Referenz zur UIDynamicAnimator-Klasse in den Dokumenten.

Hier ist ein Teil des Codes aus dem Teenhanlax-Tutorial:

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];

Und hier sind die Ergebnisse

UIKit Dynamics ist eine wirklich leistungsstarke und benutzerfreundliche Ergänzung zu iOS7, mit der Sie eine gut aussehende Benutzeroberfläche erhalten.

Andere Beispiele:

Die Schritte zum Implementieren der UIKit-Dynamik sind immer dieselben:

1. Erstellen Sie ein UIDynamicAnimatorund speichern Sie es in einer starken Eigenschaft
2. Erstellen Sie eine oder mehrere UIDynamicBehaviors. Jedes Verhalten sollte ein oder mehrere Elemente enthalten, normalerweise eine Ansicht zum Animieren.
3. Stellen Sie sicher, dass der Anfangszustand der in der verwendeten Elemente UIDynamicBehaviorsein gültiger Zustand innerhalb der UIDynamicAnimatorSimulation ist.

Eine einfachere Alternative zu UIDynamicAnimatoriOS 7 ist Spring Animation (eine neue und leistungsstarke UIView-Blockanimation), mit der Sie einen schönen Bouncing-Effekt mit Dämpfung und Geschwindigkeit erzielen können: Ziel C.

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

Schnell

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 == sehr federnd. 1.0 macht es sanft abbremsen ohne zu überschießen.

initialSpringVelocityist ungefähr "gewünschte Entfernung, geteilt durch gewünschte Sekunden". 1,0 entspricht der gesamten Animationsentfernung, die in einer Sekunde zurückgelegt wurde. Beispiel: Die gesamte Animationsentfernung beträgt 200 Punkte. Wenn der Beginn der Animation einer Ansichtsgeschwindigkeit von 100 pt / s entspricht, verwenden Sie einen Wert von 0,5.

Ein ausführlicheres Tutorial und eine Beispiel-App finden Sie in diesem Tutorial . Ich hoffe das ist nützlich für jemanden.

Hier ist ein Demo-Projekt, das ich erstellt habe, um Ihnen zu helfen, die Animation genau richtig zu machen. Genießen!

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) {
    }];
}
}