Slide della sessione di Piero Sbressa e Carmelo La Monica a Torino il 20 Matzo 2014

1. Windows Phone App Studio
Torino, 20 Marzo 2014

2. Breve presentazione su di noi
● Piero Sbressa - @pieer11
http://pieer11.wordpress.com/
pierosbressa@crystalweb.it
● Carmelo La Monica - @CarmeloLaMonica
http://community.visual-basic.it/carmelolamonica/
carmelolm78@live.it

3. Visual Basic Tips & Tricks
Siamo iscritti anche alla community
Visual Basic Tips & Tricks.
Articoli, forum, blogs, tips and tricks
su Visual Basic e VB.NET
www.visual-basic.it

4. Cosa è Windows Phone App Studio
● Un tool per creare applicazioni per WP 8
● Non serve avere Visual Studio
● Basta solo la connessione ad internet
● Anteprima dell'app in tempo reale

5. Cosa (e come) possiamo fare con Wp App Studio
● Solo 5 passaggi:
1) Scelta del Template;
2) Creazione di tutto il contenuto della nostra applicazione;
3) Scelta della grafica , sfondo , colori , ecc…;
4) Scelta delle Tile ( Flip , Cycle o Iconic Template).
5) Download del pacchetto e della solution

6. Che tipo di App possiamo creare? Fase 1: Template
● Si parte da http://appstudio.windowsphone.com/ e
loggandosi col proprio Microsoft Account
● abbiamo a disposizione ben 22 templare tra i quali:
Empty App (applicazione vuota), myCity, Catalog,
Contoso LTD
Le app create con qualunque template, sono del tipo
«panorama»

7. Le fasi per creare l’App: 2 - Content
- 3 tipi diversi di sezioni:
1) Main (massimo 6 elementi, diversi in base all’App)
2) Basic (uguale per tutte le App)
3) Advanced (uguale per tutte le App)

8. Le fasi per creare l’App: 2 - Content – Sections
- Sezioni principali create automaticamente
- Noi possiamo eliminare/aggiungere elementi
- Configurazione semplicissima dei dati

9. Le fasi per creare l’App: 2 - Content - Layout
- 9 layout diversi
- 6 pagine dei dettagli diversi
- Ogni modifica la vediamo in tempo reale
- Possibilità di abilitare PinToStart e TextToSpeech

10. Le fasi per creare l’App: 2 - Content – Data (1)
- Per gli RSS basta semplicemente indicare l’Url dei feed
- Per Bing, basta semplicemente dire cosa e in quale
paese cercare
- Per Flickr e Youtube basta indicare se aprire la pagina
con le foto e i video dell’utente inserito oppure con la
ricerca di cosa abbiamo inserito nella casella di testo.
- Databinding in automatico

11. Le fasi per creare l’App : fase 2 Content – Data (2)
- Possiamo importare il datasource tramite file csv
- Possiamo esportare il datasource in formato csv
- Possiamo modificare le righe esistenti
- Possiamo inserire nuove righe
- Possiamo cancellare le righe che vogliamo

12. Le fasi per creare l’App : fase 2 Content – Data (3)
Dove sono memorizzati i dati?
- Static Resources (data is in the app) nel file risorse
- Dynamic Resources (data in the cloud) nel portale
winappstudio.com al quale viene aggiunto l’id del
datasource e l’id dell’app e scaricato nell’Isolated
Storage del telefono come file .json.

13. Le fasi per creare l’App : fase 2 Content – Data (4)
- Static Resources (data is in the app) nel file risorse.
Per modificare i dati dovremo rigenerare l’App e
rimandarla in certificazione. Vale anche per le ricerche in
Bing, Youtube e l’url degli RSS.

14. Le fasi per creare l’App : fase 2 Content – Data (5)
- Dynamic Resources (data in the cloud) nel portale
winappstudio.com al quale viene aggiunto l’id del
datasource e l’id dell’app e scaricato nell’Isolated
Storage del telefono come file .json.
Possiamo modificare il datasource
senza rigenerare la solution

15. Le fasi per creare l’App: 3 - Themes.
Abbiamo a disposizione tre tipologie di Themes :
- Custom Style (default): possiamo personalizzare
Background, Foreground e colore dell’App Bar
- Dark Style (sfondo nero)
- Light Style: (sfondo bianco)

16. Le fasi per creare l’App: 4 - Tiles (1)
Tipi di Tiles:
● Flip template
● Cycle template
● Iconic template

17. Le fasi per creare l’App: 4 - Tiles (2)
Flip template:
- Images:
● Small 160 x 160
● Normale 340x340
- possibile titolo aggiuntivo sul retro della tile
- possibilità di inserire un immagine sul retro della Tile
con formato 340x715px.

18. Le fasi per creare l’App: 4 - Tiles (3)
Cycle template:
- Images:
● Small 160 x 160
● Normale 340x340
- possibile titolo aggiuntivo sul retro della tile

19. Le fasi per creare l’App: 4 - Tiles (4)
Iconic template:
- Images:
● Small 160 x 160
● Normale 340x340
● Wide 692x337
- possibile titolo aggiuntivo

20. Le fasi per creare l’App: 5 – Publish Information
- Se ci sono errori o avvisi vengono segnalati
- Possiamo inserire titolo e descrizione nello Store
- Possiamo scegliere il linguaggio
- Possiamo includere l’about page
- Possiamo includere l’ads di Pubcenter (da inserire gli id
nel progetto in Visual Studio)
- Possiamo inserire l’icona dell’App

21. Scheda My Projects
- Possiamo in qualunque momento vedere lo stato di
avanzamento della nostra App.
- Possiamo vedere quali e quanti progetti abbiamo
creato, se sono completati e generati, o meno.
- Ricordarsi a ogni modifica di cliccare sul pulsante
«SAVE». Diversamente non si potrà procedere alle
successive fasi di lavorazione.

22. Abbiamo quasi finito sul portale
Cosa fare dopo?
- Possibilità di scaricare la solution per Visual Studio (VS
2012 e VS 2013)
- Solution anche per Windows 8.1 (solo in VS 2013)
- Possibilità di scaricare l’XAP
- Creazione del QR Code
- Possibilità di condividere via email e sui social network

23. Apriamo il progetto in Visual Studio
- Com’è strutturato il progetto (MVVM)
- Analisi del progetto in Visual Studio
- Cosa ha generato WP App Studio
- Come viene caricato il datasource

24. Modifichiamo il progetto in Visual Studio
- Cambiamo titoli delle pagine
- Cambiamo i dati del datasource
- Cambiamo qualche immagine
- Ricompiliamo e rimandiamo in certificazione, questa
volta però senza passare per WP AppStudio perché
abbiamo eseguito delle modifiche al codice che ha
generato.

25. Questions & Answers
Q & A

26. Grazie e arrivederci
Grazie e alla prossima
Mandateci i feedback 