Move UIViews to avoid collision like rearranging icons on Springboard

Question

Hey,

how would one replicate the effect on the iPhone when you rearrange app icons? It would need to avoid collisions and rearrange the UIViews while snapped to a grid.

Answer 1

Check out the MoveMe sample project in the SDK to see a basic example of dragging and animation.

You'll have to implement the logic yourself to figure out where to move the icons based on the geometry of your grid and the progress of the drag operation. Once you know where the icons need to go, animating the views only requires a few lines of code. You'll want to do something like this:

CGRect newFrame = iconView.frame;
[UIView beginAnimations:@"SnapToGrid" context:nil];
newFrame.origin = newOriginSnappedToGrid;
iconView.frame = newFrame;
[UIView commitAnimations];

Read the sub-section titled, "Animating Views" under "Window and Views" in the iPhone Application Programming Guide. Then check out the methods in the UIView class reference under the heading, "Animating Views".

Answer 2

I've written some sample code to do something like this. See my Tiles blog entry, or just download the code: Tiles-v1.0.zip