universal app in tutte le salse: phone, tablet, pc, xbox e iot

Template designed by

Universal Windows appOne app for every screen

Matteo PaganiSupport Engineer – AppConsult @ Microsoftmatteo.pagani@microsoft.com http://wp.qmatteoq.com

Agenda Cosa è cambiato

Il modello di Windows 10

Gestire l’interfaccia utente

Le nuove feature per gli sviluppatori

Easy for users to get & stay

current

Unified core Unified app platformOne Store

Un unico sistema operativo…

Windows Phone 7.5

Windows Phone 8Windows Phone 8.1

Windows 8

Xbox One

Windows on Devices

Xbox 360

Windows 8.1

ConvergedOS kernel

Convergedapp model Windows 10

…e un’unica piattaforma di sviluppo

Universal Windows platform

One Store +One Dev Center

Full Support for Existing Code

SDK +Services

Adaptive User Interface Natural

User Inputs

HolographicConsole

Surface Hub

MobileDevices

+IoT

PC

• Un progetto condiviso, due progetti specifici per Windows e Windows Phone

• Compilazione condizionale per gestire le differenze tra le piattaforme

• Due differenti pacchetti, da caricare su due Store differenti

L’approccio di Windows 8.1

Universal Windows 8.1 app

#if WINDOWS_APP ResourceLoader loader = new ResourceLoader(); string about = loader.GetString("SettingsLabel/Text"); string privacy = loader.GetString("PrivacySettings/Text"); string options = loader.GetString("Settings/Text"); ISettingsService settings = container.RegisterSettingsService(); settings.RegisterFlyoutCommand<AboutViewModel>(about); settings.RegisterFlyoutCommand<PrivacyPolicyViewModel>(privacy); settings.RegisterFlyoutCommand<SettingsViewModel>(options);#endif

• E’ una collezione di contratti ed estensioni, basata sul Windows Runtime

• Quando si crea un’applicazione si sceglie come riferimento una versione della UWP, non del sistema operativo

<Dependencies> <TargetDeviceFamily Name="Windows.Universal" MinVersion="10.0.10069.0" MaxVersionTested="10.0.10069.0" /> </Dependencies>

Universal Windows Platform

• Scompaiono il progetto condiviso e i progetti specifici per ogni piattaforma

• Niente più compilazione condizionale• Un unico Store per tutte le piattaforme• La Universal Windows Platform è disponibile

su ogni dispositivo basato su Windows 10

Un pacchetto per tutti i dispositivi

Mobile

Holographic Surface

Hub

XboxIoT

Desktop

Librerie che aggiungono funzionalità specifiche di una piattaforma alla Universal Windows Platform

Platform extension

Verifica delle capability

IsApiContractPresentIsEnumNamedValuePresentIsEventPresentIsMethodPresentIsPropertyPresentIsReadOnlyPropertyPresentIsTypePresentIsWriteablePropertyPresent

Windows.Foundation.Metadata.ApiInformation

Demo Verifica delle capability

• Un solo binario significa che l’applicazione deve adattarsi ai diversi dispositivi e dimensioni dello schermo

• Nuovi controlli e tool per creare «responsive app»

• Nuova opzione per collegare la stessa classe di code behind a diversi file XAML

Ottimizzare l’esperienza utente

• Normalmente, le transizioni da un VisualState all’altro sono gestite da codice.

• I VisualState trigger sono in grado di reagire in automatico al variare di una condizione e cambiare lo stato di un controllo.

• AdaptiveTrigger è una tipologia di trigger che reagisce al cambiamento della dimensione della finestra.

• E’ possibile creare i propri trigger personalizzati.

VisualState trigger

Demo Adaptive trigger

• Visual Studio 2015 introduce un nuovo template chiamato «XAML page»

• E’ una pagina XAML senza la corrispettiva classe di code behind.

• Approccio non consigliato, ma utile quando occorre gestire layout completamente diversi in base alla famiglia di device.

Una classe, diverse pagine XAML

