EtnaDev 2015 - Windows Bridge

45
Windows Bridge Porta il tuo codice in Windows indipendentemente dalla destinazione per cui era pensato. “Chi si ferma è perduto !” (cit.)

Transcript of EtnaDev 2015 - Windows Bridge

Page 1: EtnaDev 2015 - Windows Bridge

Windows BridgePorta il tuo codice in Windows

indipendentemente dalla destinazione per cui era pensato.

“Chi si ferma è perduto!” (cit.)

Page 2: EtnaDev 2015 - Windows Bridge

Sponsor

Grazie a

Page 3: EtnaDev 2015 - Windows Bridge

PATERNO’ GAETANO

Mail: [email protected]

Facebook: gaetano.paterno.77

Page 4: EtnaDev 2015 - Windows Bridge

Con Windows 8, Microsoft ha introdotto Windows Runtime (WinRT), un'evoluzione dell’appmodel di Windows, che doveva essere un'architettura applicativa comune, ma non lo è stato del tutto.Al rilascio di Windows Phone 8.1 è stato effettuato l'allineamento di Windows Runtime tra Windows Phone 8.1 e Windows. Gli sviluppatori hanno quindi potuto creare app universali di Windows 8 destinate sia a Windows che a Windows Phone con una base di codice condivisa.

Page 5: EtnaDev 2015 - Windows Bridge

Windows 10 introduce la piattaforma UWP (Universal Windows Platform), che evolve ulteriormente il modello di Windows Runtime e lo integra in Windows 10.

Essendo parte integrante di Windows 10, UWP offre ora una piattaforma per appcomune, disponibile su tutti i dispositivi che lo eseguono.

Grazie a questa evoluzione, le app destinate alla piattaforma UWP possono chiamare non solo le API WinRT comuni per tutti i dispositivi, ma anche le API specifiche, incluse

le API Win32 e .NET, della famiglia di dispositivi in cui viene eseguita l'app.

Page 6: EtnaDev 2015 - Windows Bridge

La piattaforma UWP offre un livello di API di base garantito su tutti i dispositivi. I controlli dell'interfaccia utente adattivi e i nuovi pannelli di layout introdotti in UWP, aiutano a personalizzare l’interfaccia utente per un'ampia gamma di risoluzioni dello schermo.Inoltre, con un singolo pacchetto dell'app, Windows Store offre un canale di distribuzione unificato per raggiungere ogni tipo di dispositivo su cui può essere eseguita l’app.

Page 7: EtnaDev 2015 - Windows Bridge

Porta il tuo codice in Windows indipendentemente dalla destinazione

per cui era pensato il tuo codice.

Page 8: EtnaDev 2015 - Windows Bridge

WEB

Per i siti Web o le app Web, è possibile usare Visual Studio 2015 per creare facilmente un'app di Windows 10 che raccoglie in un pacchetto il tuo sito Web o la tua app Web per la pubblicazione in Windows Store. Questo tipo di app, nota come Hosted Web App, può essere usata per chiamare le API UWP direttamente dal codice JavaScript del tuo sito Web e creare un'esperienza utente più coinvolgente.

Page 9: EtnaDev 2015 - Windows Bridge

WINDOWS

Se hai un'app in Silverlight per Windows Phone, è possibile usare il bridge Silverlight di Mobilize.Net per trasferirla sulla piattaforma UWP. Questo bridge è attualmente disponibile come anteprima per gli sviluppatori e offre un subset iniziale dei mappingdi piattaforma per Silverlight e UWP. Se hai un'applicazione .NET o basata su Win32, "Project Centennial" renderà possibili la creazione di un pacchetto per l'applicazione e la pubblicazione in Windows Store.

Page 10: EtnaDev 2015 - Windows Bridge

ANDROID

Se hai un'app per Android, puoi usare il bridge Android per renderla disponibile per i dispositivi Windows 10 Mobile usando le estensioni per Android SDK e vari ambienti IDE noti per Android. Per la maggior parte delle app sono necessarie poche modifiche al codice, se non nessuna.

Page 11: EtnaDev 2015 - Windows Bridge

iOS

Se hai un'app per iOS, puoi usare il bridge iOS per creare una versione UWP della tua appcon Visual Studio 2015 e il codice Objective-C esistente. Puoi estendere il codice esistente con le funzionalità native di Windows, in base alle tue esigenze.

Page 12: EtnaDev 2015 - Windows Bridge

