iOS动画编程-View动画[ 4 ]高级View Animations

View组合动画

前几节中我们已经学习了基本的View动画，其实我们已经可以通过这些技术的组合实现非常酷炫的效果了，这节我们不会涉及新的API，一起来学习一下View动画的组合

背景图片的渐变效果

背景图片的渐变效果在很多应用中都会遇到，其实利用前几节学习到的基本View动画就可以做到
我们现在希望在这两个界面间进行切换

由于我们希望能够柔和地过渡到第二个图片，如果我们直接替换图片的话会显得非常突然。所以我们采用先添加一个图层，逐渐改变透明度，最终替换图片再移除之前的图层的方法，逐渐改变界面背景

这里我们使用UIView.animateWithDuration 方法实现切换图片的方法
其中的Effects指雪花的效果

    func fadeImageView(imageView:UIImageView,toImage:UIImage,showEffects:Bool){
        let newImageView = UIImageView(image: toImage)
        //新建一个图层
        newImageView.frame = view.frame
        newImageView.alpha = 0.0
        
        UIView.animateWithDuration(0.33, animations: { () -> Void in
        //分别改变透明度
            newImageView.alpha=1.0
            self.snowView.alpha = showEffects ? 1.0 : 0.0
            //添加图层above于原图片
            self.view.insertSubview(newImageView, aboveSubview: imageView)
            }) { _ -> Void in
            //完成后替换图片并移除图层
            imageView.image = newImageView.image
            newImageView.removeFromSuperview()
        }
    }

随后我们在改变的背景的方法中调用上面的动画

    func changeFlightDataAnimatedTo(data:FlightData){
        fadeImageView(bgImageView, toImage: UIImage(named: data.weatherImageName)!, showEffects: data.showWeatherEffects)
        
        delay(seconds: 3.0) {
            self.changeFlightDataAnimatedTo(data.isTakingOff ? parisToRome : londonToParis)
        }
    }

Cube transitions

这里介绍一种常用的文字改变动画
文字的变化就如同将文字写在立方体的两个面上，并转动立方体

这不是一种真正的3D效果，不过也是练习基础View动画的好机会
你的动画方法将有一个参数用来指定方向
首先我们定义一个枚举来表示转动方向

enum AnimationDirection: Int { case Positive = 1
case Negative = -1
}

下面我们来写一下这个动画函数，其参数如下

1. label: 你想要动画改变的Label.

2. text: 接下来想显示的文字.

3. direction: 转动方向.
   首先来做一个原Label除文字外的拷贝

func cubeTransition(label label: UILabel, text: String, direction: AnimationDirection) {
let auxLabel = UILabel(frame: label.frame) 
auxLabel.text = text
auxLabel.font = label.font 
auxLabel.textAlignment = label.textAlignment 
auxLabel.textColor = label.textColor auxLabel.backgroundColor = label.backgroundColor
}

随后我们来计算垂直方向上的补偿，并将Label变形

let auxLabelOffset = CGFloat(direction.rawValue) * label.frame.size.height/2.0
//同时进行两个变形动画
auxLabel.transform = CGAffineTransformConcat( CGAffineTransformMakeScale(1.0, 0.1), CGAffineTransformMakeTranslation(0.0, auxLabelOffset))

label.superview!.addSubview(auxLabel)

UIView.animateWithDuration(0.5, delay: 0.0, options: .CurveEaseOut, animations: {
auxLabel.transform = CGAffineTransformIdentity label.transform = CGAffineTransformConcat(
CGAffineTransformMakeScale(1.0, 0.1),
CGAffineTransformMakeTranslation(0.0, -auxLabelOffset)) }, completion: {_ in
label.text = auxLabel.text
label.transform = CGAffineTransformIdentity
auxLabel.removeFromSuperview() })

未完