log inhelp

View
 

Getting Started with PhoneGap iOS using Xcode 4 (No Template)

Page history last edited by Steve Gill 1 year ago

 

    1. Requirements
    2. Step 1
    3. Step 2

This tutorial provides instruction on setting up 0.9.5 PhoneGap for your web application on an iOS device using Xcode 4 and no template. 

For information regarding setting up PhoneGap 0.9.5 with Xcode 3 with a template, click here.

For information regarding setting up PhoneGap 0.9.5 with Xcode 3, click here.

 

For information on setting up an iOS device for development, see the iOS Dev Center.

NOTE: 

 

It has been reported that if you install Xcode 4 without previously having Xcode 3 installed, you may run into issues. 

 

 

Requirements

 

  • Intel-based computer with Mac OS X Snow Leopard (10.6) with Xcode and the iPhone SDK installed.  Make sure to install the default with the UNIX tools included.
  • an Apple iOS device (iPhone, iPad, iPod Touch)
  • iOS developer certification. (only necessary to install apps on an iOS device)

 

Step 1

 

  • Download the latest copy of PhoneGap and extract its contents. We are only interested in the iOS directory
  • Run the installer until completion.  (Make sure Xcode is closed)
  • Generate the PhoneGap project online. Type what you want to name your project. Download it.

     

  • Launch Xcode 4 then under the File menu, select "Open..."
  • Navigate to where you downloaded the generated PhoneGap project and open the .xcodeproj file

 

           

 

 

 

  • Modify the contents of the "www" directory to add your HTML, CSS and Javascript.

 

     

 

  • Open [AppName]-Info.plist located in the "Resources" directory. Change "BundleIdentifier" to the identifier provided by Apple. If you have a developer license, you can access and run the Assistant at http://developer.apple.com/iphone/manage/overview/index.action and register your App. If you do not have a developer license and simply wish to test PhoneGap on your desktop simulator, you can skip this step.

     

 

 

  • IMPORTANT: Make sure to change the Active SDK in the top left menu to Device+version#.

 

  • Click the Run button located at the top right

 

           

 

Step 2

 

  • Open [AppName]-Info.plist and change "BundleDisplayName" to the name of your web application.

  • Replace the three icon.png with your web application's icon. These are located in the "icons" directory under the "Resources" directory

  •  

     

    Change Default.png located 

    in the "splash" directory under the "Resources" directory

     

          

 

 

     And your done! 

     

                

 

 

PDF version