Demo Device Family

• Un nuovo controllo per il layout basato su vincoli.

• E’ possibile definire la relazione tra i controlli al suo interno e il pannello stesso o gli altri controlli.

• Alcuni deli vincoli supportati:• Above• Below• LeftOf• RightOf• AlignWith

RelativePanel

Demo RelativePanel

• Benvenuto hamburger menu • E’ utilizzato per creare pattern di

navigazione.• E’ molto adatto nello sviluppo di

applicazioni responsive.• Non ci sono guideline o vincoli specifici:

usatelo solo se ha senso per la vostra applicazione.

• Differenti modalità di visualizzazione

SplitView

<SplitView DisplayMode="Inline|Overlay|CompactInline|CompactOverlay">

<SplitView.Pane><!-- Navigation Content Here --></SplitView.Pane>

<!-- Main Content Here -->

</SplitView>

SplitViewAdaptive navigation pane

• Stessi concetti base di 8.1 (Running, Activated, Suspended, etc.)

• Nuova modalità di esecuzione estesa per le applicazioni che vengono sospese:• Voglio terminare un task prima di sospendere l’applicazione• Ho bisogno di più tempo• Ho bisogno di continuare l’esecuzione in background

• Nuovi trigger per l’esecuzione di background task

Il ciclo di vita dell’applicazione

Opportunistic Background Tasks

Vengono eseguiti fintanto che ci sono risorse disponibiliNessuna garanzia di esecuzioneApplicationTrigger, MaintenanceTrigger, DeviceUseTrigger

Default Background TasksEsecuzione minima di 25 secondi garantitaTutti gli altri trigger: TimeTrigger, PushTrigger…

Le nuove funzionalità seguono comunque il principio «al centro l’utente»: no consumo eccessivo di batteria, no problemi di performance, ecc.

Gestione delle risorse

RunCancel

Mem

ory

Run

Esecuzione estesa• private async void OnSuspending(object sender, SuspendingEventArgs e)

