重力动画

最新推荐文章于 2022-11-24 22:16:31 发布

扬子阿闹

最新推荐文章于 2022-11-24 22:16:31 发布

阅读量628

点赞数

<code class="hljs applescript has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;">     重力效果：UIGravityBehavior设置重力方向  加速度  让物体（视图）朝着重力方向掉落
     重要属性：
     @<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">property</span> (nonatomic, readonly, <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">copy</span>) NSArray *items;添加到重力效果中的所有效果作用对象
     @<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">property</span> (readwrite, nonatomic) CGVector gravityDirection;重力方向（是一个二维向量）以左上角为坐标原点 x 负数向左 正数向右  y 负数向上  正数向下  数字越大  重力效果越大
     @<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">property</span> (readwrite, nonatomic) CGFloat angle;重力方向（是一个角度，x轴正方向为<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>°，顺时针正数，逆时针负数）
     @<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">property</span> (readwrite, nonatomic) CGFloat magnitude;量级（用来控制加速度，<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">1.0</span>代表加速度是<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">1000</span> points /<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">second</span>²）重力加速度越大 碰撞越厉害
     */</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li><li style="box-sizing: border-box; padding: 0px 5px;">8</li></ul>

<code class="hljs objectivec has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;"><span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">#import <span class="hljs-title" style="box-sizing: border-box;">"ViewController.h"</span></span>

<span class="hljs-class" style="box-sizing: border-box;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">@interface</span> <span class="hljs-title" style="box-sizing: border-box; color: rgb(102, 0, 102);">ViewController</span>()<<span class="hljs-title" style="box-sizing: border-box; color: rgb(102, 0, 102);">UIDynamicAnimatorDelegate</span>,<span class="hljs-title" style="box-sizing: border-box; color: rgb(102, 0, 102);">UICollisionBehaviorDelegate</span>></span>
{
    UIDynamicAnimator *animator;
    <span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">UIView</span> *view;
    <span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">UIView</span> *view2;
}
<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">@end</span>

<span class="hljs-class" style="box-sizing: border-box;"><span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">@implementation</span> <span class="hljs-title" style="box-sizing: border-box; color: rgb(102, 0, 102);">ViewController</span></span>

