Paper Folding Animation for iOS control allows hiding of views on the left and right side of the screen by dragging the middle view. Full illustration and animated examples. This is a fully Open Source Project with Examples included. You can include it in your next or current iOS development project.
How Paper Folding Animation for iOS Works
During folding, a screen capture of the left or right view is taken, and split up depending on the number of folds required. The virtual light source is on the right side of the screen, so surfaces that faces the left are darker. For the right multi-fold view, the fold closes to the ‘force’ are opened up faster than the folds that is further away. One should read how to Create an iOS App from RSS Feed to know the minimum on how to develop an iOS App. Here are illustrations on how it actually behave :
How Paper Folding Animation for iOS : Coding Part
This project uses ARC. If you are not using ARC in your project, add ‘-fobjc-arc’ as a compiler flag for all the files in this project. Xcode 4.4 is required for auto-synthesis.
Advertisement---
Add PaperFoldView as a subview into your view controller :
1 2 | _paperFoldView = [[PaperFoldView alloc] initWithFrame:CGRectMake(0,0,100,[self.view bounds].size.height)]; [self.view addSubview:_paperFoldView]; |
To set left view, use setLeftFoldContentView:foldCount:pullFactor:. Example below uses a UITableView, but it can any UIView :
1 2 | _leftTableView = [[UITableView alloc] initWithFrame:CGRectMake(0,0,100,[self.view bounds].size.height)]; [_paperFoldView setLeftFoldContentView:_leftTableView foldCount:3 pullFactor:0.9]; |
To set the right view, use setRightFoldContentView:foldCount:pullFactor:. Example below uses a MKMapView, but it can any UIView. The fold count is the number of folds in the right view. The pull factor controls the ratio of folding/unfolding of the different folds away from the center.
1 2 | _mapView = [[MKMapView alloc] initWithFrame:CGRectMake(0,0,240,[self.view bounds].size.height)]; [_paperFoldView setRightFoldContentView:_mapView foldCount:3 pullFactor:0.9]; |
To set the center view :
1 2 | _centerTableView = [[UITableView alloc] initWithFrame:CGRectMake(0,0,[self.view bounds].size.height,[self.view bounds].size.height)]; [_paperFoldView setCenterContentView:_centerTableView]; |
To receive callbacks when fold state changes, and if the fold was activated manually by finger gesture, or automatically by calling setPaperFoldState:
1 2 3 4 5 | // register callback delegate [self.paperFoldView setDelegate:self]; // callback comes from the following delegate method - (void)paperFoldView:(id)paperFoldView didFoldAutomatically:(BOOL)automatic toState:(PaperFoldState)paperFoldState |
