UIDynamic——UIKit动力学

UIKit动力学最大的特点是将现实世界动力驱动的动画引入了UIKit,比如重力,铰链连接,碰撞,悬挂等效果,即将2D物理引擎引入了UIKit

注意:UIKit动力学的引入,并不是为了替代CA或者UIView动画,在绝大多数情况下CA或者UIView动画仍然是最优方案,只有在需要引入逼真的交互设计的时候,才需要使用UIKit动力学它是作为现有交互设计和实现的一种补充

•其他2D仿真引擎:

BOX2D:C语言框架,免费

Chipmunk:C语言框架免费,其他版本收费

UIDynamic中的三个重要概念

•Dynamic

Animator:动画者,为动力学元素提供物理学相关的能力及动画,同时为这些元素提供相关的上下文,是动力学元素与底层iOS物理引擎之间的中介,将Behavior对象添加到Animator即可实现动力仿真

•DynamicAnimatorItem:动力学元素,是任何遵守了UIDynamicItem协议的对象,从iOS7.0开始,UIView和UICollectionViewLayoutAttributes默认实现该协议。如果自定义的对象实现了该协议,即可通过DynamicAnimator实现物理仿真

•UIDynamicBehavior:仿真行为,是动力学行为的父类,基本的动力学行为类UIGravityBehavior、UICollisionBehavior、UIAttachmentBehavior、UISnapBehavior、UIPushBehavior以及UIDynamicItemBehavior均继承自该父类

动力学动画元素(Dynamic

Animator Item)协议

•只有遵守了UIDynamicItem协议的对象才可以参与到UI动力学仿真中

•从iOS

7开始,UIView和UICollectionViewLayoutAttributes类默认实现了该协议

•协议定义的属性:

bounds:Dynamic

animator需要动画元素的边框时调用,只读属性,用于计算物体的边界以及质量

center:动力学元素的中心点,读写属性

transform:动力学元素的旋转角度,读写属性(需要指定Layer的形变属性)

动力学行为(Dynamic

Behavior)

一个动力学行为可以为一个或者多个动力学元素赋予参与在二维动画中所具备的行为

•iOS7.0中提供的动力学行为包括:

UIGravityBehavior:重力行为

UICollisionBehavior:碰撞行为

UIAttachmentBehavior:附着行为

UISnapBehavior:吸附行为

UIPushBehavior:推行为

UIDynamicItemBehavior:动力学元素行为

•所有的UIDynamicBehavior都是可以独立作用,同时也遵守力的合成。也就是说,组合使用行为可以实现一些较复杂的效果

重力行为(Gravity)

•重力行为用于给动力学元素指定一个重力向量

//实例化一个重力行为,并传入需要做动力仿真的对象view

UIGravityBehavior*gravity = [[UIGravityBehavioralloc]initWithItems:@[view]];

//将重力行为添加到animator

[animatoraddBehavior:gravity];

碰撞行为(Collision)

•碰撞行为用于指定一组动力学元素,在指定的边界范围内,可以彼此发生碰撞

•碰撞行为提供了代理方法,可用于在物体碰撞前、后对动力学元素做碰撞后续的处理

//实例化碰撞行为,并指定view参与碰撞

UICollisionBehavior*collsion= [[UICollisionBehavioralloc]initWithItems:@[view]];

//指定是否启用参照系的边界

collsion.translatesReferenceBoundsIntoBoundary=YES;

//将碰撞行为添加至animator

吸附行为(Snap)

•吸附行为可以将视图通过动画吸附到某个点上

•初始化设定一下UISnapBehavior的initWithItem:snapToPoint:即可

•属性:

·damping:振幅大小,默认为0.5f

附着行为(Attachment)

•附着行为描述一个视图与一个锚点或者另一个视图相连接的情况

•附着行为描述的是两点之间的连接情况,可以模拟刚性或者弹性连接

•在多个物体间设定多个UIAttachmentBehavior,可以模拟多物体连接

·

•属性:

·attachedBehaviorType:连接类型(连接到锚点或视图)

·items:连接视图数组

·anchorPoint:连接锚点

·length:距离连接锚点的距离

•只要设置了以下两个属性,即为弹性连接

·damping:振幅大小

·frequency:振动频率

推行为(Push)

•推行为可以为一个视图施加一个作用力,该力可以是持续的,也可以是一次性的

•可以设置力的大小,方向和作用点等信息

·

•属性:

•mode:推动类型(一次性或是持续推)

•active:是否激活,如果是一次性推,需要激活

•angle:推动角度

•magnitude:推动力量

动力学元素行为(DynamicItem)

•是一个辅助的行为,用来设置运动学元素参与物理仿真过程中的参数,如:弹性系数、摩擦系数、密度、阻力、角阻力以及是否允许旋转等

