home forums resources search newsjoinmembers: 6956
Sections PHP Flash Java Ruby Windows Linux
Hiveminds's picture

Hiveminds | Tue, 2008-08-19 13:31  tags: , , , , ,

Before Joe Hewitt developed iUI creating web applications that worked within the confines of an Apple iPhone was not very straight forward. The iPhone uses the Safari web browser which is not the easiest of browsers to make things look good in especially when it comes to javascript and AJAX animation.

 

What is iUI?

First and foremost, iUI is not meant as a "JavaScript library". Its goal is simply to turn ordinary standards-based HTML into a polished, usable interface that meets the high standards set by Apple's own native iPhone apps. As much as possible, iUI maps common HTML idioms to iPhone interface conventions. For example, the <ul> and <li> tags are used to create hierarchical side-scrolling navigation. Ordinary <a> links load with a sliding animation while keeping you on the original page instead of loading an entirely new one. A simple set of CSS classes can be used to designate things like modal dialogs, preference panels, and on/off switches.

Features

  • Single-page navigation usable
  • It keeps the back and forward buttons working and optionally inserts a captioned back button into your app's toolbar.
  • It slides smoothly between pages instead of the unpleasant flicker and jumpiness that accompanies a fresh page load.
  • Ajax linking of external pages for smooth animated insertion
  • Smooth paging through long lists of content by replacing the link with content
  • Forms are submitted via Ajax and the results slide neatly into place.
  • Create Navigational Menus and iPhone interfaces from standard HTML
  • Use or knowledge of JavaScript is not required to create basic iPhone pages
  • Ability to handle phone orientation changes
You can browse the source for iUI 0.13 here.
 

When you download the iUI archive it contains not only the source and images but many demonstrations of how to use them.

The new iPhone version of Digg was built using the early "iphonenav" scripts. It's a really well done site, and Joe Stump of Digg built it so quickly that he beat out the new iUI release, which would have helped a lot. To illustrate the improvements here is a miniature version of Digg which uses the new features of iUI. If iUI was used the new features could make Digg load faster and feel smoother.

If you want to know more about how to do iPhone web development on your own without the iUI then you should checkout james Black's tutorial which starts you from scratch.


Happy Publishing!

Hiveminds's picture
This article brought to you by the Hiveminds Magazine - Staff. Contact us if you want to post an article or announcement anonymously
Thoughtbox - So what did you think?



 
CMS Comparison Matrix

Newsletter

Get updates on Hiveminds services, articles and downloads by signing up for the newsletter.

Editor's choice

Some of the better articles, stories and tutorials found at Hiveminds.

Find more

Find more of Hiveminds articles, stories, tutorials and user comments by searching.




Picked links

Hand picked websites and articles from around the web that provide quality reading.