- (<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span>)viewDidLoad {
    [<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">super</span> viewDidLoad];</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li><li style="box-sizing: border-box; padding: 0px 5px;">8</li><li style="box-sizing: border-box; padding: 0px 5px;">9</li><li style="box-sizing: border-box; padding: 0px 5px;">10</li><li style="box-sizing: border-box; padding: 0px 5px;">11</li><li style="box-sizing: border-box; padding: 0px 5px;">12</li><li style="box-sizing: border-box; padding: 0px 5px;">13</li><li style="box-sizing: border-box; padding: 0px 5px;">14</li></ul>

<code class="hljs objectivec has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;">
<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//    UIDynamicAnimator</span>
    <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">/*
     UIDynamic是从ios7开始引入的一种新技术  属于UIKit框架  可以模拟现实生活中的物理现象  如碰撞  抖动  摆动 等

     动力效果：如动吉他，电吉他有效果器  可以添加各种电子效果

     动力效果也有一个效果器，叫做动力效果器，里面可以添加动力效果

     电吉他可以叠加多个效果   动力效果也是一样

     动力效果的使用步骤：
     1、创建动力效果器（UIDynamicAnimator）
     2、创建动力效果（Behavior）添加到对应的视图上
     3、将动力效果添加到动力效果器中开始动力效果

     再是用动力效果的时候必须遵守UIDynamicItem这个协议才可以使用动力效果

     UIView默认遵守了UIDynamicItem协议

     UIDynamic提供的动力效果
     UIGravityBehavior：重力效果
     UICollisionBehavior：碰撞效果
     UIDynamicItemBehavior：动力元素效果
     UIPushBehavior：推动效果
     UISnapBehavior：迅速移动效果
     UIAttachmentBehavior：附着效果

     都继承自UIDynamicBehavior

     动力效果器：UIDynamicAnimator
     可以把UIDynamicAnimator看做动力效果的容器 它制定了动力效果的有效范围
     在初始化的时候可以指定他的有效范围
     - (instancetype)initWithReferenceView:(UIView*)view;
     作用在哪一个view上 哪一个view就是他产生动力效果的有效范围

     既然是容器  他还可以添加移除 动力效果
     - (void)addBehavior:(UIDynamicBehavior *)behavior; 添加动力效果
     - (void)removeBehavior:(UIDynamicBehavior *)behavior; 移除动力效果
     - (void)removeAllBehaviors; 移除之前添加过的所有动力效果


     动力效果器常用的属性
     @property (nonatomic, readonly) UIView* referenceView;作用的区域
     @property (nonatomic, readonly, copy) NSArray* behaviors;添加到效果器中的所有效果
     @property (nonatomic, readonly, getter = isRunning) BOOL running;是否正在进行
     @property (nonatomic, assign) id <UIDynamicAnimatorDelegate> delegate;可以检测开始暂停
     - (void)dynamicAnimatorWillResume:(UIDynamicAnimator*)animator;
     - (void)dynamicAnimatorDidPause:(UIDynamicAnimator*)animator;
     */</span>


    animator = [[UIDynamicAnimator alloc]initWithReferenceView:<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">self</span><span class="hljs-variable" style="color: rgb(102, 0, 102); box-sizing: border-box;">.view</span>];
<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//    self.view是产生动力效果的区域</span>
    animator<span class="hljs-variable" style="color: rgb(102, 0, 102); box-sizing: border-box;">.delegate</span> = <span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">self</span>;


    view = [[<span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">UIView</span> alloc]initWithFrame:CGRectMake(<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">100</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">100</span>)];
    view<span class="hljs-variable" style="color: rgb(102, 0, 102); box-sizing: border-box;">.layer</span><span class="hljs-variable" style="color: rgb(102, 0, 102); box-sizing: border-box;">.cornerRadius</span> = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">50</span>;
    view<span class="hljs-variable" style="color: rgb(102, 0, 102); box-sizing: border-box;">.backgroundColor</span> = [<span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">UIColor</span> colorWithRed:<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0.345</span> green:<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">1.000</span> blue:<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0.391</span> alpha:<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">1.000</span>];
    [<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">self</span><span class="hljs-variable" style="color: rgb(102, 0, 102); box-sizing: border-box;">.view</span> addSubview:view];

    view2 = [[<span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">UIView</span> alloc]initWithFrame:CGRectMake(<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">50</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">200</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">100</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">100</span>)];
    view2<span class="hljs-variable" style="color: rgb(102, 0, 102); box-sizing: border-box;">.layer</span><span class="hljs-variable" style="color: rgb(102, 0, 102); box-sizing: border-box;">.cornerRadius</span> = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">50</span>;
    view2<span class="hljs-variable" style="color: rgb(102, 0, 102); box-sizing: border-box;">.backgroundColor</span> = [<span class="hljs-built_in" style="color: rgb(102, 0, 102); box-sizing: border-box;">UIColor</span> colorWithRed:<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">1.000</span> green:<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0.282</span> blue:<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0.298</span> alpha:<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">1.000</span>];
    [<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">self</span><span class="hljs-variable" style="color: rgb(102, 0, 102); box-sizing: border-box;">.view</span> addSubview:view2];
    }
<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">#pragma mark 动力效果器的代理方法</span>
<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//启动</span>
- (<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span>)dynamicAnimatorWillResume:(UIDynamicAnimator*)animator{

}
<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//暂停</span>
- (<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span>)dynamicAnimatorDidPause:(UIDynamicAnimator*)animator{

}
- (<span class="hljs-keyword" style="color: rgb(0, 0, 136); box-sizing: border-box;">void</span>)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event{
<span class="hljs-preprocessor" style="color: rgb(68, 68, 68); box-sizing: border-box;">#pragma mark 重力效果</span>

<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//    把之前添加过的重力效果移除</span>
    [animator removeAllBehaviors];
<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//    初始化重力效果</span>
    UIGravityBehavior *gravityBehavior = [[UIGravityBehavior alloc]initWithItems:@[view]];
<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//    设置掉落方向</span>
    gravityBehavior<span class="hljs-variable" style="color: rgb(102, 0, 102); box-sizing: border-box;">.gravityDirection</span> = CGVectorMake(<span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">0</span>, <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">1</span>);
<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//    设置加速度  数值越大  碰撞效果越大</span>
    gravityBehavior<span class="hljs-variable" style="color: rgb(102, 0, 102); box-sizing: border-box;">.magnitude</span> = <span class="hljs-number" style="color: rgb(0, 102, 102); box-sizing: border-box;">1</span>;
<span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//    添加到效果器里面</span>
    [animator addBehavior:gravityBehavior];</code>