Swift: UIView Animation

Sunday, March 29, 2015

Overview

Animations and transitions are extremely important in iOS development. That’s why you have to know them (I feel like I say that a lot…)! You can find more information about animations here.

Content

animateWithDuration

This function only works with the alpha, frame and transform props of a UIView. You can use this to fade in, rotate the view or the size.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

class UIView {
    class func animateWithDuration(duration: NSTimeInterval,
                                      delay: NSTimeInterval,
                                    options: UIViewAnimationOptions,
                                 animations: () -> Void,
                                 completion: ((finished: Bool) -> Void)? )
}

if myView.alpha = 1.0 {
    UIView.animateWithDuration(3.0,
                        delay: 2.0,
                      options: UIViewAnimationOptions.CurveEaseInEaseOut,
                   animations: { myView.alpha = 0.0 },
                   completion: { if $0 { myView.removeFromSuperview()}} )
}
/*
Fade myView out over 3 seconds starting 2 seconds from now.
When done, remove myView from view hierarchy if the fade completed.
 */

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

/*
UIViewAnimationOptions

  BeginFromCurrentState       // interrupt other, in-progress animations of these props
  AllowUserInteraction        // allow gestures to get processed while animation is in progress
  LayoutSubviews              // animate the relayout of subviews with parent's animation
  Repeat                      // repeat indefinitely
  Autoreverse                 // play animation forward then back
  OverrideInheritedDuration   // if not set, use duration of any in-progress animation
  OverrideInheritedCurve      // if not set, use curve of in-progress animation
  Allow AnimatedContent       // if not set, just interpolate between current and end
  CurveEaseInEaseOut          // slower at first, normal middle, slow end
  CurveEaseIn                 // slow at first, constant else
  CurveLinear                 // same speed
 */

transitionWithView

This one allows you to make an entire view modification at once.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

class UIView {
    class func transitionWithView(view: UIView,
                              duration: NSTimeInterval,
                               options: UIViewAnimationOptions,
                            animations: () -> Void,
                            completion: ((finished: Bool) -> Void)? )
}

UIView.transitionWithView(view: myPlayingCardView,
                      duration: 0.75,
                       options: UIViewAnimationOptions.TransitionFlipFromLeft,
                    animations: { cardIsFaceUp = !cardIsFaceUp},
                    completion: nil )
/*
myPlayingCardView draws itself face up or down depending on `cardIsFaceUp`.
This will cause the card to flip over.
 */

Random Posts