nunestransform/mdcparallaxview

Create a parallax effect using a custom container view, much like the top view of Path's timeline.

MDCParallaxView

Create a parallax effect using a custom container view, much like the top view of Path's timeline.

Sample

Sample usage is available in the SampleApp. Here's the gist:

- (void)viewDidLoad {
    [super viewDidLoad];

    // Create backgroud image view.
    UIImage *backgroundImage = [UIImage imageNamed:@"background.png"];
    CGRect backgroundRect = CGRectMake(0, 0, CGRectGetWidth(self.view.frame), backgroundImage.size.height);
    UIImageView *backgroundImageView = [[UIImageView alloc] initWithFrame:backgroundRect];
    backgroundImageView.image = backgroundImage;
    backgroundImageView.contentMode = UIViewContentModeScaleAspectFill;

    // Create foreground view.
    CGRect foregroundRect = CGRectMake(0, 0, CGRectGetWidth(self.view.frame), 400.0f);
    UIView *foregroundView = [[UIView alloc] initWithFrame:foregroundRect];

    // Create parallax view with background and foreground views.
    // You can see additional configuration options in the SampleApp.
    MDCParallaxView *parallaxView = [[MDCParallaxView alloc] initWithBackgroundView:backgroundImageView
                                                                     foregroundView:foregroundView];
    parallaxView.frame = self.view.bounds;
    parallaxView.backgroundHeight = 250.0f;
    parallaxView.scrollView.scrollsToTop = YES;
    [self.view addSubview:parallaxView];
}

Acknowledgements

The content offset updates are based on those found in PXParallaxViewController. While that project uses a custom UIViewController, this one uses a custom UIView, which I believe provides a better API.