壓縮厲害
<br />
1溯警、UI布局
ViewController上面部分包括一個(gè)CollectionView报账,下面是一張背景圖和一個(gè)Button
<br />
第二個(gè)界面:拖入一個(gè)VisualEffectView,然后在里面添加Button和Label济锄,完成如下圖的布局
<br />
<br />
2催训、實(shí)現(xiàn)
實(shí)現(xiàn)原理,修改系統(tǒng)默認(rèn)的動(dòng)畫彈出方式(設(shè)置代理偿衰,自己去實(shí)現(xiàn)代理方法)挂疆,然后把要顯示的ViewController中的控件做動(dòng)畫效果(分為左右兩邊,先移出到屏幕外下翎,在使用動(dòng)畫效果進(jìn)入屏幕)
在ViewController中創(chuàng)建數(shù)據(jù)源缤言,設(shè)置代理,實(shí)現(xiàn)代理方法
//
// ViewController.swift
// PresentTumblrAnimator
//
// Created by ios on 16/9/23.
// Copyright ? 2016年 ios. All rights reserved.
//
import UIKit
struct model {
var icon = "animator1.jpg"
var name = "default"
var backImage = "animator1.jpg"
}
class ViewController: UIViewController ,UICollectionViewDelegate,UICollectionViewDataSource{
@IBOutlet weak var collectionView: UICollectionView!
let data = [
model(icon: "Chat", name: "小明", backImage: "animator1.jpg"),
model(icon: "Quote", name: "老王", backImage: "animator2.jpg"),
model(icon: "Audio", name: "隔壁大叔", backImage: "animator3.jpg"),
model(icon: "Link", name: "鄰家淑女", backImage: "animator4.jpg")
]
override func viewDidLoad() {
super.viewDidLoad()
collectionView.delegate = self
collectionView.dataSource = self
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
override func preferredStatusBarStyle() -> UIStatusBarStyle {
return .LightContent
}
@IBAction func unwindToMainViewController (sender: UIStoryboardSegue){
self.dismissViewControllerAnimated(true, completion: nil)
}
}
extension ViewController {
func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int{
return 10
}
func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell{
let cell = collectionView.dequeueReusableCellWithReuseIdentifier("collCell", forIndexPath: indexPath) as! CollectionViewCell
let model = data[indexPath.row % 4]
cell.backImage.image = UIImage(named: model.backImage)
cell.icon.image = UIImage(named:model.icon)
cell.nameLabel.text = model.name
return cell
}
}
在第二個(gè)ViewController中依次把每個(gè)控件都拖入到Controller中漏设,設(shè)置動(dòng)畫代理
//
// MenuViewController.swift
// PresentTumblrAnimator
//
// Created by ios on 16/9/23.
// Copyright ? 2016年 ios. All rights reserved.
//
import UIKit
class MenuViewController: UIViewController {
@IBOutlet weak var audioLab: UILabel!
@IBOutlet weak var audioBtn: UIButton!
@IBOutlet weak var charBtn: UIButton!
@IBOutlet weak var chatLab: UILabel!
@IBOutlet weak var photoBtn: UIButton!
@IBOutlet weak var photoLab: UILabel!
@IBOutlet weak var messageBtn: UIButton!
@IBOutlet weak var messageLab: UILabel!
@IBOutlet weak var textBtn: UIButton!
@IBOutlet weak var textLab: UILabel!
@IBOutlet weak var linkBtn: UIButton!
@IBOutlet weak var linkLab: UILabel!
@IBOutlet weak var visualView: UIVisualEffectView!
private let animator = TumblrAnimator()
override func viewDidLoad() {
super.viewDidLoad()
transitioningDelegate = animator
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}
<br />
創(chuàng)建一個(gè)類墨闲,用于實(shí)現(xiàn)動(dòng)畫效果
//
// TumblrAnimator.swift
// PresentTumblrAnimator
//
// Created by ios on 16/9/23.
// Copyright ? 2016年 ios. All rights reserved.
//
import UIKit
class TumblrAnimator: NSObject,UIViewControllerTransitioningDelegate ,UIViewControllerAnimatedTransitioning{
//用于判斷是否是present
var isPresent : Bool = true
/**
監(jiān)聽(tīng)present
- parameter presented: <#presented description#>
- parameter presenting: <#presenting description#>
- parameter source: <#source description#>
- returns: <#return value description#>
*/
func animationControllerForPresentedController(presented: UIViewController, presentingController presenting: UIViewController, sourceController source: UIViewController) -> UIViewControllerAnimatedTransitioning?{
isPresent = true
return self
}
/**
監(jiān)聽(tīng)dismiss
- parameter dismissed: <#dismissed description#>
- returns: <#return value description#>
*/
func animationControllerForDismissedController(dismissed: UIViewController) -> UIViewControllerAnimatedTransitioning?{
isPresent = false
return self
}
/**
設(shè)置動(dòng)畫時(shí)長(zhǎng)
- parameter transitionContext: <#transitionContext description#>
- returns: <#return value description#>
*/
func transitionDuration(transitionContext: UIViewControllerContextTransitioning?) -> NSTimeInterval{
return 0.75
}
/**
設(shè)置動(dòng)畫present/dismiss效果
- parameter transitionContext: <#transitionContext description#>
*/
func animateTransition(transitionContext: UIViewControllerContextTransitioning){
// 1、得到VC
let screens : (from:UIViewController, to:UIViewController) = (transitionContext.viewControllerForKey(UITransitionContextFromViewControllerKey)!, transitionContext.viewControllerForKey(UITransitionContextToViewControllerKey)!)
let menuViewController = !isPresent ? screens.from as! MenuViewController : screens.to as! MenuViewController
let bottomViewController = !isPresent ? screens.to as UIViewController : screens.from as UIViewController
// 2郑口、得到View
let toView = menuViewController.view
let fromView = bottomViewController.view
//判斷是不是present鸳碧,如果是,先把控件移到屏幕外
if isPresent {
closeVC(menuViewController)
}
// 3犬性、獲取容器
let container = transitionContext.containerView()
// 3.1瞻离、把內(nèi)容添加到容器內(nèi)
container?.addSubview(fromView)
container?.addSubview(toView!)
// 4、執(zhí)行動(dòng)畫
UIView.animateWithDuration(transitionDuration(transitionContext), delay: 0, usingSpringWithDamping: 0.7, initialSpringVelocity: 0, options: [], animations: {
if self.isPresent{
self.showVC(menuViewController)
}
else{
self.closeVC(menuViewController)
}
}) { (_) in
transitionContext.completeTransition(true)
UIApplication.sharedApplication().keyWindow!.insertSubview(fromView, atIndex: 0)
}
}
//設(shè)置一開始的位置在屏幕外
private func closeVC(controller : MenuViewController){
controller.view.alpha = 0
//left
controller.audioBtn.transform = CGAffineTransformMakeTranslation(-300, 0)
controller.audioLab.transform = controller.audioBtn.transform
controller.photoBtn.transform = CGAffineTransformMakeTranslation(-150, 0)
controller.photoLab.transform = controller.photoBtn.transform
controller.textBtn.transform = CGAffineTransformMakeTranslation(-50, 0)
controller.textLab.transform = controller.textBtn.transform
//right
controller.charBtn.transform = CGAffineTransformMakeTranslation(300, 0)
controller.chatLab.transform = controller.charBtn.transform
controller.messageBtn.transform = CGAffineTransformMakeTranslation(150, 0)
controller.messageLab.transform = controller.messageBtn.transform
controller.linkBtn.transform = CGAffineTransformMakeTranslation(50, 0)
controller.linkLab.transform = controller.linkBtn.transform
}
//還原原始位置
private func showVC(controller : MenuViewController){
controller.view.alpha = 1
//left
controller.audioBtn.transform = CGAffineTransformIdentity
controller.audioLab.transform = CGAffineTransformIdentity
controller.photoBtn.transform = CGAffineTransformIdentity
controller.photoLab.transform = CGAffineTransformIdentity
controller.textBtn.transform = CGAffineTransformIdentity
controller.textLab.transform = CGAffineTransformIdentity
//right
controller.charBtn.transform = CGAffineTransformIdentity
controller.chatLab.transform = CGAffineTransformIdentity
controller.messageBtn.transform = CGAffineTransformIdentity
controller.messageLab.transform = CGAffineTransformIdentity
controller.linkBtn.transform = CGAffineTransformIdentity
controller.linkLab.transform = CGAffineTransformIdentity
}
}