Cerca nel blog

mercoledì 21 novembre 2012

Applicazione mobile in Oracle Apex 4.2

Punto di forza della versione Oracle Application Express 4.2 è senz' altro il supporto per lo sviluppo di applicazioni mobile. 
La versione 4.2 supporta il framework jquery mobile e consente quindi lo sviluppo di applicazioni web mobile garantendo il supporto ad un largo numero di dispositivi e sistemi operativi mobile. Disponibile qui l’insieme dei dispositivi e sistemi operativi compatibili con il framework jquery mobile.
Vediamo come realizzare una semplice applicazione web mobile in Oracle Apex 4.2. 

Per la realizzazione utilizzeremo la nostra workspace di lavoro disponibile su apex.oracle.com (qui è ben discusso come iniziare a muovere i primi passi con Apex 4.2 utilizzando l'ambiente su apex.oracle.com)Definiamo la nuova web app che chiameremo Mobile_App e che avrà come user interface jquery mobile smartphone:


Creiamo nella nostra applicazione Mobile_App la pagina 1 (di tipo blank page ) che chiameremo P_Mobile e creiamo all'interno della pagina P_Mobile la html region R_Mobile la cui proprietà source sarà valorizzata con il seguente codice:




Nella proprietà region source abbiamo inserito il codice HTML5 per creare una nested list mediante il framework jquery mobile, di seguito la schermata che appare sulla piattaforma android 4.2 con smartphone galaxy nexus:





Step successivo è quello di realizzare le pagine per visualizzare la lista dei clienti ed il dettaglio del singolo cliente, utilizzeremo per tale scopo la creazione di una nuova pagina di tipo Form ed in particolare una form on table with List view.

Definiamo quindi una nuova pagina che conterrà una list view basata su di una tabella d'esempio presente (Emp, demo_customers,etc) nello schema della workspace . 
Partiamo quindi con il definire una nuova page di tipo Form-->Form on a table with List view:



inseriamo le colonne da visualizzare nella pagina che mostrerà la list view dei Clienti:




Clicchiamo su Next e ci verrà proposto di definire la detail page che conterrà il dettaglio dati relativi al cliente selezionato nella nested list view:



Non ci resta che indicare i campi da visualizzare e cliccare su Create Page 
Di seguito le schermate relative al funzionamento della web app su dispositivo mobile (Android 4.2, samsung nexus, opera browser):

Nested List relativa ai Clienti:





Dettaglio dello specifico Cliente:


Al prossimo post su............. Oracle Apex.

Salvatore Bartucci






Nessun commento:

Posta un commento