Controllare elementi multimediali utilizzando trigger in una sequenza temporale

Un elemento multimediale può contenere un riferimento a un file audio, ad esempio a un file WAV, o a un file video, ad esempio a un file WMV. Per controllare la riproduzione di un elemento multimediale è possibile utilizzare trigger di evento in una sequenza temporale di animazione.

Nell'esempio riportato di seguito viene illustrato come controllare la riproduzione di un video attivando la relativa sequenza temporale quando il puntatore del mouse entra ed esce dall'area di visualizzazione del video. Per ulteriori informazioni su come modificare le sequenze temporali, vedere Animazione di oggetti e Scrittura di codice che risponde agli eventi. In questo esempio vengono impostati trigger per gli eventi MouseEnter e MouseLeave di un oggetto nella tavola da disegno. Per un elenco di altri eventi per i quali è possibile impostare trigger, vedere Riferimento per controlli, proprietà ed eventi.

Attenzione:
Per utilizzare i supporti multimediali in Microsoft Expression Blend, è necessario che nel computer sia installato Windows Media Player 10. È possibile eseguire il download di Windows Media Player 10 dal sito Web Windows Media.

Per controllare la riproduzione di un video con il puntatore del mouse

1. Per lasciare più spazio al pannello Oggetti e sequenza temporale nell'area di lavoro di Expression Blend, passare all'area di lavoro Animazione (F6). In questo modo il pannello Oggetti e sequenza temporale passa sotto la tavola da disegno.

2. Nel pannello Oggetti e sequenza temporale, attivare l'oggetto in cui si desidera aggiungere il video facendo clic sull'oggetto. Ad esempio, per aggiungere il video nel livello principale dell'applicazione, fare clic su LayoutRoot.

3. Aggiungere il file video nella tavola da disegno aggiungendolo prima al progetto (CTRL+I) e quindi facendovi doppio clic nel pannello Progetto. In Oggetti e sequenza temporale verrà creato un elemento multimediale con la proprietà Source impostata sul percorso del file video.

   • Se prima di aggiungere il file multimediale nella tavola da disegno è stata selezionata una sequenza temporale, l'elemento multimediale verrà inserito in tale sequenza temporale e verrà pianificato per avviarsi in corrispondenza della posizione corrente dell'indicatore di riproduzione.

   • Se non è stata selezionata alcuna sequenza temporale, ne verrà creata una nuova e l'elemento multimediale verrà aggiunto a questa in corrispondenza dell'indicatore del secondo 0.

   Per la procedura completa per l'aggiunta di elementi multimediali nella tavola da disegno, vedere l'argomento Inserire un file audio o video nel documento attivo.

4. Nel pannello Trigger, è stato aggiunto un nuovo trigger per l'evento Window.Loaded. Fare clic su Window.Loaded per vedere l'azione che viene attivata dall'evento Window.Loaded. Per impostazione predefinita, viene avviata la sequenza temporale del video. Si desidera che la riproduzione inizi quando il puntatore del mouse si trova sull'area di visualizzazione del video e si arresti quando il puntatore del mouse esce da tale area. La prima attività consiste nel sospendere la riproduzione del video non appena si avvia quando viene caricata la finestra dell'applicazione.

5. nel pannello Trigger, fare clic sul pulsante Aggiungi nuova azione  accanto a Quando viene generato Window.Loaded. Nell'elenco verrà visualizzata una seconda azione predefinita che chiama il metodo timeline.Begin.

6. Fare clic sulla casella a discesa relativa al metodo e selezionare Pausa. Il pannello Trigger dovrebbe avere un aspetto simile a quello dell'immagine seguente. In questo modo la riproduzione del video verrà avviata e immediatamente sospesa al momento del caricamento della finestra dell'applicazione.

   Aggiunta di un'altra azione al trigger per l'evento Window.Loaded

   

7. Per collegare la sequenza temporale del filmato a un evento del mouse, è necessario aggiungere un nuovo trigger di evento. Fare clic sul pulsante Aggiungi trigger evento  nel pannello Trigger. Verrà visualizzato un nuovo trigger di evento predefinito nell'elenco relativo a quando viene generato l'evento Window.Loaded.

8. Fare clic sull'elenco a discesa degli oggetti per cambiare la selezione passando da Window al nome dell'elemento multimediale. Nell'immagine precedente ad esempio il nome dell'elemento multimediale è SampleMovie_wmv.

   Suggerimento:
   Se il nome dell'elemento multimediale non è elencato, selezionarlo in Oggetti e sequenza temporale e quindi provare a ripetere questo passaggio.

9. Fare clic sulla casella a discesa dei metodi e cambiare la selezione da Loaded a MouseEnter. L'evento MouseEnter è incluso nella categoria UIElement. Come trigger ora dovrebbe risultare visualizzato Quando viene generato element.MouseEnter. Non è stata ancora creata alcuna azione.

   Suggerimento:

   Se si utilizza un file audio invece di un file video, è possibile selezionare l'evento MouseEnter dell'elemento multimediale che include il file video. Gli utenti non sapranno tuttavia in che posizione spostare il puntatore del mouse, poiché l'elemento multimediale non risulterà visibile nell'applicazione. In alternativa, è possibile aggiungere un pulsante nella tavola da disegno e creare un trigger per l'evento Click del pulsante.

10. Fare clic su Aggiungi nuova azione  accanto a Quando viene generato element.MouseEnter. Nell'elenco verrà visualizzata un'azione predefinita che chiama il metodo timeline.Begin.

11. Poiché la sequenza temporale è già stata avviata quando è stato caricato l'oggetto Window, cambiare il metodo impostandolo su timeline.Pause. Ora la riproduzione del filmato verrà sospesa quando il puntatore del mouse viene spostato sull'area di visualizzazione.

12. Aggiungere un altro trigger di evento () e modificarlo in modo che risulti visualizzato Quando viene generato element.MouseLeave.

13. Aggiungere una nuova azione () chiamando il metodo timeline.Resume. All'uscita del puntatore dall'area di visualizzazione la riproduzione del filmato riprenderà. In alternativa, è possibile scegliere di arrestare e riavviare il filmato anziché sospenderlo e riprenderne la riproduzione.

    Aggiunta dei trigger per gli eventi MouseEnter e MouseLeave e delle azioni per sospendere e riprendere la riproduzione del filmato

    

14. Per verificare che l'elemento multimediale video si ridimensioni con la finestra, impostare le proprietà seguenti nel pannello Proprietà:

    • Nella sezione delle proprietà avanzate della categoria File multimediali del pannello Proprietà impostare la proprietà Stretch dell'elemento multimediale su Uniform. Questa impostazione consente di mantenere le proporzioni dell'area di visualizzazione del video.

    • Nella categoria Layout del pannello Proprietà impostare Width e Height dell'elemento multimediale su Auto. Questa impostazione consente all'area di visualizzazione del video di ridimensionarsi con la finestra dell'applicazione. Se l'area di visualizzazione del video non si ridimensiona, controllare se l'elemento multimediale è contenuto in un elemento pannello con dimensioni specifiche.

15. Eseguire il test dell'applicazione (F5). Osservare il comportamento dell'area di visualizzazione del filmato quando si sposta il puntatore del mouse al suo interno.