Native Transitions (Curl,Fade,Flip)Plugin for iOS Phonegap

As we all know now the time is for cross platform app and when we are talking about the cross platform the first name come is PhoneGap.It is a most used Framework in Days.there are more 3328 Registered Developers are using it and real no are more and more.But the one of the Disadvantage of Phone Gap is its slow. so we use the native Transition for change page rather using jQuery.

Recommended Reading: Iphone Weekly Local Notification Reminder : Plugin Phonegap

What is transitions?

We can enhance our application presentation’s appeal by adding visual effects that occur when move page from one page to another.here I have demonstrate 3 Transitions effect in Phonegap using iPhone native code using plugin.

Phonegap transitions Plugin Video Demo

So for integrate this Plugin in your app follow this bellow stes(Note your app should contain version>3.0)

Step 1: open CLI cmd promt and enter the below command.

$ cordova plugin add https://github.com/mayurloved/native-ios-transitions.git

OR
phonegap plugin add https://github.com/mayurloved/native-ios-transitions.git

Step 2: Now after that you have to add the Mytransition.js file in your index.html other all the things with be manage by the plugin.

<script type="text/javascript" src="js/Mytransition.js">

there are lots of effect are the below are the list

Flip

var duration = 0.6, // animation time in seconds
direction = "right"; // animation direction - left || right
nativetransitions.flip(duration, direction, onComplete);

Curl

var duration = 0.6, // animation time in seconds
direction = "down"; // animation direction - up || down
nativetransitions.curl(duration, direction, onComplete);

Fade

var duration = 0.6 // animation time in seconds
nativetransitions.fade(duration, onComplete);

For download full working source code with demo like us on Facebook and download free
[to_like]

[/to_like]

The post Native Transitions (Curl,Fade,Flip)Plugin for iOS Phonegap appeared first on Excellent Web World.