This document discusses developing mobile applications using web technologies like Android, Ionic, AngularJS, and Cordova. It provides steps for setting up development environments, installing dependencies, and creating a basic Ionic application. Code snippets show the application structure and basic AngularJS module definition. Finally, it discusses testing the app on devices and emulators, as well as references for further documentation.
5. AGREGAR CAMINOS A VARIABLE DE ENTORNOAGREGAR CAMINOS A VARIABLE DE ENTORNO
D:InstallersMobileandroid-sdk-windowsplatform-tools;
D:InstallersMobileandroid-sdk-windowstools
21. Creando nuestra primera app
> ionic start example blank
> cd example
> ionic platform add android
> ionic build android
> adb devices
> ionic run android
22. La estructura de nuestro código
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no,
<title></title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS i
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
</head>
<body ng-app="starter">
<ion-pane>
<ion-header-bar class="bar-stable">
23. La estructura de nuestro código
// Ionic Starter App
// angular.module is a global place for creating, registering and retrieving Angular mo
// 'starter' is the name of this angular module example (also set in a <body> attribute
// the 2nd parameter is an array of 'requires'
angular.module('starter', ['ionic'])
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
// Hide the accessory bar by default (remove this to show the accessory bar above t
// for form inputs)
if(window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
}
if(window.StatusBar) {
StatusBar.styleDefault();
}
});
})
24. Probando la app en un dispositivo
Phonegap Desktop
iOS AppStore
Android Play Store
Windows Phone Store
FirefoxOS MarketPlace