UIViews Overlap after adding Gravity and Collision behaviour

Question

I am trying to stack up uiviews on click of a button. I've also added Gravity & Collision behaviour using UIKit dynamics. The problem as you can see from the image (http://pho.to/7nVJI) is, the lower most green block and the block on top of that seems to be overlapping. Here is the ViewDidLoad method : `- (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view, typically from a nib.

UIButton *moveIt = [UIButton buttonWithType:UIButtonTypeRoundedRect];
moveIt.frame = CGRectMake(200, 50, 70, 30);
[moveIt addTarget:self action:@selector(buttonClicked:) forControlEvents:UIControlEventTouchDown];
[self.view addSubview:moveIt];
moveIt.titleLabel.text = @"Hit it";
moveIt.titleLabel.textColor = [UIColor whiteColor];
moveIt.backgroundColor = [UIColor blueColor];


UIButton *addBlockButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
addBlockButton.frame = CGRectMake(20, 50, 70, 30);
[addBlockButton addTarget:self action:@selector(addBlock:) forControlEvents:UIControlEventTouchDown];
[self.view addSubview:addBlockButton];
addBlockButton.backgroundColor = [UIColor orangeColor];

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

newBlockYCoordiante = self.view.bounds.size.height-BLOCKHEIGHT;

    UIView *basicBlock = [[UIView alloc] initWithFrame:CGRectMake(64, newBlockYCoordiante, BLOCKWIDTH, BLOCKHEIGHT)];
    basicBlock.layer.borderWidth = 1;
    basicBlock.tag = 100;
    basicBlock.layer.borderColor = [UIColor greenColor].CGColor;
    basicBlock.backgroundColor = [UIColor clearColor];
    [self.view addSubview:basicBlock];
newBlockYCoordiante = newBlockYCoordiante - BLOCKHEIGHT;


    if (collisonBehaviour == nil) {
        collisonBehaviour = [[UICollisionBehavior alloc] initWithItems:@[basicBlock]];
        collisonBehaviour.translatesReferenceBoundsIntoBoundary = YES;
        collisonBehaviour.collisionDelegate = self;
        [animator addBehavior:collisonBehaviour];
    }


    if (gBehaviour == nil) {
        gBehaviour = [[UIGravityBehavior alloc] initWithItems:@[basicBlock]];
        [animator addBehavior:gBehaviour];
    }

}`

And here is how I add new blocks on top of the previous blocks :

- (void) addBlock :(id)sender
{
    UIView *basicBlock = [[UIView alloc] initWithFrame:CGRectMake(64, newBlockYCoordiante, BLOCKWIDTH, BLOCKHEIGHT)];
    basicBlock.layer.borderWidth = 1;
    basicBlock.layer.borderColor = [UIColor orangeColor].CGColor;
    basicBlock.backgroundColor = [UIColor clearColor];
    [self.view addSubview:basicBlock];
    newBlockYCoordiante = newBlockYCoordiante - BLOCKHEIGHT;

    [gBehaviour addItem:basicBlock];
    [collisonBehaviour addItem:basicBlock];
}

How do i ensure that these blocks doesn't overlap while stacking up. This overlapping causes another issue, when I add another tower similar to this next to it on right and add push behaviour to the green block to move it towards right, instead of moving only the adjacent block from the second tower it also moves the second last block from the 2nd tower. Any pointers/help is appreciated. Thanks in advance :).

Answer 1

I believe UIDynamics adds a little "give" to objects and friction so that when they collide and move they act more realistically. You may be able to reduce this, by using UIDynamicItemBehavior and reducing elasticity and bounce, but I'm not sure.

Long story short UIDynamics tends to be an imprecise system and if you're looking to animate interface items in, I'd recommend using dynamics only until items reach their desired location and then removing their behaviors and setting their exact locations :)