Per i siti Web o le app Web, puoi usare Visual Studio 2015 per creare facilmente un'app di Windows 10 che raccoglie in un pacchetto il tuo sito Web o la tua Web App per la

pubblicazione in Windows Store. Questo tipo di app, nota come Hosted Web Apps, può essere usata per chiamare le API UWP direttamente dal codice JavaScript del tuo sito Web e

creare un'esperienza utente più coinvolgente.

Page 13: EtnaDev 2015 - Windows Bridge

Hosted Web Apps

Attraverso ACURs si è in grado di dare agli URL remoti un accesso diretto alle API di Windows Universal da HTML, CSS e JavaScript. È possibile definire nel pacchetto app manifest l'insieme delle URL che compongono la Hosted Web Apps, definendo, per ognuna, il livello di accesso alle API della piattaforma. Le regole dovrebbero includere la pagina iniziale del vostro app e le altre pagine che si desidera includere come pagine app. Opzionalmente, è anche possibile escludere URL specifici.

SECURITY

Mantenere la vostra applicazione sicura con ACURs (Setting Application Content URI Rules)

Page 14: EtnaDev 2015 - Windows Bridge

Hosted Web Apps

Ci sono diversi modi di specificare gli URL nelle regole:• Un hostname esatto.• Un nome host per il quale una URI, con qualsiasi

sottodominio di quel nome host, è inclusa o esclusa.• Un URI esatto.• Un URI esatto che contenere dei parametri.• Un percorso parziale e un jolly per indicare una

particolare estensione di file per una regola da includere.• I percorsi relativi per escludere le regole.

Se l'utente passa a un URL che non è incluso nelle regole, quindi Windows apre l'URL di destinazione in un browser.

SECURITY

Mantenere la vostra applicazione sicura con ACURs

Page 15: EtnaDev 2015 - Windows Bridge

Hosted Web Apps

Mantenere la vostra applicazione sicura con ACURs

Ecco alcuni esempi di ACURs. javascript StartPage="http://contoso.com/home"> <uap:ApplicationContentUriRules><uap:Rule Type="include" Match="https://contoso.com/" WindowsRuntimeAccess="all" /><uap:Rule Type="include" Match="https://*.contoso.com/" WindowsRuntimeAccess="all" /><uap:Rule Type="exclude" Match="https://contoso.com/excludethispage.aspx" /> </uap:ApplicationContentUriRules>

SECURITY

Page 16: EtnaDev 2015 - Windows Bridge

Hosted Web Apps

Se un URL è definito entro i limiti dell’app (ACURs), può chiamare le Windows Runtime API con JavaScript utilizzando l'attributo "WindowsRuntimeAccess".Lo spazio dei nomi di Windows verrà così iniettato e sarà presente nel motore di script quando un URL, con accesso appropriato, viene caricato nell’Hosted Web App. Questo rende le Universal Windows API direttamente disponibili per gli script dell’app.

SECURITY

Mantenere la vostra applicazione sicura con ACURs

Page 17: EtnaDev 2015 - Windows Bridge

Hosted Web Apps

Mantenere la vostra applicazione sicura con ACURs

