iPad hybrid application retrospective

Having just completed Sudoku Takeout for iPad I'm left impressed with how easy Apple has made it to write a 'hybrid' app. Hybrid iPhone/iTouch/iPad apps are just like other apps except they contain a browser view (UIWebView). UIWebView enables your app to embed a web page as one of its views and allows your Objective-C code to invoke JavaScript functions in that page.

Advantages:

• Reuse your JavaScript
• Very little Objective-C required
• Files (e.g. CSS, HTML, JavaScript, images, etc.) can be local so no network connection is required
• Safari is fast, supports HTML5, and has strong debugging tools

UIWebView limitations:

• UIWebView does not support onOrientationChanged events, your app must listen for these events and then forward them into JavaScript
• Doesn't play HTML5 Audio
• Debugging JavaScript can only be done in Safari, not in the Simulator or device
• localStorage.setItem throws intermittent QUOTA_EXCEEDED_ERR exceptions, calling removeItem before setItem seems to solve this
• There is no way to get double clicks from JavaScript and apps cannot override touchesBegan event for UIWebView in Obj-C. Some people put a transparent view over UIWebView to catch touches.

Strategies that worked:

• Generalized events - By using platform independent events (e.g. handleGuess vs. handleClick) the same logic used to handle a guess triggered by a keyboard on a web site can be reused for a guess triggered by a touch to a graphical picker on an iPad.
• Create a persistence API - hiding the persistence implementation behind an API allowed the game logic to be unaffected when switching between cookies, localStorage or an ajax based server persistence.
• CSS - put everything in CSS and use jQuery's add/removeClass to manipulate images and positions. Leverage off of selectors (e.g. [class~="portrait"]) in your CSS to handle orientation changes.

The 'hybrid' approach required some work arounds but in the end, created an exciting fully featured iPad app. Can you tell Sudoku Takeout is a hybrid?

Useful hybrid application links:

• 7 tips for using UIWebView
• Developing hybrid iPhone apps
• Calling Objective-C Methods From JavaScript
• Building iPhone Apps with HTML, CSS, and JavaScript