Posts Tagged ‘phonegap’

Prima app per android pubblicata

Friday, November 30th, 2012

Normalmente nella mia vita lavorativa quando si discute di applicazioni mobili multipiattaforma, in un modo o nel altro parlo sempre della mia esperienza con PhoneGap (ora Cordova); la mia prima app sull’appStore di Apple (A.I.S.Mo Info)  è stata appunto  sviluppata con questo framework ed era più che altro un esperimento, quasi un Proof Of Concept.

L’app in se stessa è molto semplice,: un insieme di pagine HTML che sfruttano poco le caratteristiche di PhoneGap e con qualche hack per le mappe. La User Interface è molto iOS-like grazie all’utilizzo del framework CSS UIUIKit.

Ci sono stati esperimenti di porting “automatico” usando il servizio PhoneGap build (ora Adobe PhoneGap Build).

Cogliendo l’occasione di un corso di sviluppo Android, ho effettuato il porting dell’applicazione.

Tempo totale: meno di una giornata compreso il tempo di pubblicazione sul PlayStore.

La fase vera di porting e test è stata molto veloce, ho dovuto testare la visualizzazione su diversi dispositivi a mia disposizione,  creare le icone (ho usate le stesse dell’iphone ridimensionate da eclipse) e gli screen shot per il play store.

In due ore e mezzo, mi sono registrato come sviluppatore, ho cercato di capire cosa fosse necessario per pubblicare l’app (testi e screenshot). La creazione del pacchetto di rilascio è molto più semplice, non c’e’ da impazzire con provisioning profiles, certificati e loro relativa importazione (e conflitti);ho quindi firmato il pacchetto creando il Keystore e atteso che l’app fosse disponibile su GooglePlay.

Sicuramente la pubblicazione su PlayStore è molto più “easy” che non su appStore, i tempi di attesa sono molto diversi in quanto il market di android è molto più “libero” e con meno controlli rispetto ad Apple, ma se si volesse pubblicare la propria app anche su altri market Android i tempi di pubblicazione non sarebbero molto diversi da quelli a cui è abituato uno sviluppatore iOS.

 

 

Phonegap Cordova: richiamare l’app mappe nativa in IOS6

Sunday, October 21st, 2012

In un precendente post spiegavo un work-around per richiamare l’app Mappe di google nativa su iOS da una applicazione sviluppata con phonegap: lanciando opportunamente un URL che puntasse al server maps.google.com, si apriva l’app mappe integrata. Il lancio “dell’opportuno URL” consiste in una semplice riga di codice:

[[UIApplication sharedApplication] openURL:url];

Nell’ultima versione del sistema degli iDevice l’applicazione l’app di google è stata sostituita e il comportamento degli URL è cambiato di conseguenza. In IOS6 un url a maps.google.com aprirà il sito di google in Safari. Sarà quindi necessario intercettare tutte le chiamate di apertura URL della webView e sostituire l’url corretto per la versione di  IOS. Gli URL alle mappe nella mia applicazione puntano a maps.apple.com. Il metodo è shouldStartLoadWithRequest che si trova in MainViewController.m (la posizione è cambiata rispetto a phonegap  1.0)

[sourcecode language=”objc”]
– (BOOL)webView:(UIWebView *)theWebView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType) navigationType {
NSLog(@"link:%@",[[request URL] absoluteString]);
if ([[[request URL] absoluteString] rangeOfString:@"http://maps.apple.com"].location != NSNotFound) {
// Open in native Maps App
if ([[UIDevice currentDevice].systemVersion floatValue] NSLog(@"MAPPE GOOGLE");
NSURL *url=[NSURL URLWithString:[[[request URL] absoluteString] stringByReplacingOccurrencesOfString:@"http://maps.apple.com" withString:@"http://maps.google.com" ]];
[[UIApplication sharedApplication] openURL:url];
} else {
NSLog(@"MAPPE APPLE");
[[UIApplication sharedApplication] openURL:[request URL]];
}
return NO;
}
else
return [ super webView:theWebView shouldStartLoadWithRequest:request navigationType:navigationType ];
}
[/sourcecode]

