Giter Site home page Giter Site logo

rnswipeviewcontroller's Introduction

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.

Check out the Demo Excuse the graphics glitches.

Installation

Drag the included RNSwipeViewController 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 UINavigationController 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

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 swipeController 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 NSNotificationCenter 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 isToggled. 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 RNRevealViewControllerProtocol 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 visibleState 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 let me know! Nothing makes me happier than seeing someone else take my work and go wild with it.

Contact

License

See LICENSE

rnswipeviewcontroller's People

Contributors

dcritelli avatar rnystrom avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.