IT tutorials
 
Mobile
 

iPhone Programming : Other Native Platforms - PhoneGap

2/14/2013 6:02:51 PM
- How To Install Windows Server 2012 On VirtualBox
- How To Bypass Torrent Connection Blocking By Your ISP
- How To Install Actual Facebook App On Kindle Fire

PhoneGap, developed by Nitobi, is an open source development platform for building cross-platform mobile applications with JavaScript.

On the iPhone, it works by providing a prebuilt library containing Objective-C classes that wrap the iPhone’s native capabilities (e.g., vibration and accelerometer support) and exposes these capabilities to JavaScript along with an Xcode project template that makes use of the library. You can then compile your application as a hybrid of native Objective-C and JavaScript inside Xcode.

The platform is device-agnostic, allowing you to build an application for the iPhone, Android, and BlackBerry devices simultaneously. Developing applications using the PhoneGap framework is a reasonable alternative to building all-native applications in Objective-C.

In the past, submitting to the App Store applications built around the PhoneGap platform was problematic. However, since the 0.8.0 release, this has been resolved and Apple has approved PhoneGap for building applications intended for the store.


Note:

Since the 0.8.0 release, the PhoneGap platform has embedded a version tag into the compiled iPhone application bundle to allow Apple to identify the version used in your application build during the application review process.


If you’re a web developer who wants to build mobile applications in HTML and JavaScript while still taking advantage of the hardware features on the iPhone, Android, and BlackBerry devices, you may want to take a look at the PhoneGap platform.


Note:

If you’re interested in developing native iPhone applications using HTML and JavaScript, at least two alternatives to PhoneGap are now available: Appcelerator and Rhomobile. However, anecdotally at least, PhoneGap is the most well known of the three platforms.


1. Download and Installation

The easiest way to make use of the PhoneGap platform on the iPhone is to build the PhoneGapLib static library for iPhone. This will allow you to create PhoneGap-based iPhone application projects directly using an Xcode project template file.

You can download the latest version of the PhoneGap code, which includes PhoneGapLib, either from the project’s Git repository or from the main PhoneGap website. If you’re downloading the code from the project website, you should download version 0.8.2 or later, as earlier versions do not include the PhoneGapLib library.


Warning:

The PhoneGap platform, and especially the PhoneGapLib library, is under active development and installation instructions are therefore subject to change.


After downloading the source, open a terminal window, navigate to the source directory, and type make to build the PhoneGap platform. You should see something very much like the following scroll by in your terminal window:

$ cd Downloads/phonegap-phonegap-27e998e/
$ ls
total 48
drwxr-xr-x  13 aa  staff   442 16 Nov 18:03 ./
drwx------+ 10 aa  staff   340 18 Nov 15:27 ../
-rwxr-xr-x@  1 aa  staff   132 16 Nov 18:03 .gitignore*
-rwxr-xr-x@  1 aa  staff  3743 16 Nov 18:03 README.md*
-rwxr-xr-x@  1 aa  staff  2742 16 Nov 18:03 Rakefile*
drwxr-xr-x@ 12 aa  staff   408 16 Nov 18:03 android/
drwxr-xr-x@ 10 aa  staff   340 16 Nov 18:03 blackberry/
-rwxr-xr-x@  1 aa  staff  2795 16 Nov 18:03 configure*
drwxr-xr-x@  7 aa  staff   238 16 Nov 18:03 iphone/
drwxr-xr-x@ 25 aa  staff   850 16 Nov 18:03 javascripts/
drwxr-xr-x@  4 aa  staff   136 16 Nov 18:03 util/
drwxr-xr-x@ 11 aa  staff   374 16 Nov 18:03 winmo/
$ cd iphone
$ make
  .
  .
  .
$

If everything looks OK at this point, you can close the terminal window. Now open the Finder and navigate to the iphone/ directory inside your PhoneGap source code folder. Inside the folder you should see a PhoneGapLibInstaller.pkg file.


Note:

If you don’t see the PhoneGapLibInstaller.pkg file, you can create it manually. In the Finder, open the iphone/PhoneGapLibInstaller directory under the PhoneGap source directory. Look for the PhoneGapLibInstaller.pmdoc PackageMaker document. Double-click on this file to open it inside the package maker and click the Build and Run button in the PackageMaker toolbar.

Doing this will build the PhoneGapLib installer bundle, and save it (at least by default) in your Documents folder. If you return to your Finder window and navigate to your Documents folder, you should see a PhoneGapLib installer package file.


If you double-click on the PhoneGapLibInstaller.pkg file, you’ll start the installer application, as shown in Figure 1. Accept all of the defaults.

Figure 1. The PhoneGapLib Installer


2. Building a PhoneGap Project

Start Xcode and create a new project. If PhoneGap has been successfully installed, you should now see a PhoneGap project template entry under the User Templates header, as shown in Figure 2.

Figure 2. Starting a new PhoneGap project in Xcode


Start a new PhoneGap project, and you’ll see something much like Figure 3.

Figure 3. The HelloWorld PhoneGap application in Xcode


If you click the Build and Run button on the Xcode toolbar, the sample PhoneGap application will build and deploy into iPhone Simulator.

You can modify the files inside the www folder in your project and add your HTML, CSS, and JavaScript to build your own AJAX-based application.


Note:

Since PhoneGap uses the file:// protocol to load your HTML into a normal UIWebView, you can load and execute JavaScript from other websites, without problems.



 
Others
 
- Windows Phone 8 : Phone-Specific Controls (part 2) - Pivot Control
- Windows Phone 8 : Phone-Specific Controls (part 1) - Panorama Control
- BlackBerry Tablet Applications : Exploring the APIs - Busy Indicator
- BlackBerry Tablet Applications : Exploring the APIs - Multi-Touch
- BlackBerry Tablet Applications : Exploring the APIs - Microphone
- Android : Getting Fancy with Lists - Inflating Rows Ourselves
- Android : Getting Fancy with Lists - A Dynamic Presentation
- Android : Getting Fancy with Lists - Getting to First Base
- Windows Phone 7 : Getting Started with XNA - Displaying Text
- Windows Phone 7 : Getting Started with XNA - Useful Sprite Effects
 
25 Inspiring Game of Thrones Quotes
 
Top 10
 
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Finding containers and lists in Visio (part 2) - Wireframes,Legends
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Finding containers and lists in Visio (part 1) - Swimlanes
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Formatting and sizing lists
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Adding shapes to lists
- Microsoft Visio 2013 : Adding Structure to Your Diagrams - Sizing containers
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 3) - The Other Properties of a Control
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 2) - The Data Properties of a Control
- Microsoft Access 2010 : Control Properties and Why to Use Them (part 1) - The Format Properties of a Control
- Microsoft Access 2010 : Form Properties and Why Should You Use Them - Working with the Properties Window
- Microsoft Visio 2013 : Using the Organization Chart Wizard with new data
programming4us programming4us
 
Popular tags
 
Video Tutorail Microsoft Access Microsoft Excel Microsoft OneNote Microsoft PowerPoint Microsoft Project Microsoft Visio Microsoft Word Active Directory Biztalk Exchange Server Microsoft LynC Server Microsoft Dynamic Sharepoint Sql Server Windows Server 2008 Windows Server 2012 Windows 7 Windows 8 Adobe Indesign Adobe Flash Professional Dreamweaver Adobe Illustrator Adobe After Effects Adobe Photoshop Adobe Fireworks Adobe Flash Catalyst Corel Painter X CorelDRAW X5 CorelDraw 10 QuarkXPress 8 windows Phone 7 windows Phone 8 BlackBerry Android Ipad Iphone iOS