iOS10新特性之UIViewPropertyAnimator的使用

2019-11-06 09:58:25

字體：大中小

來源：轉載

供稿：網友

UIViewPRopertyAnimator是iOS的新特性，通過UIViewPropertyAnimator你可以細粒度控制自己制作的動畫，易于抹除、逆向、暫停和重啟動畫，并重構動畫幀使之平滑流暢。這些功能也可以用于控制器的轉場動畫。

OC :

#import "ViewController.h"@interface ViewController ()@property(nonatomic) UIView *views;@property(nonatomic) UIViewPropertyAnimator *animator;@end@implementation ViewController- (void)viewDidLoad { [super viewDidLoad]; UIView *view = [[UIView alloc]initWithFrame:CGRectMake(100, 100, 100, 100)]; view.backgroundColor = [UIColor redColor]; [self.view addSubview:view]; self.views = view; //初始化動畫器 UIViewPropertyAnimator *animator = [[UIViewPropertyAnimator alloc]initWithDuration:4 curve:UIViewAnimationCurveLinear animations:^{ self.views.frame = CGRectMake(200, 200, 200, 200); }]; //添加動畫結束 [animator addCompletion:^(UIViewAnimatingPosition finalPosition) { if(finalPosition == UIViewAnimatingPositionEnd){ self.views.frame = CGRectMake(100, 100, 100, 100); } }]; self.animator = animator;}- (IBAction)start:(UIButton *)sender { [self.animator startAnimation];}- (IBAction)pause:(id)sender { [self.animator pauseAnimation];}- (IBAction)continue:(id)sender { //參數 dampingRatio,阻尼系數越小彈性越大(0-1) UISpringTimingParameters *params = [[UISpringTimingParameters alloc]initWithDampingRatio:0.6]; [self.animator continueAnimationWithTimingParameters:params durationFactor:1];}- (IBAction)stop:(id)sender { [self.animator stopAnimation:false];}

swift:

import UIKitclass ViewController: UIViewController { var v:UIView! var animator:UIViewPropertyAnimator! override func viewDidLoad() { super.viewDidLoad() let v = UIView(frame: CGRect(x:100,y:100,width:100,height:100)) v.backgroundColor = UIColor.red view.addSubview(v) self.v = v //初始化動畫器 let animator = UIViewPropertyAnimator(duration: 4, curve: UIViewAnimationCurve.linear) { v.frame = CGRect(x:200,y:200,width:200,height:200) } animator.addCompletion { (UIViewAnimatingPosition) in v.frame = CGRect(x:100,y:100,width:100,height:100) } self.animator = animator } @IBAction func startAnimate(_ sender: Any) { self.animator.startAnimation() } @IBAction func pauseAnimate(_ sender: Any) { self.animator.pauseAnimation() } @IBAction func continueAnimate(_ sender: Any) { //參數 dampingRatio,阻尼系數越小彈性越大(0-1) let param = UISpringTimingParameters(dampingRatio:0.1) self.animator.continueAnimation(withTimingParameters: param, durationFactor: 1) } @IBAction func stopAnimate(_ sender: Any) { //是否要在動畫執行完畢后再停止 self.animator.stopAnimation(false) }}

拖動放大圖的demo：

import UIKitclass ViewController: UIViewController { // 記錄拖動時的圓形視圖 center var circleCenter: CGPoint! // 我們將在拖拽響應事件上附加不同的動畫 var circleAnimator: UIViewPropertyAnimator! let animationDuration = 4.0 override func viewDidLoad() { super.viewDidLoad() // 添加可拖動視圖 let circle = UIView(frame: CGRect(x: 0.0, y: 0.0, width: 100.0, height: 100.0)) circle.center = self.view.center circle.layer.cornerRadius = 50.0 circle.backgroundColor = UIColor.green // 添加拖動手勢 circle.addGestureRecognizer(UipanGestureRecognizer(target: self, action: #selector(self.dragCircle))) // 可選動畫參數 circleAnimator = UIViewPropertyAnimator(duration: animationDuration, curve: .eaSEOut, animations: { // 放大涼別 circle.transform = CGAffineTransform(scaleX: 2.0, y: 2.0) }) self.view.addSubview(circle) } //拖動事件 func dragCircle(gesture: UIPanGestureRecognizer) { let target = gesture.view! //methond 1// switch gesture.state {// case .began:// circleCenter = target.center// case .changed:// let translation = gesture.translation(in: self.view)// target.center = CGPoint(x: circleCenter!.x + translation.x, y: circleCenter!.y + translation.y)// //傳入一個 0.0-1.0 的浮點數，使其在對應位置暫停// circleAnimator?.fractionComplete = target.center.y / self.view.frame.height// default: break// } //methond 2 switch gesture.state { case .began, .ended: circleCenter = target.center if circleAnimator.state == .active { // 使animator為inactive狀態 circleAnimator.stopAnimation(true) } if (gesture.state == .began) { circleAnimator.addAnimations({ target.transform = CGAffineTransform(scaleX: 2.0, y: 2.0) }) } else { circleAnimator.addAnimations({ target.transform = CGAffineTransform.identity }) } circleAnimator.startAnimation() case .changed: let translation = gesture.translation(in: self.view) target.center = CGPoint(x: circleCenter!.x + translation.x, y: circleCenter!.y + translation.y) default: break }}}

效果圖：這里寫圖片描述