SkillAgentSearch skills...

RNSwipeViewController

Swipe in view controllers from off-screen similar to Check the Weather.

Install / Use

/learn @rnystrom/RNSwipeViewController
About this skill

Quality Score

0/100

Supported Platforms

Universal

README

RNSwipeViewController

Seemlessly integrate beautifully functional view controllers into your app that are accessible with just the swipe of a finger. Inspiration for this project came from David Smith and his gorgeous app Check The Weather.

iPad support added along with example on 11/8/12.

View the Docs

Check out the Demo Excuse the graphics glitches.

Installation

Drag the included <code>RNSwipeViewController</code> folder into your project. Then, include the following frameworks under Link Binary With Libraries:

  • QuartzCore.framework

That's it.

Usage

In the provided example, I have a swipe controller setup via Storyboards. However, you should be able to create your controllers with NIBs or plain code. Using the swipe controller is similar to using a <code>UINavigationController</code> in that RNSwipeViewController is a container of child view controllers. All interaction logic is controlled with the swipe controller. All of your app's logic should be contained in your child view controllers.

I would also recommend subclassing RNSwipeViewController like I've done in the example. However, you shouldn't have to.

Create view controllers as you deem necessary and assign them to the swipe controller's respective sides. RNSwipeViewController will handle enabling/disabling of gestures for you.

self.centerViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"centerViewController"];
self.leftViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"leftViewController"];
self.rightViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"rightViewController"];
self.bottomViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"bottomViewController"];

With minimal effort, your views are now setup.

Setup in Code

If you want to avoid Storyboards (I don't blame you), you can setup everything in code. Here is an example from the AppDelegate of a app of mine.

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {    
    // PTMasterController is a subclass of RNSwipeViewController
    PTMasterController *masterController = [[PTMasterController alloc] init];
 
    PTSchemeController *scheme = [[PTSchemeController alloc] init];
    PTUtilityController *utility = [[PTUtilityController alloc] init];
    PTWritingController *writing = [[PTWritingController alloc] init];
    
    masterController.centerViewController = writing;
    masterController.rightViewController = utility;
    masterController.leftViewController = scheme;
    
    masterController.leftVisibleWidth = kGridSize + 3 * kPadding;
    masterController.rightVisibleWidth = kGridSize * 2 + 3 * kPadding;
    
    self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
 
    self.window.rootViewController = masterController;
 
    self.window.backgroundColor = [UIColor underPageBackgroundColor];
    [self.window makeKeyAndVisible];
    
    return YES;
}

Performance

Expect decent performance on the iPhone 4 or later. However on newer devices (4S+) you should expect 60fps.

Config

<img src="https://github.com/rnystrom/RNSwipeViewController/blob/master/images/dimensions.jpg?raw=true" /> <img src="https://github.com/rnystrom/RNSwipeViewController/blob/master/images/landscape.jpg?raw=true" />

You can customize the width of each view controller's panel at run-time. Make sure the views in your view controllers are prepared to be smaller than your device's width/height.

@property (assign, nonatomic) CGFloat leftVisibleWidth;     // default 200
@property (assign, nonatomic) CGFloat rightVisibleWidth;    // default 200
@property (assign, nonatomic) CGFloat bottomVisibleHeight;  // default 300

Categories (optional)

You can also include the helpful UIViewController+RNSwipeViewController category to make finding and using the swipe controller easier. Just import the .h/.m files into your controller and call the <code>swipeController</code> property.

@implementation YourViewController

- (IBAction)toggleLeft:(id)sender {
    [self.swipeController showRight];
}

@end

Delegation, Notification, and KVO

I've included some helpers in case you need to know when and what view controllers are showing (or hiding). Take a look at the documentation for help with the delegate. Below I've listed the available <code>NSNotificationCenter</code> keys.

NSString * const RNSwipeViewControllerLeftWillAppear;
NSString * const RNSwipeViewControllerLeftDidAppear;
NSString * const RNSwipeViewControllerRightWillAppear;
NSString * const RNSwipeViewControllerRightDidAppear;
NSString * const RNSwipeViewControllerBottomWillAppear;
NSString * const RNSwipeViewControllerBottomDidAppear;
NSString * const RNSwipeViewControllerCenterWillAppear;
NSString * const RNSwipeViewControllerCenterDidAppear;

The only real KVO-purposed property in here is <code>isToggled</code>. If there is a need for more options I'll add them.

Percent Protocol

New Feature

Your left, right, and bottom view controllers can optionally conform to the <code>RNRevealViewControllerProtocol</code> protocol in order to receive updates on how far the view controller is presented. The percent is an integer 0 to 100. The only method this protocol uses is:

- (void)changedPercentReveal:(NSInteger)percent;

The example updates views in the left and right controller.

Status

If you're interested in what your swipe controller looks like presently, you can ask the <code>visibleState</code> property what is showing. The possibilities are

RNSwipeVisibleLeft
RNSwipeVisibleCenter
RNSwipeVisibleRight
RNSwipeVisibleBottom

Or, if you need to access the presented view controller directly, you can do so.

UIViewController *visibleController = self.swipeController.visibleController;

Apps

If you've used this project in a live app, please <a href="mailTo:rnystrom@whoisryannystrom.com">let me know</a>! Nothing makes me happier than seeing someone else take my work and go wild with it.

Contact

  • @nystrorm on Twitter
  • @rnystrom on Github
  • <a href="mailTo:rnystrom@whoisryannystrom.com">rnystrom [at] whoisryannystrom [dot] com</a>

License

See LICENSE

View on GitHub
GitHub Stars292
CategoryDevelopment
Updated7mo ago
Forks47

Languages

Objective-C

Security Score

87/100

Audited on Aug 8, 2025

No findings