[iframe src=”http://rcm-it.amazon.it/e/cm?lt1=_blank&bc1=000000&IS2=1&bg1=FFFFFF&fc1=000000&lc1=0000FF&t=ac20blo-21&o=29&p=8&l=as4&m=amazon&f=ifr&ref=ss_til&asins=1449319548″ width=”121px” height=”240px” scrolling=”no” marginwidth=”0″ marginheight=”0″ frameborder=”0″][/iframe] [iframe src=”http://rcm-it.amazon.it/e/cm?lt1=_blank&bc1=000000&IS2=1&bg1=FFFFFF&fc1=000000&lc1=0000FF&t=ac20blo-21&o=29&p=8&l=as4&m=amazon&f=ifr&ref=ss_til&asins=B008EK6HVY” width=”121px” height=”240px” scrolling=”no” marginwidth=”0″ marginheight=”0″ frameborder=”0″][/iframe] [iframe src=”http://rcm-it.amazon.it/e/cm?lt1=_blank&bc1=000000&IS2=1&bg1=FFFFFF&fc1=000000&lc1=0000FF&t=ac20blo-21&o=29&p=8&l=as4&m=amazon&f=ifr&ref=ss_til&asins=1430239034″ width=”121px” height=”240px” scrolling=”no” marginwidth=”0″ marginheight=”0″ frameborder=”0″][/iframe]

Adobe acquista Nitobi (e PhoneGap) ?

Tuesday, October 4th, 2011

Ieri (3 ottobre) in un tweet @phonegap è stato annunciata l’acquisizione di Nitobi da parte di Adobe. In compenso Nitobi ha scelto di donare PhoneGap alla Apache Software Foundation.

Rilasciato PhoneGap 0.9.6

Sunday, July 3rd, 2011

E’ stato rilasciato PhoneGap 0.9.6. Tanti fix (in particolare uno utile per il mio Aismo Info).

Un warning: leggete bene i metodi che saranno deprecati nella versione 1.0 !!!

Al seguente indirizzo potete trovare l’elenco dei fix rilasciati per ogni sistema.
https://github.com/phonegap/phonegap/blob/master/changes.txt

Phonegap: richiamare l’app mappe dell’iPhone

Wednesday, March 23rd, 2011

Nello sviluppo di una nuova versione dell’applicazione A.I.S.Mo Info, ho voluto inserire una nuova feature per facilitare la ricerca e la localizzazione delle strutture di riferimento (Ospedali e centri medici) che si occupano di diversi aspetti riguardanti la malattia.

Cercando sul wiki di phonegap, si trovano alcuni interventi che spiegano come aprire l’applicazione map con link del tipo “openmap:”  metodi che non sono mai riuscito a far funzionare sul mio dispositivo e soprattutto non funzionano neanche sul simulatore.

Il metodo che ho trovato e implementato, consiste nel modificare il metodo webView nel delegate della applicazione creata, in modo da intercettare il link al sito maps.goggle.com.

[sourcecode language=”objc”]
– (BOOL)webView:(UIWebView *)theWebView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType) navigationType {
if ([[[request URL] absoluteString] rangeOfString:@"http://maps.google.com].location != NSNotFound) {
// Open in native Maps App
[[UIApplication sharedApplication] openURL:[request URL]];
return NO;
}
else
return [ super webView:theWebView shouldStartLoadWithRequest:request navigationType:navigationType ];
}
[/sourcecode]

Questo metodo ovviamente funziona solo per iPhone, per android è necessario implementare un qualche altro tipo di meccanismo.
Una nota sul Build service di phonegap: adesso è possibile compilare l’applicazione anche per iOS previo caricamento di un certificato da sviluppatore e di un provisioning profile

[iframe src=”http://rcm-it.amazon.it/e/cm?lt1=_blank&bc1=000000&IS2=1&bg1=FFFFFF&fc1=000000&lc1=0000FF&t=ac20blo-21&o=29&p=8&l=as4&m=amazon&f=ifr&ref=ss_til&asins=1849515360″ width=”121px” height=”240px” scrolling=”no” marginwidth=”0″ marginheight=”0″ frameborder=”0″] [iframe src=”http://rcm-it.amazon.it/e/cm?lt1=_blank&bc1=000000&IS2=1&bg1=FFFFFF&fc1=000000&lc1=0000FF&t=ac20blo-21&o=29&p=8&l=as4&m=amazon&f=ifr&ref=ss_til&asins=111815665X” width=”121px” height=”240px” scrolling=”no” marginwidth=”0″ marginheight=”0″ frameborder=”0″]

Phonegap Build Service

Friday, December 10th, 2010

Ho già parlato di phonegap in un precedente post ed essendo un framework, necessita un ambiente di sviluppo per poter creare i pacchetti da rilasciare: grazie a questo servizio “cloud” non sarà piu’ necessario avere hardware e software per rilasciare una applicazione sui vari dispositivi mobili.

Avendo già rilasciato una applicazione basata su phonegap (A.I.S.Mo. Info) per iPhone,  ho riutilizzato quanto in precedenza sviluppato; lo zip contenente tutte le pagine html, i css e il javascript è stato caricato sul sito build.phonegap.com. (del codice originale ho eliminato solo alcuni riferimenti ad admob)

 

Finito l’upload parte automaticamente la compilazione per le 4 piattarforme attualmente supportate (Blackberry,WebOS,android,Symbian)

Dopo qualche minuto il risultato

 

Selezionando il titolo dell’applicazione, è possibile visualizzare e scaricare le applicazioni tramite i QR code

 

Le applicazioni create sono state poi testate su un Nokia e51 (schermo troppo piccolo!!!) e su un Ideos con android 2.2 (ottimo!!)

Mancanze della beta:

  • iOS non ancora supportato
  • non vengono gestiti i certificati per un rilascio definitivo (è una beta e non è fatta per un rilascio effettivo) è necessario quindi abilitare l’esecuzione di applicaizoni non firmate.
  • vari bug in giro (es icone non visualizzate)

C’è da lavorare  ma promette bene.

Phonegap tutorial – installazione

Thursday, September 30th, 2010

La mia prima applicazione rilasciata su appStore utilizza phoneGap.

PhoneGap è un framework crossplatform opensource che permette di costruire applicazioni per dispositivi portatili (nel nostro caso iPhone) usando HTML e javascript. Esiste anche per android, blackberry, symbian e palm.

XCode è comunque necessario per creare e pacchettizzare l’applicazione definitiva per l’appStore. E’ inoltre necessario un Mac Intel con Leopard o Snow Leopard.

Passiamo ora all’installazione di PhoneGap.

Il primo passo è di scaricare e compilare il codice per creare il template XCode di PhoneGap, successivamente vedremo come creare e personalizzare una applicazione.

Per poter scaricare il codice sorgente, è necessario che GIT sia installato sul nostro sistema (git è un sistema di versioning alla stregua di svn o cvs, ndr in maniera semplicistica) a questo link potete scaricare l’installare

Aprite un terminale, posizionatevi nella vostra cartella di lavoro preferita e digitate queste linee di codice:

git clone git://github.com/phonegap/phonegap-iphone.git

Una volta scaricati i sorgenti, entrare nella directory creata e digitare questi altri comandi:

git submodule init
git submodule update
make

Verificare che XCode si chiuso e poi eseguire da Finder il PhoneGapInstaller.pkg.

Finita l’installazione aprire XCode e creare un nuovo progetto selezionando PhoneGap dall’elenco degli User Templates.

Prima di procedere con lo sviluppo, se avete un xCode con sdk iOs4.x dovrete con ogni probabilità selezionare il BASE SDK, facendo doppio click sul nome progetto ed  entrando nella sezione build->architetture

Selezionate iPhoneSimulator  e adesso potete lanciare la vostra applicazione.

A questo punto potrete creare le vostre pagine html/css/js  all’interno della cartella www del vostro progetto.

Nota:

Nell’area TOOLS del sito phoneGap, esiste un simulatore che permette di testare in locale (e anche su macchine windows)   l’applicazione scritta con questo framework. Inoltre il simulatore permette di provare anche l’accellerometro e il GPS.


 

Prima applicazione in fase di review su appStore: A.I.S.Mo. Info

Thursday, September 16th, 2010

La mia prima applicazione per iPhone stata approvata!!!
L’applicazione si chiama “A.I.S.Mo. Info” ed è una applicazione divulgativa sulla Sindrome di Moebius, una malattia rara.

L’Associazione Italiana Sindrome di Moebius Onlus è una organizzazione senza fini di lucro fondata da genitori che si sono uniti con lo scopo di combattere la Sindrome di Moebius ed altresì di promuovere in Italia lo sviluppo e la diffusione della ricerca scientifica nel campo della diagnosi e della cura della Sindrome di Moebius, nonché di favorire il miglioramento dei servizi e dell’ assistenza socio-sanitaria in favore dei bambini colpiti dalla Sindrome di Moebius e delle loro famiglie, con conseguente progressiva collaborazione con le Associazioni e gli Istituti operanti in Italia e all’estero e l’adeguamento ottimale del settore.

L’applicazione è sviluppata usando Phonegap: un framework multipiattaforma.

Ecco il link per scaricare l’applicazione.