I have developed an web app using MVC4- mobile and HTML5. Every things is working fine when we enter URL from any phone. But i am wondering how to convert my web app into hybrid app so that i could upload in istore or GooglePlay.
Please help me with the procedure or steps i need to follow and is there any tool other than phoneGap that i could use.
Thanks in advance.
There are few options but I will mention only two of them.
Most commonly used is a Phonegap/Cordova app wrapper framework (Also my main choice). Cordova is a new name for a Phonegap framework. It will give you an access to common mobile phone functionalities (Android, iPhone, Blackberry and WP7+). It is rather easy to use and there are a lot of vorking tutorials available, you can even find them in youtube.
Here's an phonegap link: http://cordova.apache.org/. There you will find tutorials how to install/configure it on all available platforms. This is a older link: enter link description here, it still has usable informations.
If in doubt always search for phonegap examples instead of cordova. For some reason Phonegap is still a mostly used name.
Here's an Phonegap + jQuery Mobile example: http://therockncoder.blogspot.com/2012/07/jquery-mobile-phonegap-and-camera.html, there you will find a github link for Android and iOS implementation.
Through the PhoneGap javascript APIs, the "web app" has access to the mobile phone functions such as Geolocation, Accelerometer Camera, Contacts, Database, File system, etc. Basically any function that the mobile phone SDK provides can be "bridged" to the javascript world. On the other hand, a normal web app that runs on the mobile web browser does not have access to most of these functions (security being the primary reason). Therefore, a PhoneGap app is more of a mobile app than a web app. You can certainly use PhoneGap to wrap a web app that does not use any PhoneGap APIs at all, but that is not what PhoneGap was created for.
Now some disadvantages. With PhoneGap for each platform you have to maintain a different project. The burden for that increases when there is a need to use multiple PhoneGap plugins because you need to search and update different files on each platform.
Mosync is also an excellent solution. This framework has a few things better handled then Phonegap. Like:
With MoSync you’ll have only one project to maintain for all the platforms. For iOS you will still need to use Xcode because MoSync outputs a project for it but, other than just building it, there is no need to dig deeper in Apple’s IDE.
The entire provided functionality for JavaScript is placed in the same file for all of the operating systems. There are no files for plugins because it has none (at least that I know of), but the same extensibility is achieved in ways described in the next section.
If there is some functionality that MoSync doesn’t provide on the JavaScript side, there are no plugins that you can use, but there is another way. MoSync provides a lot of features from the C++ side and if they aren’t accessible from JavaScript by default they can be easily made available. I’m sure that in the future the MoSync team will add more features to the JavaScript library.
With MoSync you are not restricted to only JavaScript frameworks to replicate native UI, you can truly create native UI elements that are more responsive using only JavaScript.
Rhomobile on the other hand is much less used thus a lot less supported.
I heard few good things about this framework but never had time to learn/use it.
RhoMobile applications are OS-agnostic, able to support enterprise-
and consumer-class operating systems including Windows® Embedded
Handheld, Windows® CE, Windows® Phone 7 Series, Apple® iOS, Android®
and BlackBerry®. You have complete control over how applications
behave on different devices. With RhoMobile Suite, you are finally
free from OS design constraints, able to create business applications
that are every bit as elegant looking and intuitive as their consumer
counterparts (This was copied from their main site).
Related
Have you already developed a Xamarin app whose views are generated from a Json recovered when launching the application?
I met a client with this kind of need:
they are developing a web app to prototype the screens by adding and positioning some controls (TextBox, Label, ...)
this generates a Json that must be interpreted by the Xamarin app: this will build the different views dynamically
in a first version, the user's data would be stored locally (through a file or SQLite) and synchronized "manually" when the device is connected to a computer
the app will work on Android only in a first time, and then on WPF
The client has not yet decided between Xamarin.Forms or Xamarin native, but it's probably more interesting to do it through Xamarin.Forms, even if iOS is not required: this should make porting on WPF easier.
Have worked on similar cases? Have you some recommendations? Are there plugins or patterns that could be used to simplify this development?
I've found this one, but it doesn't seem to be the same use.
There is also this article on iOS, but there is not the same thing on Android.
This would in theory be possible using a massive code behind builder for a page but should NOT be done for a production app. Mobile apps have very specific requirements that need to be thought of before attempting.
Xamarin is great for simplifying code reuse, and if you use Xamarin Forms you can reuse the UI components for Enterprise apps.(the less fancy and pixel perfect the layouts need to be the better. )
Your client would be better served by making it a mobile compatible web page instead from the details you have shared.
I have a webapp developed (game), based on HTML5 + CreateJS, but since Android lacks of standards, I've run into unsolvable issues for my webapp. That's why im recurring to PhoneGap.
Yet my confusion lies in the fact that I need to make this game into a phonegap app that runs on Android/iOS, using for each platform native specific stuff.
So, should I build 2 apps (one for each platform), all over again, or use the one I have and try to deploy it into different devices using phonegap?
The truth is I don't know how to approach this problem... can anyone help?
Best Regards.
Yes, you can use Cordova (PhoneGap) to create a cross platform mobile app. Basically, Cordova (PhoneGap is Adobe's version of Cordova) is an open source project that provides JavaScript API's for accessing native device functionality (like the Accelerometer or Camera.) Cordova also lets you package your app in the native application shell, so you put your app on the app store. Please see my other answer here about Cordova and hybrid apps: Beginning with Apache Cordova
If the game runs completely in HTML5, I think it would be easiest to just use that one codebase and integrate it with Cordova and then deploy to the various platforms - why rewrite the app twice if you don't need to?
However, if you are using native device functionality, you may need to develop your own Cordova/Phonegap plugins for use. This way, you can call regular Android/iOS code (Java or Objective-C code) that you write from your web app code with JavaScript. This might be more work, especially if you have never written in these languages.
Personally, since you already have a working HTML5 app, I'd just try to get it working with Cordova and see how it performs. If you really need some native specific stuff, then I'd try creating that "stuff" as a plugin. Rebuilding the app twice, once for Android and once for iOS seems like a pretty big waste of time to me.
The answer here is either yes or no.
Yes if you want to use some specific feature of the native code. For instance, iOS's default objects is beautiful itself, you can easily drag and drop it to build your application. However, it takes lots of time to rebuild for another platform. Specially, if you intend to create app/game for multiple platforms, it would be a nightmare.
HTML5 is much faster for you to approach several platforms. However, you can't get the best result on all platforms and all devices. I mean, it is really difficult to bring the max performance of the app on all devices. For this solution, I suggest HTML5 with some libraries such as LimeJS, Crafty, Impact, etc. or some tools such as Construct 2, etc. I used to use HTML5 with all those libraries but found out that Construct 2 is much better.
Instead of using phonegap, I recommend cocoonjs. Specially if your targets are iOS and Android platforms.
Hope that help.
Yeah, even the simplest game such as bubble buster would be difficult to make cross platform with different version of android webview and you need cross platform? I would suggest looking into something like Unity3D.
I need to create a touch version of the webstore with 3D elements. At the beginning I chose a WebGL technology because of the straightforward integration with databases (such interface will need to download thumbnails of products and basic information about it using MySQL).
Problem is the lack of simple tools to create such a project. Recently I became interested in Unity. I just don't know whether its capabilities allow me to do this. What do you think about Unity 3d? Is a good choice for such a task?
Unity3D web player needs a plugin installed at the user's browser. This plugin is not available for iPhone and AFAIK for Android neither. Thus it is not possible to create a pure browser based online store solution.
What you can do with Unity3D as a workaround: Do the project in Unity3D and export it once as web version for desktop clients and then export it as app (i.e. a fat client that needs to be installed) for iPhone and again for Android. But even then you will have a lot of work providing different layouts for all target devices.
Although I like Unity3D very much, I would not recommend it for development of an online store.
I have a new project starting up that consists of building a webapp for a workorder based system. The main views are:
Viewing all open/closed/hold work-orders,
View Detail of Workorders
Create new Work orders
Account management.
In addition to being a webapp, it should also function as a mobile app.
What is the best approach for doing this? Will i have to develop a separate app for the mobile side? Can i use my webapp + sencha, jquery mobile, something.. that can work with my logic, classes, HTML structure to have it effectively work on mobile?
Or do i develop a mobile version first and think about progressive enhancement to the webapp (website)?
This question is open to all interpretations of flow, process, technologies.
Thank you Stack Overflowers.
Seperate out your business logic and model code from the view layer. Then use sencha touch and Extjs to create both a web and mobile (mobile web atleast) application. You can then reuse the model and business logic code and use the different frameworks to manage the view. When you have a mobile app running, use phone gap to turn it into a full-fledged app (assumming you need access to phone only systems (camera etc)).
We've done this with our own custom framework built on top of Ext and Sencha. We use ActiveRecord to run the models and then have a compile script that knows which files are for mobile and which are for web. We can then have all the code in the one repository and use the compiler to produce versions for the correct type (mobile or web).
It's definitely not a good idea to start with the mobile app, since web browsers are more ubiquitous than smart phones. Start with the web application and tailor the UI so that it can be easily displayed on smart phones as well as desktop browsers. If that's not a viable route, you could have a regular version and a mobile version of your website. In general, I think the overhead of writing a dedicated mobile client to browse your website is greater than the payoff unless you want to take advantage of the phones' hardware features like GPS or sensors (and even GPS you can still access from a web app using W3C geolocation api).
I would like to build an app that heavily relies on Google Maps. Is it possible to write a native iPhone application in HTML/Javascript ? If so, will it be accessible from the app store ? Otherwise, how could I include Google Maps in a native app ?
You will need to build a framework application in Objective-C that contains a UIWebView. You can populate the UIWebView with your HTML/Javascript.
In my opinion the better alternative is to use the MapKit framework from a native app. MapKit lets you do almost everything you can do using the full Google Maps API and I think a native app will always work better on the device than a UIWebView container app.
I have used MapKit in a few of my apps and found it easy to use with nice performance. In the linked example I embed a MkMapView in a UIScrollView in page mode. I doubt you would have an easy time implementing this with a UIWebView and I am sure it wouldn't perform as well.
Yes, it is possible to do this. There is a great opensource project called PhoneGap http://phonegap.com/ that allows you to do exactly that. Not only but alos deploy on other mobile OSs like Android, blackberry etc.
To get on the app store, you need to register as an apple developer which is about US$100. Development can only be done on a mac) Apple gives you lots of software tools including code editors and iphone simulator.
Addressing the two parts of your question:
Is it possible to write a native
iPhone application in HTML/Javascript
? If so, will it be accessible from
the app store ?
There's a framework called NimbleKit that allows you to write your app in HTML/JavaScript and then converts it to Objective-C/Cocoa for you. There are several problems with NimbleKit, though:
It costs $99.
It adds a level of indirection that increases the chance of errors.
Because you're not using the 'real thing', you're much more limited in what you can do (i.e. you can only use what they have made available to you).
Another solution is to embed a UIWebView in a native iPhone app (you'll have to use a bit of Objective-C/Cocoa to do this) and then write the rest of your app as an iPhone web app that is loaded into the UIWebView. However, I would strongly advise you not to write an iPhone web app, whether standalone or embedded in a native app. As of writing, iPhone web apps have many disadvantages, including:
They're very slow.
They have limited functionality (e.g. no device APIs).
They can't take advantage of the Cocoa-Touch framework (a serious downside).
iPhone web apps may become viable in the future, but at this point in time, I'd steer away from them and write a native iPhone app using native technologies (i.e. Objective-C/Cocoa).
Otherwise, how could I include Google
Maps in a native app ?
Use Apple's framework "MapKit". See Displaying Maps and Annotations in the iPhone Application Programming Guide, this tutorial, and this tutorial for information on how to use MapKit.
In iPhone OS 3.0 and greater apple has created a custom Cocoa Touch control that allows developers to embed Google Maps into a native app. The maps support multi-touch and you can annotate the maps with custom views, find the user's current location and do other cool stuff.
The way to do this is to build your app as a regular web app (javascript/css/html). The embed that in a native WebView. The WebView is a container for iphone apps that are meant to be web apps. These apps are sold the same way as other apps on the app store.
It's not possible to write a native iPhone app in HTML/JS, http://code.google.com/p/iphone-google-maps-component/ may be of some use, or you can use:
UIApplication *app = [UIApplication sharedApplication];
[app openURL:[[NSURL alloc] initWithString: #"http://maps.google.com/maps?g=London"]];
Please see How can I launch the Google Maps iPhone application from within my own native application? for more info.
There is also Appcelerator Titanium, which looks to be a good framework for developing iPhone and Android applications using web technologies. They gave an interesting presentation on this at C4.
However, trying to "write once, run everywhere" on mobile devices will cause you to create something that is inferior on all platforms to native applications, because you will need to design for the lowest common denominator between them.