Quantcast
Channel: db-in's blog
Viewing all articles
Browse latest Browse all 12

Nippur Transition

$
0
0

Greetings!

It’s a great pleasure to present a new part of my work. This one is a piece of a framework intended to be used in the daily job. To make many things, make your life easier and programming faster. Today I wanna show you the NPPTransition, an API to make custom animations and transitions between UIView and/or UIViewController using pure native Objective-C (aka Obj-C).

Just by importing it you can change all the transitions (push and modal) of your application, even without writing a single line of code. Let’s talk about it.

 

At a glance

First of all, it’s an Open Source, here are the links to download it:

Download Xcode project files to iPhone
Download now
Source + Sample
1.4Mb

Download Xcode project files to iPhone
Bitbucket
Git Project

And this is the official web page: http://db-in.com/nippur/transition

What it does?

Well, I prefer to show you:

This video is from the sample code. These transitions are happening between UIViewController and UINavigationController. Every transition can be customized, there is also a global setting. Besides, any UIView can be animated to other UIView.

How it works?

The first important thing to understand is that it’s completely “iOS version free”. What exactly that means. It means it does not lie on the UIKit framework, that changes a lot from version to version (which is sucks, BTW). It completely lies on the QuartzCore and CoreGraphics frameworks, besides those frameworks are also used for desktop development (Cocoa for Mac OS). So it can easily be used for Mac OS development as well.

First, it creates a solid base that deals with the sizes and positions of the views. Then a “snapshot” of the views is taken as images, these images are used to make the animation/transition. At this point all the responsibility by the animation/transition is up to the subclasses. After the animation, the task returns to the main base that deals again of how to place, remove, show or hide the final views in its places.

By default, the NPPTransition uses a category trick to replace the normal iOS behavior, it swizzles the UINavigationController and UIViewController methods to make its magic.

There is just two steps to get it working on your project:

  1. Import the source folder “Nippur” or the “Nippur.framework” on your project (drag and drop). Also make sure the QuartzCore and CoreGraphics frameworks are within your project.
    quartz_core
  2. In project’s prefix file (.pch) write accordingly to your importing:
    nippur_importing

It’s done!
Now just build and run your project to see what happens. If you try this into an existing of your projects you’ll how different the things will goes on.

Using the NPPTransition

Despite by default it’s using a category trick to replace the transitions, you can turn this feature ON or OFF as you wish and you can do it individually just for Push or for Modal transitions. Here is how it goes:

Turning ON/OFF the category feature
// To turn ON/OFF the category feature for push transitions.
[NPPTransition definePushTransitionCategoryUsage:NO];

// To turn ON/OFF the category feature for modal transitions.
[NPPTransition defineModalTransitionCategoryUsage:YES];

As it happens automatically, you can also define some other default settings:

Playing with default settings
// To define the push transition class.
[NPPTransition definePushTransitionClass:[NPPTransitionFold class] direction:NPPDirectionDown];

// To define the modal transition class.
[NPPTransition defineModalTransitionClass:[NPPTransitionTurn class] direction:NPPDirectionUp];

// To define the default duration for all transitions.
[NPPTransition defineTransitionDuration:1.0f];

As you noticed, the transition happens inside a subclass. It’s the one responsible for custom animations and all the basic parameters still the same because the NPPTransition abstract class has defined them.

Now you may ask: “Ok, but if I turn OFF the category feature, the animations will happen automatically?”. No, in this case you should manually replace the push, pop, present or dismiss methods for the correlated ones of NPPTransition. But don’t worry, it’s very easy to find them, they start with the letters “npp”

Making UIKit transitions manually
// Instead of:
[myViewController pushViewController:otherController animated:YES];
// Use now:
[myViewController nppPushViewController:otherController animated:YES transition:nil];

// ---

// Instead of:
[myViewController presentViewController:otherController animated:YES completion:nil];
// Use now:
[myViewController nppPresentViewController:otherController animated:YES transition:nil];

// ---

// And so on...

If you set the transition as “nil” the default class for that kind of transition (push or modal) will be used in place. For example, following the two parts of codes above, our push transition will NPPTransitionFold and the modal transition will be NPPTransitionTurn.

Now, if you set a specific transition, it will be respected, regarding the specific parameters for the transition you’re asking, that means, the NPPTransition properties “fromView”, “toView” and “backward” will be ignored. Because those parameters are specific to each ViewController and its current state.

Making a specific transition
NPPTransitionFold *fold = [NPPTransitionFold transitionWithcompletion:nil];
[[self presentingViewController] nppDismissViewControllerAnimated:YES transition:fold];

As you noticed, all the NPPTransition has a completion block, that means you can get a completion notification for any kind of transition (push or modal).

And what about minor animations, like animating two objects inside a view?
It’s very easy to do as well.

Minor animations
// Creating a custom transition.
NPPTransitionCube *cube = [NPPTransitionCube transitionFromView:aViewInStage toView:aNewView completion:nil];
cube.direction = NPPDirectionDown;
cube.mode = NPPTransitionModeOverride;
[cube perform];

// Preparing it to goes back after 2 seconds.
[cube performBackwardAfterDelay:2.0f];

Conclusion

Very well my friends, that’s it. There are a lot more in the sample project. Get it by downloading the zip or copying the Git project.

If you have any doubts, just Tweet me:

See you soon!


Viewing all articles
Browse latest Browse all 12

Latest Images

Trending Articles



Latest Images