Gli utenti di Contoso Cookbook ora possono scattare foto e condividerle con altre applicazioni. In questo esercizio aggiungerete anche il supporto per i video. Cambieremo i parametri passati a captureFileAsync per indicare se vogliamo registrare video o scattare foto ed useremo la proprietà VideoSetting della CameraCaptureUI per indicare in quale formato vogliamo registrare.
Task 1 - Utilizzare CameraCaptureUI per registrare Video
CaptureFileAsync, lo stesso metodo utilizzato per scattare le foto, può essere usato per i video. Proviamo a modificare il clic handler che avevate impostato precedentemente per dimostrarlo.<(p>
1. Trovate il clic handler per il comando Video, aggiunto nell'esercizio 1 e modificatelo in questo modo:
// Handle click events from the Video command
document.getElementById("video").addEventListener("click", function (e) {
var camera = new capture.CameraCaptureUI();
camera.videoSettings.format = capture.CameraCaptureUIVideoFormat.wmv;
// Capture a video and display the share UI
camera.captureFileAsync(capture.CameraCaptureUIMode.video).then(function (file) {
if (file != null) {
_video = file;
dtm.showShareUI();
}
});
});2. Aggiungete una clausola else-if alla funzione onDataRequested così che l'app possa condividere sia le foto sia i video:
onDataRequested: function (e) {
var request = e.request;
request.data.properties.title = item.title;
if (_photo != null) {
request.data.properties.description = "Recipe photo";
var reference = storage.Streams.RandomAccessStreamReference.createFromFile(_photo);
request.data.properties.Thumbnail = reference;
request.data.setBitmap(reference);
_photo = null;
}
else if (_video != null)
{
request.data.properties.description = "Recipe video";
request.data.setStorageItems([_video]);
_video = null;
}
else {
request.data.properties.description = "Recipe ingredients and directions";
// Share recipe text
var recipe = "\r\nINGREDIENTS\r\n" + item.ingredients.join("\r\n");
recipe += ("\r\n\r\nDIRECTIONS\r\n" + item.directions);
request.data.setText(recipe);
// Share recipe image
var uri = item.backgroundImage;
if (item.backgroundImage.indexOf("http://") != 0)
uri = "ms-appx:///" + uri;
uri = new Windows.Foundation.Uri(uri);
var reference = storage.Streams.RandomAccessStreamReference.createFromUri(uri);
request.data.properties.thumbnail = reference;
request.data.setBitmap(reference);
}
},3. Nella sezione Capabilities del file manifest, spuntate il box Microphone, necessario perché, quando si registra un video, CameraCaptureUI utilizza il microfono insieme alla fotocamera.
Task 2 - Controllare i Risultati
Ora testiamo il codice appena inserito.
1. Avviate l'app con F5, toccate una ricetta e raggiungete la sua pagina di dettaglio.
2. Visualizzate l'app bar e toccate il bottone Video.
3. Se è richiesta l'autorizzazione all'utilizzo del microfono, fate clic su "Allow".
4. Quando appare l'interfaccia di cattura della videocamera, toccate lo schermo per avviare la registrazione del video.
5. Dopo qualche secondo, toccate ancora lo schermo per fermare la registrazione.
6. Cliccate il bottone OK nell'angolo in basso a destra dello schermo per accettare il video.
7. Quando appare l'interfaccia di condivisione selezionate uno share target come, ad esempio, l'app Share Target Sample App.
8. Verificate che il video scelto sia accettato dal target.
9. Tornate a Visual Studio e interrompete il debug.
Conclusioni
Su alcune piattaforme, includere capacità di catturare video e scattare foto in un'applicazione è un'impresa complicata, che richiede l'interfacciamento con le fotocamere anche a basso livello. Il Windows Runtime rende la cattura di file multimediali estremamente semplice, fornendo, grazie alla classe CameraCaptureUI, sia il core dell'interfaccia, sia la logica. Nell'app Contoso Cookbook non abbiamo dovuto gestire quasi nulla delle foto o dei video, a parte condividerli. Inoltre, potreste facilmente utilizzare i types nel namespace Windows.Storage per salvare questi file nel file system e permettere all'utente la creazione di cartelle di foto e video di ricette.
Potreste non averlo notato, ma il sistema operativo ha fatto qualcosa di notevole una volta spuntati i box della Webcam e del Microfono nel manifest. Se avviate l'app, selezionate la charm delle impostazioni e poi Permissions, vedrete che la pagina dei permessi ora contiene un bottone per attivare e disattivare gli accessi alla fotocamera ed al microfono. Le app che usano fotocamere e microfoni richiedono che l'accesso possa essere disabilitato dall'utente e non dovrete scrivere una singola riga di codice per far sì che questo avvenga.
