android - How to convert an existing Angular1 web app to a Cordova app? -
i've found lot of tutorials on internet telling how build new cordova app angularjs, , that's good.
but if have angularjs web app alive , kicking, , make mobile app (android/ios) it? possible / feasible / advisable?
if is, can give advise, or point existing resource documenting task?
as dmahapatro said best bet angularjs app packaged mobile use ionic framework. migration simple. ionic includes ui framework, isn't @ required, web coding work because app being run in chrome frame. ionic command line tool of magic.
i start spinning standard ionic app using command ionic start appname
. can put app appname/www directory. edit index.html , add script tag in head. <script src="cordova.js"></script>
that required app built mobile. can test on android running ionic platform add android
install dependencies android , run ionic run android
(have android plugged in drivers installed or emulator running genymotion). if want build ios need have mac (eww...) it's easy ionic platform add ios
, run ionic run ios
test on apple, though there bit more setup believe.
to added benefits of ionic's directives , other helpful utilities can add dependency main ionic module below. note added ngcordova , highly recommend getting better device integration.
angular.module('appname', ['ionic', 'ngcordova']) .run(function($ionicplatform, $cordovasplashscreen) { $ionicplatform.ready(function() { // hide accessory bar default (remove show accessory bar above keyboard // form inputs) if (window.cordova && window.cordova.plugins.keyboard) { cordova.plugins.keyboard.hidekeyboardaccessorybar(true); } if(window.navigator && window.navigator.splashscreen) { window.plugins.orientationlock.unlock(); } if (window.statusbar) { // org.apache.cordova.statusbar required statusbar.styledefault(); } if (window.cordova){ // hide splash screen when app loaded $cordovasplashscreen.hide(); } }); });
all in pretty set since on angularjs backbone (pun intended) of ionic. may run device specific issues far styling , such, part should work. feel free message me anytime if want more ionic or angularjs. thanks! ^_^
Comments
Post a Comment