Vi
mostro in breve come creare un'app mobile Android o iOS in 10 minuti,
senza scrivere codice con uno dei servizi di Bluemix: la Mobile Console Questo nuovo servizio è uno strumento per realizzare in pochissimo tempo un'app mobile completa, senza dover scrivere codice.
Al momento è sufficientemente maturo per realizzare app a supporto di eventi, che possano servire come accesso a liste di dati ecc.
Durata: 15 minuti
Difficoltà: Beginners
Il problema:
C'è un grande evento sportivo nella nostra città, molti stadi e palestre impegnati ad ospitarlo.
Vogliamo un'app con la quale aiutare i nostri amici a tener traccia dei singoli eventi in modo che sia facile raggiungere quelli di maggiore interesse.
(Ovviamente questa app si presterebbe ad elencare i contenuti anche di differenti eventi, come conferenze, eventi musicali ecc)
Iniziamo!
1) Creazione di un progetto del servizio Bluemix Mobile
- Entrate nel vostro Bluemix, selezionate il vostro Space preferito, e cliccate nella voce Console, selezionando poi Mobile:
2) Creazione di un'app
- Vi viene mostrata una pagina Projects (che poi risulterà contenere la lista delle vostre app)
- Cliccate su New Project (in alto a destra)
Si aprirà la seguente pagina:
- In essa potrete selezionare un template già costruito oppure il template vuoto. Selezionamo quello vuoto (il primo, con la schermata bianca).
- Io ho chiamato la mia app: Olimpy1
- Scrivete il nome da dare all'app e cliccate Create (a destra)
comparirà l'editor:
La prima cosa da fare è creare la landing Page che vorremo contenesse 2 scelte: Eventi e Link.
Nella pagina Eventi vogliamo la lista degli eventi sportivi, con il nome della specialità, un breve testo descrittivo, la foto del luogo, un indirizzo (via ecc) ed un link al sito della location (stadio ecc)
Nella pagina link vogliano un lista di link generici a filmati youtube, pagine linkedin, Facebook ecc.
Entrambe questi due elenchi dovranno essere passibili di ricerca.
Iniziamo a costruire la pagina iniziale:
Clicchiamo su + Screen
inseriamo un nome e clicchiamo su Menu:
Scriviamo: Sport 2016 come nome.
A questo punto abbiamo già la nostra prima pagina:
Selezioniamo la scelta di Layout a destra come indicato.
Dobbiamo inserire il primo elenco (Eventi).
Quindi clicchiamo su Add Item
Nella finestra di dialogo effettuare le selezioni come mostrato qui:
Selezionare ADD.
La nostra App inizia a prendere forma:
Ora dobbiamo creare un Data source per memorizzare gli eventi.
Dalla voce Select Data Source scegliamo Add new Data Source.
Chiamiamo Eventisport il nostro datasource.
Premendo Add si apre questa nuova pagina
Selezioniamo Edit Columns e creiamo il profilo desiderato così come in figura:
Selezioniamo Save Changes
Diamo conferma e poi selezioniamo View Data Table e poi Add Row:
A questo punto inseriamo un paio di righe di dati che ci aiuteranno a fare meglio la nostra app.
Un esempio:
Ora selezioniamo a sinistra Eventi List:
E proseguiamo con la progettazione della maschera di lista:
Effettuiamo le selezioni indicate - Notiamo che cliccando sui singoli campi in grigio, si potrà selezionare quale campo del datasource associarvi. Io ho scelto Nome e Tipo
Vedremo sulla destra un prototipo di come verrà il risultato finale:
Ora realizziamo la pagina di dettaglio degli eventi, che si aprirà quando selezioneremo un elemento della lista appena costruita.
Clicchiamo quindi su Eventi Details a sinistra e si apre un altro editor:
Associamo opportunamente i campi del data source, eventualmente assegniamo delle azioni all'evento 'On Tap' come navigazioni ad un url o su una mappa e la prima parte della nostra app è fatta.
Ritorniamo al menu principale (Sport 2016) e selezioniamo Add Item per creare la pagina di lista e di dettaglio dei link
Si procede allo stesso modo creando le 2 pagine ed il datasource.
Una volta finito, selezioniamo il pulsante blu GET MY APP in alto destra e si avvierà la compilazione automatica della nostra app che potremo ottenere per Android e iOS.
Per Android ovviamente risulta più agevole e alla fine della compilazione (un minuto circa di attesa) possiamo scaricare il sorgente generato, l'APK e cliccando su Try IT avremo il QR code da cui scaricare direttamente l'app sul nostro smarphone.
Buon divertimento!