A tal fine è necessario specificare per ogni URL il (WindowsRuntimeAccess="<<level>>”), nei ACURs, con uno di questi valori:

• all: il codice JavaScript remoto ha accesso a tutte le API UWP e alle risorse incluse nel pacchetto.

• allowForWeb: il codice JavaScript remoto ha accesso soltanto alle risorse incluse nel pacchetto.

• none: Default. L'URL specificato non ha accesso alla piattaforma.

SECURITY

Page 18: EtnaDev 2015 - Windows Bridge

Hosted Web Apps

Ecco un esempio di limiti:

javascript<uap:ApplicationContentUriRules><uap:Rule Type="include" Match="http://contoso.com/" WindowsRuntimeAccess="all" /></uap:ApplicationContentUriRules>

SECURITY

Mantenere la vostra applicazione sicura con ACURs

Page 19: EtnaDev 2015 - Windows Bridge

Hosted Web Apps

Crea ora la tua applicazione

Creare unaBlank App Javascipt

- Lanciare Visual Studio 2015- Cliccare su “File -> New Project”

e sekezionare “JavaScript -> Windows -> Windows Universal -> Blank App (Windows Universal)”

Page 20: EtnaDev 2015 - Windows Bridge

Hosted Web Apps

Crea ora la tua applicazione

Cancellare i contenuti HTML/CSS/JS

- Poiché si tratta di una applicazione web in cui il contenuto viene servito da un server remoto, non saranno necessari la maggior parte dei file delle applicazioni locali che vengono forniti dal template JavaScript.

- Cancellare le risorse HTML, JS e CSS. Tutto ciò che serve per l’app è il package manifest (dove si configura la app) e le risorse images.

Page 21: EtnaDev 2015 - Windows Bridge

Hosted Web Apps

Crea ora la tua applicazione

Impostare l’URL della pagina iniziale URL nel package

manifest

- Aprire il file package.appxmanifest- Sotto la scheda Applicazione trovare il campo StartPage- Sostituire "default.html" con http://codepen.io/seksenov/pen/wBbVyb/?editors=101

Page 22: EtnaDev 2015 - Windows Bridge

Hosted Web Apps

Crea ora la tua applicazione

Definire i limiti della vostra Web App

- Nella scheda Content URIs definire le URL che compongono il web app.

- Aggiungere le URI:http://codepen.io/seksenov/pen/wBbVyb/?editors=101http: //*.codepen.io/

- Impostare il WinRT Access a ALL per entrambi gli URL

Page 23: EtnaDev 2015 - Windows Bridge

Hosted Web Apps

DEMO

Page 24: EtnaDev 2015 - Windows Bridge

Hosted Web Apps

Integrare i comandi vocali di Cortana

È possibile usufruire di Cortana specificando un file Voice Command Definition (VCD) nella pagina html.Il file VCD è un file XML che mappa i comandi di frasi specifiche, per esempio, un utente potrebbe toccare il pulsante Start e dire “Mio calendario, mostra appuntamenti di oggi” sia per lanciare l'applicazione MioCalendario e per passare alla pagina con gli appuntamenti del giorno.

Page 25: EtnaDev 2015 - Windows Bridge

Aggiungere un tag <meta> nell’<head> della pagina html.Quando si aggiunge un tag <meta> che elenca il percorso del file VCD, Windows lo scarica e lo registra automaticamente.Ecco un esempio dell'uso del tag in una pagina html:<meta name="msapplication-cortanavcd" content="http://contoso.com/vcd.xml"/>

Hosted Web Apps

Integrare i comandi vocali di Cortana

Page 26: EtnaDev 2015 - Windows Bridge

Hosted Web Apps

Integrare i comandi vocali di Cortana

Oltre a utilizzare i comandi vocali in Cortana per accedere alle funzioni di sistema, è anche possibile estendere Cortana con caratteristiche e funzionalità di una applicazione in background, utilizzando i comandi vocali che specificano un'azione o un comando da eseguire all'interno della app.Quando un'applicazione gestisce un comando vocale in background è possibile visualizzare un feedback sulla finestra di Cortana e comunicare con l'utente utilizzando la voce di Cortana.Ad esempio, possiamo aggiungere un’appuntamentonella nostra app MioCalendario, comunicando vocalmente i dati da inserire a Cortana.

Page 27: EtnaDev 2015 - Windows Bridge

Hosted Web Apps Prepariamo il file VCD

Ecco un file VCD che definisce un comando vocale per l'applicazione MioCalendario.<?xml version="1.0" encoding="utf-8"?><VoiceCommands xmlns="http://schemas.microsoft.com/voicecommands/1.2”>

<CommandSet xml:lang=“it-IT” Name=“MioCalendarioCommandSet_it-IT“><CommandPrefix> Mio calendario, </CommandPrefix><Example> mostra appuntamenti di oggi </Example><Command Name=“visualizzaCalendario”><Example> mostra appuntamenti di oggi </Example><ListenFor> mostra appuntamenti {giornate} </ListenFor><Feedback> Sto mostrando gli appuntamenti {giornate} </Feedback><Navigate/>

</Command><PhraseList Label=“giornate”><Item> di oggi </Item><Item> di domani </Item><Item> della settimana </Item><Item> del mese </Item>

</PhraseList></CommandSet></VoiceCommands>

Page 28: EtnaDev 2015 - Windows Bridge

Hosted Web Apps Prepariamo il file VCD

Come per qualsiasi file XML, anche un file VCD segue le linee guida di riferimento, per gli elementi di markup XML e gli attributi utilizzati nei file VCD, per specificare i vincoli di riconoscimento.

Per approfondimenti sul “Voice Command Definition (VCD) elements and attributes v1.2” vitiate il sito https://msdn.microsoft.com/en-us/library/windows/apps/dn954977.aspx.

Page 29: EtnaDev 2015 - Windows Bridge

Dinamicamente la modifica di una lista frasi, in fase di esecuzione, può essere utile se il comando vocale è specifico per un compito che coinvolge una sorta di preferiti definiti dall'utente o dati transitori nell’app.Ad esempio, nell’applicazione MioCalendario l’utente inserirà i propri appuntamenti, e si desidera che sia in grado di avviare l'applicazione pronunciando il nome app seguito da "Mostra appuntamento <meta>". Non è necessario creare un elemento ListenFor separato per ogni possibile appuntamento. Invece, è possibile popolare dinamicamente PhraseList in fase di esecuzione, magari, con il titolo dell’appuntamento creato dall'utente.

Hosted Web Apps Prepariamo il file VCD

Page 30: EtnaDev 2015 - Windows Bridge

Nel file javascript, specificare il codice da eseguire all’attivazioni dei comandi vocali.Ad esempio, l’applicazione MioCalendario potrebbe passare a una pagina specifica e visualizzare gli appuntamenti secondo il giorno richiesto.

if (typeof Windows !== 'undefined' && typeof Windows.UI !== 'undefined' &&typeof Windows.ApplicationModel !== 'undefined')

{Windows.UI.WebUI.WebUIApplication.addEventListener("activated", function (args) {var activation = Windows.ApplicationModel.Activation;if (args.kind === activation.ActivationKind.voiceCommand) {var speechRecognitionResult = args.result;var textSpoken = speechRecognitionResult.text;if (speechRecognitionResult.rulePath[0] === "mostra appuntamenti di oggi”)console.log("mostra appuntamenti di oggi");

else { console.log("No valid command specified");

});}

Hosted Web Apps Il codice javascript

Page 31: EtnaDev 2015 - Windows Bridge

Hosted Web Apps

DEMO

Page 32: EtnaDev 2015 - Windows Bridge

Problemi o quesiti?

Visitate i siti:- http://microsoftedge.github.io/WebAppsDocs/

en-US/win10/HWA.htm- https://microsoftedge.github.io/WebAppsDocs/

en-US/win10/CreateHWA.htm- http://microsoftedge.github.io/WebAppsDocs/

en-US/win10/HWAfeatures.htm

Hosted Web Apps

Page 33: EtnaDev 2015 - Windows Bridge

In questa sessione andremo a vedere un po' più approfonditamente ciò che è

Windows Bridge for iOS(precedentemente denominato 'Progetto Islandwood'), come consente agli sviluppatori iOS di portare le loro competenze e il codice Objctive-C per Windows e perché Microsoft a deciso di dare questo particolare bridge di Windows disponibile come open-source su GitHub.

Page 34: EtnaDev 2015 - Windows Bridge

Windows Bridge for iOS e’stato rilasciato su GitHubin concomitanza con l’evento Build 2015 nel mese di aprile.

Page 35: EtnaDev 2015 - Windows Bridge

Windows Bridge for iOS è concepito per consentire agli sviluppatori iOS di creare applicazioni Windows utilizzando il codice esistente in Objective-C e le sue

competenze. A tale scopo, questo bridge è costituito da quattro componenti:

Objective-C compilerun compilatore incluso in Visual Studio che prende

il codice Objective-C e l’ho compila in una Windows

Universal App nativa.Objective-C runtime

per fornire funzionalitàavanzate al linguaggio.

iOS API headers/libssulla base delle API di Objective-C, vengonofornite delle API che

danno un’ampia compatibilità con le API iOS.

Visual Studio IDEIntegration

infine viene fornitoun tool che importail progetto Xcode inVisual Studio 2015.

Page 36: EtnaDev 2015 - Windows Bridge

Why the bridge is not a port

L’obiettivo del bridge per iOS non è mai stato semplicemente quello di eseguire applicazioni iOS su Windows.Piuttosto l’obiettivo è aiutare a scrivere grandi applicazioni Windows che utilizzano non molto di piu’ del vostro codice già esistente e tutta la conoscenza dello sviluppatore.Naturalmente, stanno continuando a lavorare per ampliare la compatibilità con iOS.

Page 37: EtnaDev 2015 - Windows Bridge

Dietro questo obiettivo ci sono tre principi fondamentali che hanno guidato l'architettura e il design del bridge per iOS:

Accesso completoalle Windows API

rende facile utilizzodelle Windows APIall'interno di codice

Objective-C.

compatibilità iOSpermettete aglisviluppatori di

riutilizzare al massimoil codice esistentefin dove possibile.

Nessun sandboxingiOS e le API di

Windows devonoessere in grado

di lavorare insieme.

Page 38: EtnaDev 2015 - Windows Bridge

Il primo e il terzo principio sono collegati e particolarmente importanti.Il primo principio perché Windows ha un set di API completamente funzionale e ricco, che continua a crescere ed evolversi.Il terzo perché avere la possibilità di chiamare e utilizzare interamente le API di Windows sarebbe severamente limitata se il set di API sarebbero in modalità sandbox uno da altro, limitando la capacità di compilare buone applicazioni Windows in Objective-C.

Page 39: EtnaDev 2015 - Windows Bridge

Quando le API Windows e Objective-C si incontrano

Il bridge utilizza un compilatore personalizzato (clang + cl) per compilare codice sorgente Objective-C, e i file oggetti generati sono poi collegati insieme utilizzando il linker di Microsoft. Questo approccio è ottimo perché permette a Objective-C e C++/CX di poter coesistere nello stesso progetto e chiamarsi tra loro utilizzando le interfacce di C o C++.

Page 40: EtnaDev 2015 - Windows Bridge

Ad esempio, esaminiamo come è possibile richiamare in modo asincrono un browser nella vs app utilizzando il bridge:

1auto uri = ref new Windows::Foundation::Uri("http://www.example.com");

2concurrency::task<bool> launchUriOperation(Windows::System::Launcher::LaunchUriAsync(uri));

3 launchUriOperation.then([](bool success)

4 {

5 if (success)

6 {

7 // URI launched

8 }

9 else

10 {

11 // URI launch failed

12 }

13 });

Opzione 1 (invocando il browser dal codice c++/cx):

Opzione 2 (invocando la stessa API dal codice Objective-C):

[WSLauncher launchUriAsync:[WFUricreateUri:@“http://www.example.com/”] success:nil failure:nil];

Page 41: EtnaDev 2015 - Windows Bridge

XAML e UIKit: insieme all'unisono

Ora che è possibile chiamare le API di Windows da Objective-C, per non limitare l'utilizzo di tale set di API, invece di implementare un compositor separato per gli elementi iOS/UIKit, l'intera applicazione utilizza il compositor XAML, con CALayers(che sono alla base essenzialmente di ogni vista in iOS) legato agli elementi XAML corrispondenti.

Page 42: EtnaDev 2015 - Windows Bridge

Windows Bridge for iOS

DEMO

Page 43: EtnaDev 2015 - Windows Bridge

PerchéWindows Bridge for iOSè disponibile su GitHub

Microsoft ha messo a disposizione su GitHub tutti i sorgenti del framework e dei tools per permettere agli sviluppatori di contribuire in tanti modi al progetto WinObjC, come?- Segnalando un bug- Verificando la correzione dei bug- Inviando codice per la correzione di un bug- Inviando una richiesta di funzionalità- Inviando una prova di funzionalità- Dire agli altri sul progetto WinObjC- Dire gli sviluppatori quanto apprezzi il progetto

Page 44: EtnaDev 2015 - Windows Bridge

Wiki

Su GitHub è disponibile anche una pagina Wikiche guida passo-passo su come scaricare, installare e usare l’sdk ed il tool vsimporter.Il tool vsimporter consente di importare il progetto Xcode in una nuova soluzione UWP, con supporto ad Objective-C, per Windows 10.Se si vuole una soluzione per Windows 8.1, utilizzare l'opzione -format e specificare uno dei target: winstore8.1, winphone8.1 o winstore10 (winstore10 è il predefinito).Per ulteriori informazioni utilizzare l'opzione -help nella riga di comando per vedere la serie completa di opzioni supportate.

Page 45: EtnaDev 2015 - Windows Bridge

Problemi o quesiti?

Potete raggiungere il team di sviluppo in vari modi:- Tweeter @WindowsDev e segnare le

domande con #winobjc- Inviare domande sui post di StackOverflow

con il tag winobjc- Visitare il canale #winobjc su IRC

(webchat.freenode.net)

Visitate i siti:- https://dev.windows.com/it-it/bridges- https://dev.windows.com/it-it/bridges/ios- https://github.com/Microsoft/WinObjC- https://github.com/Microsoft/WinObjC/wiki

Windows Bridge for iOS