Jelly provides custom view controller transitions with just a few lines of code. No need to create your own Presentation-Controller or Animator objects. A Jelly-Animator will do the heavy lifting for you.
You can use Jelly to build your own Alertviews or Slidein-Menus using ViewControllers designed by yourself.
To run the example project, clone the repo, and run pod install
from the Example directory first.
Jelly is super easy to use.
- Create a JellyPresentation Object (SlideIn, FadeIn or ShiftIn)
- Initialize a JellyAnimator using the JellyPresentation Object created in Step 1.
- Call the prepare(viewController:UIViewController) Function
- Finally call the native UIViewController presentation function.
override func viewDidLoad() {
super.viewDidLoad()
let viewController = self.storyboard.instantiateViewController(withIdentifier: "someViewController")
//1.
let presentation = JellySlideInPresentation()
//2.
self.jellyAnimator = JellyAnimator(presentation:presentation)
//3.
self.jellyAnimator?.prepare(viewController: viewController)
//4.
self.present(viewController, animated: true, completion: nil)
}
DO NOT FORGET TO KEEP A STRONG ๐ช REFERENCE
Because the transitioningDelegate of a UIViewController is weak, you need to hold a strong reference to the JellyAnimator inside the UIViewController you are presenting from or the central object that maintains your presentations.
class CustomVC : UIViewController {
var jellyAnimator: JellyAnimator?
override func viewDidLoad() {
super.viewDidLoad()
var shiftInPresentation = JellyShiftInPresentation()
shiftInPresentation.direction = .left
let animator = JellyAnnimator(presentation:presentation)
self.jellyAnimator = animator
}
}
That's it. That's lit.
Jelly offers 3 types of Presentations for you:
- JellySlideInPresentation
- JellyShiftInPresentation
- JellyFadeInPresentation
Not every property is available for each animation. Check out the interfaces of each class to learn more about them.
- duration: JellyConstants.Duration (default: normal)
- ultraSlow = 2.0
- slow = 1.0
- medium = 0.5
- normal = 0.35
- fast = 0.2
- reallyFast = 0.1
- backgroundStyle: JellyConstants.BackgroundStyle (default: .dimmed(0.5))
- dimmed(alpha: CGFloat)
- blur(effectStyle: UIBlurEffectStyle)
- if you want a transparent background use .dimmed(alpha:0.0)
- cornerRadius: Double (default: 0)
- corners: UIRectCorner (default: .allCorners)
- define which corners the radius should be applied to
- presentationCurve: JellyConstants.JellyCurve (default: linear)
- easeIn
- easeOut
- easeInEaseOut
- linear
- dismissCurve: JellyConstants.JellyCurve (default: linear)
- easeIn
- easeOut
- easeInEaseOut ย ย * linear
- isTapBackgroundToDismissEnabled (default: true)
- tapping the background dismisses the ViewController by default
- set it to false to prevent this behavior
- widthForViewController: JellyConstants.Size (default: fullscreen)
- If the container is smaller than the provided width, Jelly will automatically resize to the containers width
- if Margin Guards are specified they also will be applied if width is to wide for the container
- heightForViewController: JellyConstants.Size (default: fullscreen)
- If the container is smaller than the provided height, Jelly will automatically resize to the containers width
- if Margin Guards are specified they also will be applied when height is to high for the container
- horizontalAlignment: JellyConstants.HorizontalAlignment (default: .center)
- center, left or right
- verticalAlignemt: JellyConstants.VerticalAlignment (default:center)
- top, bottom, center
- marginGuards: default(UIEdgeInsets.zero)
- If the width or height is bigger than the container we are working with, marginGuards will kick in and limit the size using the specified margins
- directionShow: JellyConstants.Direction (default: top)
- left, top, bottom, right
- directionDismiss: JellyConstants.Direction (default: top)
- left, top, bottom, right
- jellyness: (default: none)
- none (damping = 1.0, velocity = 0.0)
- jelly (damping = 0.7, velocity = 2)
- jellier (damping = 0.5 , velocity = 3)
- jelliest (damping = 0.2, velocity = 4)
let customPresentation = JellySlideInPresentation(dismissCurve: .linear,
presentationCurve: .linear,
cornerRadius: 15,
backgroundStyle: .blur(effectStyle: .light),
jellyness: .jellier,
duration: .normal,
directionShow: .top,
directionDismiss: .top,
widthForViewController: .fullscreen,
heightForViewController: .custom(value:200) ,
horizontalAlignment: .center,
verticalAlignment: .top,
marginGuards: UIEdgeInsets(top: 0, left: 10, bottom: 0, right: 10),
corners: [.topLeft,.bottomRight])
self.jellyAnimator = JellyAnimator(presentation:customPresentation)
self.jellyAnimator?.prepare(viewController: viewController)
self.present(viewController, animated: true, completion: nil)
Deployment target of your App is >= iOS 8.0
Jelly is available through CocoaPods. To install it, simply add the following line to your Podfile:
pod "Jelly"
- Mentioned in iOS Dev Weekly by @Dave Verwer - Issue NO. 112
- Mentioned in This Week in Swift by @Natasha the Robot - Issue No. 279
Sebastian Boldt, [email protected]
Jelly is available under the MIT license. See the LICENSE file for more info.