CRIANDO APLICAÇÕES MOBILE USANDO PHONEGAP

Cristiano santos, 17/10/2014

tÓPICOs

  • Introdução
  • Sobre o Phonegap e suas bibliotecas
  • Phonegap Demo

introdução

tipos de apps

native apps

web apps

web and native apps

apps nativos são o 

PRESENTE

mas

apps hibridos são o 

futuro

native app

web app

hybrid app

cross-plataform

linkable

discoverable

device api

o que é o phonegap?

Phonegap é um framework open-source para a criação rápida de aplicativos cross-plataforma utilizando HTML5, CSS e Javascript.

phonegap

Wrap your app with Phonegap

Deploy to mobile plataforms

plugin api's

PLUGIN API'S

Battery status

camera

contacts

device (info)

accelerometer

compass

dialogs

file transfer

geolocation

globalization

media

media capture

network information

vibration

veja todos os plugins: 
plugins.cordova.io

PHONEGAP BUILD

  • CLOUD SERVICE

  • eles compilam

  • suporte multi-plataforma

  • teamwork

"TALK IS CHEAP.

SHOW ME

THE CODE"

Linus Torvalds

"TALK IS CHEAP.

SHOW ME

THE CODE"

Linus Torvalds

"TALK IS CHEAP.

SHOW ME

THE CODE"

Linus Torvalds

começando com
android

ANDROID

$ mkdir Android libs assets/www

No terminal, navegue até a pasta android/bin do diretório phonegap

<project_folder_path> is the path to your new Cordova Android project
<package_name> is the package name, e.g. com.YourCompany.YourAppName
<project_name> is the project name, e.g. YourApp (Must not contain spaces)
$ ./create <project_folder_path> <package_name> <project_name>

ANDROID

ANDROID

Do diretório Cordova baixado, copie os seguintes arquivos:
 

Copie cordova-2.x.x.js para assets/www
Copie cordova-2.x.x.jar para libs/
Copie o diretório xml para res/

ANDROID

  • Verifique se o arquivo cordova-2.x.x.jar esta listado no Build Path do seu projeto.
  • Click com o botão direito no diretório libs/ e vá para Build Paths/ > Configure Build Path.
  • Na tab Libraries, adicione cordova-2.x.x.jar no projeto.
  • Atualize o projeto.

ANDROID

No Eclipse, edite o arquivo java principal do seu projeto, no diretório src/

package com.phonegap.exampleapp;

import android.os.Bundle;
import com.phonegap.*;
import org.apache.cordova.*;

public class exampleapp extends DroidGap {
 @Override
 public void onCreate(Bundle savedInstanceState) {
  super.onCreatE(savedInstanceState);
  super.loadUrl("file:///android_asset/www/index.html");
 }
}

ANDROID: hello world!

No diretório www, crie o arquivo index.html

<!DOCTYPE html>
<html>
 <head>
  <title>Cordova</title>
  <script type='text/javascript' src='cordova-2.x.x.js'></script>
 </head>
 <body>
  <h1>Hello World!</h1>
 </body>
</html>

DEPLOY TO EMULATOR

DEPLOY TO DEVICE

QUAIS AS BIBLIOTECAS DISPONÍVEIS?

USER INTERFACE

MVC FRAMEWORKS

TESTING

others

Alguém ainda tem dúvidas?

Obrigado!

cristianossd@gmail.com

@cristianossd

Building Mobile Applications using Phonegap

By cristianossd

Made with Slides.com

Building Mobile Applications using Phonegap

WISER presentation

  • 941

More from cristianossd