Coder Social home page Coder Social logo

presentr's Introduction

Version Platform License codebeat badge

Presentr is a simple wrapper for the Custom View Controller Presentation API introduced in iOS 8.

About

It is very common in an app to want to modally present a view on top of the current screen without covering it completely. It can be for presenting an alert, a menu, or any kind of popup with some other functionality.

Before iOS 8 this was done by adding a subiew on top of your content, but that is not the recommended way since a modal should ideally have its own view controller for handling all of the logic. View controller containment was also used, and was a better alternative, but still not ideal for this use case.

iOS 8 fixed all of this by introducing Custom View Controller Presentations, which allowed us to modally present view controllers in new ways. But in order to use this API it is up to us to implement a couple of classes and delegates that could be confusing for some.

Presentr is made to simplify this process by hiding all of that and providing a couple of custom presentations and transitions that I think you will find useful. If you want to contribute and add more presentations or transitions please send me a pull request!

Installation

use_frameworks!

pod 'Presentr'

Manually

  1. Download and drop /Presentr folder in your project.
  2. Congratulations!

Usage

Main Types

Presentation Type

public enum PresentationType {
  case Alert
  case Popup
  case TopHalf
  case BottomHalf
  case Custom(width: ModalSize, height: ModalSize, center: ModalCenterPosition)
}
Alert & Popup

##### BottomHalf & TopHalf

Transition Type

public enum TransitionType{
  // System provided
  case CoverVertical
  case CrossDissolve
  case FlipHorizontal
  // Custom
  case CoverVerticalFromTop
  case CoverHorizontalFromRight
  case CoverHorizontalFromLeft
}

Getting Started

Create a Presentr object

It is important to hold on to the Presentr object as a property on the presenting/current View Controller since internally it will be used as a delegate for the custom presentation, so you must hold a strong reference to it.

class ViewController: UIViewController{

  let presenter: Presentr = {
      let presenter = Presentr(presentationType: .Alert)
      presenter.transitionType = .CoverHorizontalFromRight // Optional
      return presenter
  }()

}

Both types can be changed later on in order to reuse the Presentr object for other presentations.

presenter.presentationType = .Popup
presenter.transitionType = .CoverVerticalFromTop

Now you can also choose to disable rounded corners on the view controller that will be presented. Default is true except for .TopHalf and .BottomHalf presentation types.

presenter.roundCorners = false

Present the view controller.

Instantiate the View Controller you want to present. Remember to setup autolayout on it so it can be displayed well on any size.

let controller = SomeViewController()
customPresentViewController(presenter, viewController: controller, animated: true, completion: nil)

This is a helper method provided for you as an extension on UIViewController. It handles setting the Presentr object as the delegate for the presentation & transition.

Creating a custom PresentationType

If you need to present a controller in a way that is not handled by the 4 included presentation types you can create your own. You create a custom PresentationType using the .Custom case on the PresentationType enum.

let customType = PresentationType.Custom(width: width, height: height, center: center)

It has three associated values for the width, height and center position of the presented controller. For setting them we use two other enums.

// This is used to calculate either a width or height value.
public enum ModalSize {
  case Default
  case Half   
  case Full      
  case Custom(size: Float)
}

// This is used to calculate the center point position for the modal.
public enum ModalCenterPosition {
  case Center     
  case TopCenter  
  case BottomCenter
  case Custom(centerPoint: CGPoint)  // Custom fixed center point.
  case CustomOrigin(origin: CGPoint) // Custom fixed origin point.
}

This allows us to use a fixed value when we want

let width = ModalSize.Custom(size: 300) // Custom 300pt width

But also let Presentr handle the calculations when we want something more common.

let height = ModalSize.Full // Whole screen height

We could also set a fixed position

let position = ModalCenterPosition.Custom(centerPoint: CGPoint(x: 150, y: 150))  // Custom center point

Or let presentr calculate the position

let position = ModalCenterPosition.Center // Center of the screen

So we can mix and match, and have the benefit of a custom PresentationType but still have Presentr calculating the values we don't want to do ourselves. The following code creates a Presentr object with a custom PresentationType which shows the alert in a small top banner.

class ViewController: UIViewController{

  let customPresenter: Presentr = {
  
    let width = ModalSize.Full
    let height = ModalSize.Custom(size: 150)
    let center = ModalCenterPosition.CustomOrigin(origin: CGPoint(x: 0, y: 0))

    let customType = PresentationType.Custom(width: width, height: height, center: center)

    let customPresenter = Presentr(presentationType: customType)
    customPresenter.transitionType = .CoverVerticalFromTop
    customPresenter.roundCorners = false
    return customPresenter
    
  }()

}

Presentr also comes with a cool AlertViewController baked in if you want something different from Apple's. The API is very similar to Apple's alert controller.

  let title = "Are you sure?"
  let body = "There is no way to go back after you do this!"
  
  let controller = Presentr.alertViewController(title: title, body: body)
  
  let deleteAction = AlertAction(title: "Sure ๐Ÿ•ถ", style: .Destructive) {
    print("Deleted!")
  }
  
  let okAction = AlertAction(title: "NO, sorry ๐Ÿ™„", style: .Cancel){
    print("Ok!")
  }
  
  controller.addAction(deleteAction)
  controller.addAction(okAction)
  
  presenter.presentationType = .Alert
  customPresentViewController(presenter, viewController: controller, animated: true, completion: nil)

Requirements

  • Xcode 7.3+
  • iOS 8.0+
  • Swift 2.2+

Documentation

Read the docs. Generated with jazzy.

To Do

  • Add more presentation types
  • Add more transition types (animations)
  • Add other baked in View Controller's for common uses (like the AlertViewController)
  • Add Testing

Author

Daniel Lozano
iOS Developer @ Icalia Labs

Logo design by Eduardo Higareda
Alert design by Noe Araujo

License

Presentr is released under the MIT license.
See LICENSE for details.

presentr's People

Contributors

danlozano avatar benaneesh avatar jyounus avatar lfarah avatar readmecritic avatar

Watchers

James Cloos 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.