UIKit Dynamics 入門

UIKit Dynamicsフレームワークを使ってみました。
UIKit Dynamicsフレームワークは、iOS 7から導入された新しいAPIです。
これを使うと、UIViewにリアリスティックな動きをつけられます。
今回は基本的な紹介だけですが、応用するといい感じのUIが作れます。


使用するクラス

UIDynamicAnimator

役割 - 全体のコンテキストを提供 - 座標系の決定 - 物理エンジンのコントロール - ビヘイビアの把握


UIDynamicBehavior

Predefined Behaviors

UIGravityBehavior
UICollisionBehavior
UIAttachmentBehavior
UIPushBehavior
UISnapBehavior

DEMO

UIGravityBehavior

  • Sample Code

// Create view
UIView* view = [[UIView alloc] initWithFrame:CGRectZero];
view.backgroundColor = [UIColor purpleColor];
[self.view addSubview:view];
        
// Create animator
self.animator = [[UIDynamicAnimator alloc] initWithReferenceView:self.view];
    
// Create gravity behavior
self.gravity = [[UIGravityBehavior alloc] initWithItems:@[view]];;

// Add behavior
[self.animator addBehavior:self.gravity];


UICollisionBehavior + UIGravityBehavior

  • Sample Code

// Create sub views
NSMutableArray* views = [NSMutableArray array];
for (int i = 0; i < 20; i++) {
    UIView* view;
    view = [[UIView alloc] initWithFrame:CGRectZero];
    view.backgroundColor = [UIColor colorWithRed:(rand()%255)/255.0f green:(rand()%255)/255.0f blue:(rand()%255)/255.0f alpha:1.0f];
    [self.view addSubview:view];
    
    …中略…
    
    // Collect views
    [views addObject:view];
}

// Create dynamic animator
self.animator = [[UIDynamicAnimator alloc] initWithReferenceView:self.view];

// Create collision behavior
self.collision = [[UICollisionBehavior alloc] initWithItems:views];
self.collision.collisionMode = UICollisionBehaviorModeEverything;
self.collision.translatesReferenceBoundsIntoBoundary = YES;

// Create gravity behavior
self.gravity = [[UIGravityBehavior alloc] initWithItems:views];

// Add behaviors
[self.animator addBehavior:self.collision];
[self.animator addBehavior:self.gravity];


UIAttachmentBehavior + UIGravityBehavior

  • Sample Code

// Create sub view
UIView* view = [[UIView alloc] initWithFrame:CGRectZero];
view.backgroundColor = [UIColor purpleColor];
[self.view addSubview:view];

…中略...

// Create dynamic animator
self.animator = [[UIDynamicAnimator alloc] initWithReferenceView:self.view];

// Create attachment behavior
self.attachment = [[UIAttachmentBehavior alloc] initWithItem:view attachedToAnchor:self.view.center];
self.attachment.damping = 0.1f;

// Create gravity behavior
self.gravity = [[UIGravityBehavior alloc] initWithItems:@[view]];

// Add behaviors
[self.animator addBehavior:self.attachment];
[self.animator addBehavior:self.gravity];


UIPushBehavior + UICollisionBehavior + UIGravityBehavior

  • Sample Code

NSMutableArray* views = [NSMutableArray array];
for (int i = 0; i < 20; i++) {
    // Create sub views
    UIView* view;
    view = [[UIView alloc] initWithFrame:CGRectZero];
    view.backgroundColor = [UIColor colorWithRed:(rand()%255)/255.0f green:(rand()%255)/255.0f blue:(rand()%255)/255.0f alpha:1.0f];
    [self.view addSubview:view];
    
    …中略...
    
    // Collect views
    [views addObject:view];
}

// Create dynamic animator
self.animator = [[UIDynamicAnimator alloc] initWithReferenceView:self.view];

// Create push behavior
self.pushBehavior = [[UIPushBehavior alloc] initWithItems:views mode:UIPushBehaviorModeInstantaneous];
self.pushBehavior.magnitude = 0.1f;
self.pushBehavior.pushDirection = CGVectorMake(0, -0.1);

// Create collision behavior
self.collistion = [[UICollisionBehavior alloc] initWithItems:views];
self.collistion.collisionMode = UICollisionBehaviorModeEverything;
self.collistion.translatesReferenceBoundsIntoBoundary = YES;

// Create gravity behavior
self.gravity = [[UIGravityBehavior alloc] initWithItems:views];

// Add behaviors
[self.animator addBehavior:self.collistion];
[self.animator addBehavior:self.pushBehavior];
[self.animator addBehavior:self.gravity];

UISnapBehavior

  • Sample Code

// Create sub view
UIView* view = [[UIView alloc] initWithFrame:CGRectZero];
view.backgroundColor = [UIColor greenColor];
[self.view addSubview:view];

…中略...

// Create dynamic animator
self.animator = [[UIDynamicAnimator alloc] initWithReferenceView:self.view];

// Create snap behavior
self.snap = [[UISnapBehavior alloc] initWithItem:view snapToPoint:self.view.center];
self.snap.damping = 0.1f;

// Add behaviors
[self.animator addBehavior:self.snap];


参考URL
Getting Started with UIKit Dynamics
DynamicsCatalog