Package web app for iOS - full screen iframe?

Question

We have built an online web app and would now like to package it for ipad & iPhone. Ideally, all we need is a full screen browser window like an iframe that will load the full app from the web. Obviously we could do it in the browser but we need our own launch icon on the desktop as well as removal of the browser address bar. I've heard of phoneGap & Appcelerator but I'm unsure if this setup is possible using these platforms?

Is there a simple method for achieving this?

Are there any problems or security issues on iOS I need to look out for?

Answer 1

A lot of web application are on the app store. They just put a UIWebView in an empty app and point it to the web app. Everything will run just like it does in Safari, but there will be no toolbars, etc. This will require your to have Xcode and a membership to the developer program.

If you don't want to go through the app store, you can still set up your app so that you can save it to your device and it will run as though it were native. Here is a link with an example of that:

http://sixrevisions.com/web-development/html5-iphone-app/

So you have to decide which is best for you.

Native iOS app with UIWebView

• Exposure on the app store
• Opens up the possibility to combine your app with native iOS UI elements if you want
• Possibility of using accelerometer, Bluetooth, Game Center, and other native app features

"Offline" HTML5 App

• No membership or Xcode required
• Full control of your app (no curation)
• Easily adaptable to work on other devices
• You don't have to pay a 30% cut if you sell something

In many cases, user experience will be identical for each option once the app is on the device. Weigh the options and figure out what's best for you.

Directions for setting up native iOS app with UIWebView

1. Open Xcode and select File > New > Project...
2. Enter a product name and select the device family. Check "Use Automatic Reference Counting" and uncheck "Use Storyboards" and "Include Unit Tests"
3. Pick where to put the project
4. Open ViewController.m and insert the code below in viewDidLoad right under above the line [super viewDidLoad].
5. Change the url "http://www.google.com" to the address of your web app.

UIWebView *webView = [[UIWebView alloc] initWithFrame:self.view.frame];
NSString *urlAddress = @"http://www.google.com";
NSURL *url = [NSURL URLWithString:urlAddress];
NSURLRequest *request = [NSURLRequest requestWithURL:url];
[webView loadRequest:request];
[self.view addSubview:webView];