How could I create two UIViews and have a swipe gesture to mask one over the other?

Question

So I am trying to mask a UIView over another one which will ideally appear once the swipe gesture has happened. There are a lot of libraries / example code out there I have come across that allow you to slide in a UIView which would appear on top, but it should really be masking over the first view, rather than simply overlaying it. There is most likely a simple elegant solution for this, but so far there is very little I have seen that supports this kind of animation. Image below helps describe the ideal solution:

Answer 1

Gist time: https://gist.github.com/mnmaraes/9529586

The magic happens at:

-(void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    CGFloat xDelta = scrollView.contentOffset.x;

    self.topView.center = CGPointMake(self.topCenterInitialX + xDelta, self.topView.center.y);
}

So to explain better. You have a bottomView and a topView which are exactly the same, except the colors are switched. The topView is contained in a clipperView which is inside a UIScrollView (To handle panning and swiping). So when you scroll right/left the topView moves the opposite direction giving the impression that it is stationary, the excess is then clipped by clipperView. Anyways, it's all there. Let me know if you don't understand something.

Have fun!