Pages

Adding Collision Behavior && Gravity Behavior to UI contents

As you guys know Collision && Gravity are both terms of Physics. But with the Apple's new technology UI Dynamics you can add these behaviors to your UI components like Buttons, Labels, or even to the views etc. Apple divided different actions related to animations into different behavior classes. And these behavior classes works with animators , means you can attach different behavior to an animator. For example, you added gravity behavior to the Label so that it will fall from the point you specified to all the way to the bottom && when it reaches to the boundary it will out of the screen && you will not be able to see it. So if you want that label to stop being disappear you will add the collision behavior to the label && define a boundary so that after colliding to it label will not disappear && will stay on the screen.

Different classes that provides different behavior: 
a.)UICollisionBehavior
b.)UIGravityBehavior
c.)UIPushBehavior
d.)UISnapBehavior


Keep in mind that corresponding to dynamic behavior you need an animator of type UIDynamicAnimator && it uses reference view's coordinate system to calculate output of different behavior. Lets have an example in which we add Gravity Behavior to our UI Components, in which we will have two rectangle type Labels, when we run our app they will start falling from top to bottom && at the very bottom we will add a boundary so that you will they will not cross the view's boundary. Add the below written code to your ViewController.Swift file...

class ViewController: UIViewController {
          //array of labels
    var squareLabel = [UILabel]()
          //instantiating an object of dynamic animator
    var usingAnimator: UIDynamicAnimator?

override func viewDidAppear(animated: Bool) {
        super.viewDidAppear(animated)
                        //immutable array of colors
        let colors = [UIColor.yellowColor(), UIColor.purpleColor()]
                        //variables represents x&y coordinate
        var x: CGFloat = 120
        var y: CGFloat = 30
                //adding the views for two labels
        for counter in 0..<2 {
            let newView = UILabel(frame: CGRect(x: x, y: y, width: 70, height: 50))
            newView.backgroundColor = colors[counter]
            squareLabel.append(newView)
            view.addSubview(newView)
            x=x+50
            y=y+80
        }
                //object of type animator getting reference of ViewController
        usingAnimator = UIDynamicAnimator(referenceView: self.view)
                //adding the gravity behavior to the labels
      let gravity = UIGravityBehavior(items: squareLabel)
      usingAnimator?.addBehavior(gravity)
                //adding the collision behavior
      let usingCollisionBehaviour = UICollisionBehavior(items: squareLabel)
      usingCollisionBehaviour.translatesReferenceBoundsIntoBoundary = true
      usingAnimator?.addBehavior(usingCollisionBehaviour)
}

Let me explain this code a bit....
Outside the viewDidAppear() function all we did is instantiate two objects one is array of type labels && second is an object of type UIDynamicAnimator that is getting the reference of current view for calculating the output of different behavior which is done by line:
    "usingAnimator = UIDynamicAnimator(referenceView: self.view)"
After then we are adding the gravity behavior to both of the labels so that they will fall from the top all the way to bottom. Then we are defining the boundary as the boundary of the view so that these label will not cross the view by setting the property "translatesReferenceBoundsIntoBoundary" to true,  here is the line of code that is doing it...
          "usingCollisionBehaviour.translatesReferenceBoundsIntoBoundary = true"

Here is the output of this code.....

As you can see in the output of the simulator that two label are falling from the top freely && after they collide with the boundary they will not disappear.
I hope this tutorial was a good use for you...