第九章 動畫和效果

本項目是《beginning iOS8 programming with swift》中的項目學習筆記==》所有筆記目錄

------------------------------------------------------------------------------------------------------------------

1.    拖拽一個ToolBar到Detail控制器中的Table下面，設置好約束，使其停靠在視圖的最下方。
2.    再拖一個Bar Button Item到工具欄上，設置identifier一個爲Action，一個爲Compose，再拖個彈簧給隔開。
3.    在didFinishLaunchingWithOptions方法中:

// 設置Toolbar按鈕的文字顏色
UIBarButtonItem.appearance().tintColor = UIColor.whiteColor()
// 設置Toolbar背景色
UIToolbar.appearance().barTintColor = UIColor.orangeColor()

效果圖：

4. 增長Restaurant review界面：拖一個View Controller進去，再拖一個Image View進去，做爲背景圖片，設置image爲cafeloisl。
5. 在Image View上面拖一個View（45，102，231，242），設置background爲default（透明）。拖一個Label進去，設置title爲「You’ve dined here. What did you think?」。拖三個按鈕進去，設置title爲空，image分別爲：bad、good、great。設置按鈕的background爲orange，tint爲white（須要修改type爲system）。在右上角拖一個按鈕，設置title爲空，image爲：close。
效果圖：

6. 從compose按鈕拖一條segue到review界面，選擇modal，設置identifier爲showReview。
7. 設置按鈕爲圓角：在IB中的User defined runtime attributes裏，添加一個key：layer.cornerRadius,Type:Number,Value:30。
8. 關閉review界面:在Detail控制器中增長一個方法：

@IBAction func close(segue:UIStoryboardSegue) {
}

而後從關閉按鈕拖動到Exit圖標，選擇close。
8. 給背景增長模糊效果：
增長一個繼承自UIViewController的控制器類ReviewViewController，增長一個成員變量：

@IBOutlet weak var backgroundImageView:UIImageView!

接着在viewDidLoad方法中：

var blurEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .Light))
blurEffectView.frame = view.bounds
backgroundImageView.addSubview(blurEffectView)

效果圖：

9. 增長動畫效果：
9.1 先增長一個成員變量並關聯控件：

@IBOutlet weak var dialogView: UIView!

在viewDidLoad方法中：

dialogView.transform = CGAffineTransformMakeScale(0.0, 0.0)

增長viewDidAppear方法：

override func viewDidAppear(animated: Bool) {
    // damping越小，振幅越大
    UIView.animateWithDuration(0.7, delay: 0.0, usingSpringWithDamping: 0.5, initialSpringVelocity: 0.5, options: nil, animations: { () -> Void in
        self.dialogView.transform = CGAffineTransformIdentity
    }, completion: nil)
}

便可實現dialogView從小變大的動畫。
9.2 將viewDidLoad方法中的語句換成：

dialogView.transform = CGAffineTransformMakeTranslation(0, 500)

便可實現從下到上出現的動畫。
9.3 將viewDidLoad方法中的語句換成：

let scale = CGAffineTransformMakeScale(0.0, 0.0)
let translate = CGAffineTransformMakeTranslation(0, 500)
dialogView.transform = CGAffineTransformConcat(scale, translate)

便可綜合兩種動畫。
 
提升：
本身實現分享頁面（提示：須要使用delay參數。）：