·

·elasticity(弹性系数):决定了碰撞的弹性程度,比如碰撞时物体的弹性

·friction(摩擦系数):决定了沿接触面滑动时的摩擦力大小

·density(密度):跟size结合使用,计算物体的总质量。质量越大,物体加速或减速就越困难

·resistance(阻力):决定线性移动的阻力大小,与摩擦系数不同,摩擦系数只作用于滑动运动

·angularResistance(角阻力):决定旋转运动时的阻力大小

·allowsRotation(允许旋转):这个属性很有意思,它在真实的物理世界没有对应的模型。设置这个属性为NO物体就完全不会转动,而无论施加多大的转动力

设置不可见碰撞边界并跟踪碰撞情况

// 5.1设置障碍物碰撞边界

CGPointtoPoint =CGPointMake(barrier.frame.origin.x+ barrier.frame.size.width,

barrier.frame.origin.y+ barrier.frame.size.height);

[collisionaddBoundaryWithIdentifier:@"barrier"fromPoint:barrier.frame.origintoPoint:toPoint];

// 6.设置物体的弹性系数

UIDynamicItemBehavior *item =

[[UIDynamicItemBehavior alloc] initWithItems:@[view]];

[item

setElasticity:0.5f];

// 7.监听碰撞动作

collision.action =

^{

NSLog(@"%@", NSStringFromCGRect(view.frame));

};

在碰撞通知代理方法中修改视图颜色

UIView*view = (UIView*)item;

//动画改变碰撞物体的颜色

NSString*ID = [NSStringstringWithFormat:@"%@", identifier];

if([IDisEqualToString:@"barrier"]) {

view.backgroundColor= [UIColorgreenColor];

[UIViewanimateWithDuration:0.3fanimations:^{

view.backgroundColor= [UIColorblueColor];

}];

}

吸附行为

//删除之前的吸附行为

[_animatorremoveBehavior:_snap];

CGPointlocation = [senderlocationInView:self.view];

_snap= [[UISnapBehavioralloc]initWithItem:_boxImageViewsnapToPoint:location];

//生成随机振幅

CGFloatdamping =arc4random_uniform(10) +1;

_snap.damping= damping /10.0f;

[_animatoraddBehavior:_snap];

附加刚性行为

if(UIGestureRecognizerStateBegan== sender.state) {

//创建附加刚性行为

CGPointanchorPoint =CGPointMake(_boxImageView.center.x,_boxImageView.center.y);

_attachment= [[UIAttachmentBehavioralloc]initWithItem:_boxImageViewoffsetFromCenter:UIOffsetMake(-25.0, -25.0)attachedToAnchor:anchorPoint];

[_animatoraddBehavior:_attachment];

}elseif(UIGestureRecognizerStateChanged== sender.state) {

//设置行为的锚点

[_attachmentsetAnchorPoint:[senderlocationInView:self.view]];

}elseif(UIGestureRecognizerStateEnded== sender.state) {

//删除附加行为

[_animatorremoveBehavior:_attachment];

}

注:偏移点偏移一定位置,可以使得在拖动手指时产生旋转的效果

附加弹性行为

if(UIGestureRecognizerStateBegan== sender.state) {

CGPointanchor =CGPointMake(_boxImageView.center.x,_boxImageView.center.y-100);

_attachment= [[UIAttachmentBehavioralloc]initWithItem:_boxImageViewattachedToAnchor:anchor];

[_animatoraddBehavior:_attachment];

[_attachmentsetFrequency:1.0f];

[_attachmentsetDamping:0.1f];

}elseif(UIGestureRecognizerStateChanged== sender.state) {

[_attachmentsetAnchorPoint:[senderlocationInView:self.view]];

}elseif(UIGestureRecognizerStateEnded== sender.state) {

[_animatorremoveBehavior:_attachment];

}

注:设置了frequency和damping属性,创建的即为弹性连接

施加一个力

//计算两点之间距离

CGFloatdistance =sqrtf(powf(p.x-_firstPoint.x,2.0) +powf(p.y-_firstPoint.y,2.0));

CGFloatangle =atan2(p.y-_firstPoint.y, p.x-_firstPoint.x);

_push.magnitude= distance /20;

_push.angle= angle;

[_pushsetActive:YES];

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,835评论 4 364
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,598评论 1 295
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 109,569评论 0 244
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,159评论 0 213
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,533评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,710评论 1 222
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,923评论 2 313
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,674评论 0 203
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,421评论 1 246
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,622评论 2 245
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,115评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,428评论 2 254
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,114评论 3 238
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,097评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,875评论 0 197
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,753评论 2 276
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,649评论 2 271

推荐阅读更多精彩内容