Skip to content

Instantly share code, notes, and snippets.

@mnmaraes
Created March 13, 2014 20:30
Show Gist options
  • Save mnmaraes/9536364 to your computer and use it in GitHub Desktop.
Save mnmaraes/9536364 to your computer and use it in GitHub Desktop.
This Gist Emulates a standard app intro view. The images "sea" and "fire" are because of the transition between a red and blue background. Use your own image (anyone will do, really).
//
// TUIIntroPageViewController.m
// TestUIs
//
// Created by Murillo Nicacio de Maraes on 3/13/14.
// Copyright (c) 2014 m-one. All rights reserved.
//
#import "TUIIntroPageViewController.h"
@interface TUIIntroPageViewController () <UIScrollViewDelegate>
#pragma mark - First Page Views
@property (nonatomic) UIImageView *firstPageBackgroundImageView;
@property (nonatomic) UIView *firstPageInfoView;
#pragma mark - Second Page Views
@property (nonatomic) UIImageView *secondPageBackgroundImageView;
@property (nonatomic) UIView *secondPageInfoView;
@end
@implementation TUIIntroPageViewController
-(void)viewDidLoad
{
[super viewDidLoad];
[self viewSetUp];
}
-(void)viewSetUp
{
UIScrollView *containerScrollView = [self newContainerScrollView];
[containerScrollView addSubview:self.firstPageInfoView];
[containerScrollView addSubview:self.secondPageInfoView];
[self.view addSubview:self.firstPageBackgroundImageView];
[self.view addSubview:self.secondPageBackgroundImageView];
[self.view addSubview:containerScrollView];
}
#pragma mark - UIScrollViewDelegate
-(void)scrollViewDidScroll:(UIScrollView *)scrollView
{
CGFloat deltaX = scrollView.contentOffset.x / CGRectGetWidth(self.view.frame);
self.firstPageBackgroundImageView.alpha = 1.0 - deltaX;
self.secondPageBackgroundImageView.alpha = deltaX;
self.firstPageInfoView.transform = CGAffineTransformMakeScale(1.0 * (1.0 - deltaX), 1.0 * (1.0 - deltaX));
self.secondPageInfoView.transform = CGAffineTransformMakeScale(1.0 * deltaX, 1.0 * deltaX);
}
#pragma mark - Accessors
-(UIImageView *)firstPageBackgroundImageView
{
if (!_firstPageBackgroundImageView) {
_firstPageBackgroundImageView = [[UIImageView alloc] initWithFrame:self.view.frame];
_firstPageBackgroundImageView.image = [UIImage imageNamed:@"sea"];
_firstPageBackgroundImageView.alpha = 1.0; // For clarity and comparison purposes
}
return _firstPageBackgroundImageView;
}
-(UIView *)firstPageInfoView
{
if (!_firstPageInfoView) {
_firstPageInfoView = [UIView new];
_firstPageInfoView.bounds = CGRectMake(0.0, 0.0, 240., 240.);
_firstPageInfoView.center = self.view.center;
UILabel *label = [UILabel new];
label.bounds = CGRectMake(0.0, 0.0, 240., 66.);
label.center = CGPointMake(120., 180.);
label.numberOfLines = 0;
label.text = @"This is the first view of the sequence, pan it and watch it do something cool";
label.textAlignment = NSTextAlignmentCenter;
label.textColor = [UIColor redColor];
label.font = [UIFont preferredFontForTextStyle:UIFontTextStyleBody];
UIView *view = [UIView new];
view.bounds = CGRectMake(0.0, 0.0, 120., 120.);
view.center = CGPointMake(120., 60.);
view.layer.cornerRadius = 60.;
view.layer.borderWidth = 10.;
view.layer.borderColor = [[UIColor redColor] CGColor];
[_firstPageInfoView addSubview:view];
[_firstPageInfoView addSubview:label];
}
return _firstPageInfoView;
}
-(UIImageView *)secondPageBackgroundImageView
{
if (!_secondPageBackgroundImageView) {
_secondPageBackgroundImageView = [[UIImageView alloc] initWithFrame:self.view.frame];
_secondPageBackgroundImageView.image = [UIImage imageNamed:@"fire"];
_secondPageBackgroundImageView.alpha = 0.0;
}
return _secondPageBackgroundImageView;
}
-(UIView *)secondPageInfoView
{
if (!_secondPageInfoView) {
_secondPageInfoView = [UIView new];
_secondPageInfoView.bounds = CGRectMake(0.0, 0.0, 240., 240.);
_secondPageInfoView.center = CGPointMake(self.view.center.x + CGRectGetWidth(self.view.frame), self.view.center.y);
UILabel *label = [UILabel new];
label.bounds = CGRectMake(0.0, 0.0, 240., 66.);
label.center = CGPointMake(120., 180.);
label.numberOfLines = 0;
label.text = @"This is the second view of the sequence, pan it and watch it do something cool";
label.textAlignment = NSTextAlignmentCenter;
label.textColor = [UIColor blueColor];
label.font = [UIFont preferredFontForTextStyle:UIFontTextStyleBody];
UIView *view = [UIView new];
view.bounds = CGRectMake(0.0, 0.0, 120., 10.);
view.center = CGPointMake(120., 60.);
view.transform = CGAffineTransformMakeRotation(M_PI_4);
view.backgroundColor = [UIColor blueColor];
[_secondPageInfoView addSubview:view];
view = [UIView new];
view.bounds = CGRectMake(0.0, 0.0, 120., 10.);
view.center = CGPointMake(120., 60.);
view.transform = CGAffineTransformMakeRotation(-M_PI_4);
view.backgroundColor = [UIColor blueColor];
[_secondPageInfoView addSubview:view];
[_secondPageInfoView addSubview:label];
}
return _secondPageInfoView;
}
#pragma mark - View Creation
-(UIScrollView *)newContainerScrollView
{
UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:self.view.frame];;
scrollView.contentSize = CGSizeMake(2*CGRectGetWidth(self.view.frame), CGRectGetHeight(self.view.frame));
scrollView.showsHorizontalScrollIndicator = NO;
scrollView.bounces = NO;
scrollView.pagingEnabled = YES;
scrollView.delegate = self;
return scrollView;
}
@end
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment