Scarica la nostra App

iSpazio app

Resta in contatto con noi

Ascolta il nostro Podcast

ispazio podcast

Subscribe Now

* You will receive the latest news and updates on your favorite celebrities!

Trending News

iPhone

DashCode Guides #1 – Come Sviluppare WebApp 

senza-titolo-541

Contenuto bloccato. Devi accettare i cookies per visualizzare questo contenuto.

Benvenuti nel mondo di DashCode. Io sono Andrea Corsini, sviluppatore di Dames e Lottery, e ho deciso di scrivere una serie di guide per guidarvi (scusate il gioco di parole) alla conoscenza di DashCode. Partiremo dai fondamenti e dall’interfaccia grafica del programma per arrivare, in più puntate, a creare WebApp, Applicazioni Native e LockScreen animate.

Requisiti:

  • Developer Tools 3.0 (Xcode, DashCode, iPhone Simulator)

Obiettivi:

  • Conoscere i fondamenti di DashCode
  • Sapere creare una semplice webapp

Procedimento:

1. Apriamo DashCode, creaiamo un nuovo progetto, scegliamo Web Application e poi Ad Hoc.

2. In alto vediamo la toolbar in cui sono presenti i pulsanti “Esegui” e “Metti in pausa”. Più a destra poi ci sono i pulsanti “Inspector” e “Libreria”.

3. Premiamo libreria e vedremo comparire una secoda finestra.

4. Proviamo ad inserire (con un Drag&Drop) l’elemento che si chiama Forma Rettangolare e vedremo che portandolo all’interno del documento compariranno delle linee guida blu, che indicheranno  la posizione centrale.

5. Inseriamo poi un’immagine sopra questo e vediamo che di nuovo compaiono le linee blu. Inoltre DashCode vi impedirà di uscire al di fuori dell’area dal pulsante.

6. Adesso passiamo alla sezione testo. Quindi tornate alla libreria, cercate l’elemento Text, ed inseritelo nella “pagina”.

7. Modifichiamo il testo con una scritta a nostro piacere e poi modifichiamone le impostazioni, premendo il pulsante Inspector e muovendoci nella sezione Testo…

8. Da lì modifichiamo tutti i parametri che desideriamo e otterremo qualcosa di simile all’immagine sotto.

Poi aggiungiamo un Riquadro arrontondato dietro alla scritta per migliorarne l’effetto visivo.

9. Ora lasciamo l’area estetica e passiamo ad occuparci del Codice: Nella finestra della Libreria dai cui prendiamo i vari elementi, passiamo nel Tab “Codice”. Vedremo che qui sono riportati gli script più importanti e basilari che una webapp può contenere.

Ritorniamo nella sezione “Parti” e da lì inseriamo un Pulsante losanga, modifichiamone il testo e le dimensioni, poi premiamoci sopra con il tasto destro e clicchiamo su Eventi -> onclick.
Comparirà un messaggio PopUp che ci chiede come vogliamo chiamare questo evento, intitoliamolo “iSpazio_handler”.

10. Finalmente arriva il momento di inserire il codice; appena avremo premuto “Aggiungi”, si aprirà l’editor e ci chiederà di inserire il codice per questo evento. Facciamo sì che questo pulsante rimandi al sito di iSpazio, quindi inseriamo:

document.location = “http://www.ispazio.net”;

Salviamo il progetto con un nome qualunque, e vediamolo in azione, premendo il pulsante “Esegui” e l’iPhone Simulator

ll lavoro da noi fatto può essere facilmente trasformato in una App nativa o in una LockScreen animata, ma questo lo vedremo nello prossima puntata ed andremo avanti con un progetto un pò più complicato.

Scarica la guida in formato PDF

Andrea Corsini per iSpazio.net

Contenuto bloccato. Devi accettare i cookies per visualizzare questo contenuto.

Related posts

Commenti

Informativa

Questo sito o gli strumenti terzi da questo utilizzati si avvalgono di cookie necessari al funzionamento ed utili alle finalità illustrate nella cookie policy.

Se vuoi saperne di più o negare il consenso a tutti o ad alcuni cookie, consulta la cookie policy.

Chiudendo questo banner, scorrendo questa pagina, cliccando su un link o proseguendo la navigazione in altra maniera, acconsenti all’uso dei cookie.