Jul 04

With the release of PhoneGap 0.9.6 last week (week of June 27, 2011), there was some minor code clean up done to the way PhoneGap-webOS initializes.

This blog post will quickly run through an example of how to set up a simple “Hello World” example using PhoneGap-webOS 0.9.6.

If you would like to see an example app that demonstrates the various PhoneGap-webOS API calls & features you can refer to the example app that was made available in my Getting Started with PhoneGap-webOS 0.9.5 tutorial.

The first couple steps are to make sure you have all the tools and to set up your project.

  1. The list of necessary software & tools listed in step 3 on the PhoneGap webOS page.
  2. Set up your project by following step 4 on the PhoneGap webOS page, be sure to leave your terminal/cygwin window open as you will need it later.

From here you can delete or rename the index.html file (if you want to keep it as a reference) in the framework folder, we will be working on creating an app from the beginning.

  1. Create a new index.html file in the framework folder.
  2. Include the phonegap.js library in the <head> of your index.html
  3. Add the text “Hello World” within the <body> tags
  4. Add an event listener for the ‘deviceready’ event to the document – see the code sample below

The source of your index.html should look like this:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<html>
    <head>
        <script type="text/javascript" src="phonegap.js"></script>
    </head>
    <body>
        Hello World
 
        <script>                         
             document.addEventListener('deviceready', function () {
                  // PhoneGap is ready, do all your stuf here
             }, false);
        </script> 
 
    </body>
</html>

To view your work, you’ll want to either:

  • open the Palm emulator
  • set your Palm device to developer mode and plug it in

Go back to terminal/cygwin and type “make” (without the quotes).

You should see your hello world example app in the emulator or device.

PhoneGap webOS Hello World Example

Source can be found here.

Leave a Reply