{ var deferral = e.SuspendingOperation.GetDeferral();

using (var session = new ExtendedExecutionSession()) { session.Reason = ExtendedExecutionReason.SavingData; session.Description = "Upload Data";

session.Revoked += session_Revoked;

var result = await session.RequestExtensionAsync();

if (result == ExtendedExecutionResult.Denied) {

UploadBasicData(); }

// Upload Data var completionTime = await UploadDataAsync(session); } deferral.Complete(); }

SystemTriggerTimeTriggerMaintenanceTriggerDeviceUseTriggerDeviceServicingTriggerPushNotificationTrigger

CachedFileUpdaterTriggerDeviceConnectionChangeTriggerGattCharacteristicNotificationTriggerRfcommConnectionTriggerLocationTrigger

AppointmentStoreNotificationTriggerContactStoreNotificationTriggerEmailStoreNotificationTriggerBluetoothLEAdvertisementWatcherTriggerBluetoothLEAdvertisementPublisherTriggerDeviceWatcherTriggerActivitySensorTriggerSensorDataThresholdTriggerToastNotificationHistoryChangedTriggerToastNotificationActionTriggerApplicationTriggerMediaProcessingTriggerSocketActivityTrigger

TriggerW

indow

s 8

.1W

P 8

.1

Win

dow

s 10

• Offre la possibilità di mettere in comunicazione app differenti tramite URL

• Foreground to Foreground• Simile al modello web• Si possono invocare URL con protocolli personalizzati (eg:

twitter:qmatteoq) • Novità - l’app invocata può restiture risultati all’app chiamante

• Foreground to Background• Una sorta di “servizio”• Offre la possibilità di pubblicare un background task che può essere

chiamato da altre app• L’integrazione di Facebook e Twitter nell’hub People sfrutta questa

funzionalità

Comunicazione tra app

• Sfrutta lo stesso principio del pulsante Back di Windows Phone

• Nuovo pulsante Back virtuale disponibile nella finestra (sul desktop) o nella taskbar (su tablet)

• Stesso comportamento di Windows Phone:• Porta l’utente alla pagina precedente dell’applicazione• Comportamento differente solo quando si raggiunge la prima pagina

dell’app

Nuovo modello di navigazione unificato

PULSANTE BACK: ESEMPIO

La stessa app su Mobile e Desktop

La stessa app su Mobile e Desktop

BACK BEHAVIOR: EXAMPLE

La stessa app su Mobile e Desktop

BACK BEHAVIOR: EXAMPLE

Su desktop, il pulsante Back viene disabilitato quando si raggiunge la prima pagina dell’applicazione

La stessa app su Mobile e Desktop

BACK BEHAVIOR: EXAMPLE

Completare attività in Cortana

• Le applicazioni possono completare delle attività direttamente tramite Cortana

• Nuove funzionalità:• API per gestire le attività• Nuovi template per la UI• Nuovi modelli di interazione vocali

Here are your upcoming trips.

May 14th 2015Las Vegas

May 28th 2015San Diego

Go to Adventure Works

August 24th 2015Phoenix

Content Area

App GUI Text

App Icon

Link to your app

App Screen

Text-To-Speech (TTS)

Content Tile

A

Here are your upcoming

trips.

L’architettura per la gestione dei comandi vocali in background

2

Windows SpeechPlatform (on-device)

Call

Text

Remind

Email

Voice Command

3 6

4

5

VCD

9

Isolated Storage

Voice CommandBackground

Service

Implements Windows.

AppModel.Background.IBackgroundTask

Render XAML

7

1

App Web Service

Microsoft SpeechPlatform Service

(cloud)

A

Go to Adventure Works

Here is your trip to London

Adventure Works, show my trip to London

Application Code

8

8

Which ‘Vegas’ trip do you wanna cancel?

Here’s your trip to London

Il contenuto si adatta alla tileIl nuovo template adaptive consente al contenuto di adattarsi in base alla densità dello schermo del dispositivo. In questo modo, dispositivi con una maggiore densità saranno in grado di mostrare più contenuti rispetto a quelli con minore densità.

<tile>

<visual>

<binding template="TileMedium">

<group>

<subgroup>

<text hint-style="subtitle">John Doe</text>

<text hint-style="subtle">Photos from our trip</text>

<text hint-style="subtle">Thought you might like to see all of</text>

</subgroup>

</group>

<group>

<subgroup>

<text hint-style="subtitle">Jane Doe</text>

<text hint-style="subtle">Questions about your blog</text>

<text hint-style="subtle">Have you ever considered writing a</text>

</subgroup>

</group>

</binding>

</visual>

</tile>

Min. Med Size Max Med. Size

Dispositivi con maggiore densità sono in grado di mostrare l’anteprima di due messaggi

XML SAMPLE 1

Adaptive Tile Template

XML SAMPLE 2

Min. Med Size Max Med. Size

Il testo viene disposto su più righe, così da essere sempre leggibile

<tile>

<visual>

<binding template="TileMedium">

<text hint-wrap=“true">Microsoft HoloLens: A Sensational Vision of the PC’s Future

</text>

</binding>

</visual>

</tile>

Il contenuto si adatta alla tileIl nuovo template adaptive consente al contenuto di adattarsi in base alla densità dello schermo del dispositivo. In questo modo, dispositivi con una maggiore densità saranno in grado di mostrare più contenuti rispetto a quelli con minore densità.

Adaptive Tile Template

Nuove possibilità di interazione

XML SAMPLE 1

<toast>

<visual>

<binding template=“ToastGeneric”>

<text>Torrance Shum</text>

<text>This is…</text>

<image placement=“appLogoOverride” src=“Torrance.png” />

</binding>

</visual>

<actions>

<input id=“1" type=“text“ />

<action activationType=“background" arguments=“quickReply" hint-inputId=“1" content="" imageUri=“send.png” />

</actions>

</toast>

Il contenuto si adatta alla notifica toastIl nuovo template adaptive consente al contenuto di adattarsi in base allo stato e alla dimensione della notifica toast. In questo modo, dispositivi con una maggiore densità saranno in grado di mostrare più contenuti rispetto a quelli con minore densità.

Adaptive Toast Template

XML SAMPLE 2Azioni gestite dal sistema

<toast>

<visual>

<binding template=“ToastGeneric”>

<text>Time to leave</text>

<text>With traffic…</text>

<image placement=“inline” src=“map.png” />

</binding>

</visual>

<actions>

<input title=“Snooze for” id="snoozeTime" type="selections" defaultSelection=“5">

<selection id="5" content="5 minutes" />

<selection id="10" content="10 minutes" />

<selection id="20" content="20 minutes" />

</input>

<action activationType="system" arguments="snooze" hint-inputId="snoozeTime" content=""/>

<action activationType="system" arguments="dismiss" content=""/>

</actions>

</toast>

Il contenuto si adatta alla notifica toastIl nuovo template adaptive consente al contenuto di adattarsi in base allo stato e alla dimensione della notifica toast. In questo modo, dispositivi con una maggiore densità saranno in grado di mostrare più contenuti rispetto a quelli con minore densità.

Adaptive Toast Template

Foreground activation

Background activation

Nuovi scenari con le notifiche toast

Tap button

App launch

es

Retrieve Args

Take actions

Tap button

Task launch

es

Retrieve Args

Take actions

Nuovi scenari con le notifiche toast

Tap button

Protocol activate

s

Web/App

Protocol

System

Tap buttonSystem handles action

Stesso look & feel attraverso tutti i dispositivi

Nuove funzionalità disponibili per gli sviluppatori

Le notifiche toast vengono automaticamente inserite nell’Action CenterLe notifiche toast possono essere espanse per mostrare l’intero contenutoTraccia singole notificheElimina tutte le notifiche appartenenti all’applicazioneRimuovi un gruppo di notificheRimuovi single notificheAlarm e reminder possono essere visualizzati nell’Action Center

Action Center in Windows 10

• Nuove API per la gestione dei dati dell’utente:• Contatti• Calendario• Email• Messaggi di testo• Account personalizzati

• Funzionalità di:• Lettura• Scrittura• Ricerca• Background task e notifiche

Action Center in Windows 10

Appointments

Calls Contacts

Email Text Mssgs

UD Accounts

Tasks

Read

Search

User Controlled Privacy

App Data Store

App Controlled Security

Change Tracking

Foreground Notifications

Background Notifications

Annotating

Nuove possibilità di sviluppo

• Possibilità di riutilizzare codice Java di un’applicazione Android in una Universal Windows app

• Integrazione con le API di Windows 10 per notifiche, mappe, ecc.

• Possibilità di inviare l’APK sullo Store e ottenere un report sulla percentuale di codice da riutilizzare

• Ideale per riutilizzare business logic

Project Astoria

• Possibilità di riutilizzare codice Objective-C di un’applicazione iOS in una Universal Windows app

• Compilazione e debug di codice Objective-C da Visual Studio

• Possibilità di integrare le API di Windows 10

Project Islandwood

• Possibilità di pubblicare un’applicazione .NET / Win32 sullo Store come pacchetto AppX

• Possibilità di integrare le API di Windows 10• Ambiente di distribuzione più sicuro e

affidabile:• Il file system è isolato• Il registro è isolato• Upgrade dell’applicazione più semplice• Disinstallazione completa dell’applicazione più semplice

Project Centennial

• Trasforma un sito web responsive in una Universal Windows app

• Sfrutta le API di Windows 10 direttamente dal codice del sito

• Aggiorna l’applicazione senza dover inviare un nuovo update sullo Store

Project Westminster

Grazie a tutti per la partecipazione

Riceverete il link per il download a slide e demo via email nei prossimi giorni

Per contattarmi

matteo.pagani@microsoft.com

Twitter: @qmatteoq

Grazie