Nella scorsa lezione abbiamo analizzato le varie parti che compongono un documento SMIL Language, ora focalizziamo l’attenzione su come gestire il layout di una presentazione, vale a dire la disposizione dei media utilizzati.
In SMIL, la superficie di presentazione viene suddivisa in regioni, che possono essere anche sovrapposte. Gli elementi che definiscono gli attributi della superficie di presentazione e delle varie regioni sono rispettivamente “root-layout” e “region”; i quali devono essere posti all’interno dell’elemento “head”.
Tramite l’elemento “root-layout” possiamo definire le dimensioni ed il colore di sfondo della finestra principale della presentazione; per esempio, per ottenere una superficie di 405x275 pixel, con sfondo nero, utilizziamo il seguente codice:
<root-layout backgroundColor="black" width="405" height="275"/>
Se vogliamo, invece, definire una regione di 300x50 pixel, con sfondo grigio chiaro, posizionata a 200 pixel di distanza dal bordo superiore della superficie di presentazione e a 100 pixel di distanza dal bordo sinistro, utilizziamo il seguente codice:
<region regionName="sottotitoli" backgroundColor="#EEEEEE"
width="300" height="50" top="200" left="100"/>
Si può notare come gli attributi utilizzati siano molto simili a quelli presenti in CSS e come i colori vengano definiti nello stesso modo utilizzato nell’HTML. Inoltre, è presente l’attributo “regionName”, che assegna un nome alla regione che si sta definendo.
Una volta definite le regioni, è necessario associare ad esse i vari media che compongono la presentazione, attraverso l’attributo “region”; per esempio, se volessimo posizionare un elemento testuale all’interno della regione chiamata “sottotitoli”, dovremmo utilizzare il seguente codice:
<text src="media/descrizione.txt" region="sottotitoli"/>
In questo modo il testo non verrà più visualizzato nella parte alta della finestra, ma in basso a destra.
Sebbene sia possibile assegnare a più regioni lo stesso nome, è bene evitare tale approccio, infatti, così facendo, si avrebbero discrepanze, anche notevoli, nella riproduzione di presentazioni con lettori SMIL differenti.
Ora analizziamo alcuni attributi dell’elemento “region” che si possono usare in circostanze particolari.
Quando abbiamo a che vedere con immagini o video, è possibile che le dimensioni effettive di tali media differiscano da quelle della regione che li contiene. Con l’attributo “fit” si possono ridimensionare automaticamente i media di una particolare regione; per esempio:
- se vogliamo che i media di una particolare regione assumano le stesse dimensioni di tale regione, a discapito delle proporzioni, assegnamo all’attributo “fit” il valore “fill”;
- se vogliamo che i media di una particolare regione assumano il più possibile le dimensioni di tale regione, mantenendo le proporzioni e ricoprendo tutta l’area della regione, assegnamo all’attributo “fit” il valore “meet” (alcune aree dei media potrebbero non essere visibili);
- se vogliamo che i media di una particolare regione assumano il più possibile le dimensioni di tale regione, mantenendo le proporzioni e rimanendo completamente visibili, assegnamo all’attributo “fit” il valore “slice” (alcune aree della regione potrebbero risultare non coperte).
Quando, invece abbiamo a che fare con dell’audio, è possibile gestire il volume di riproduzione di tali media. Per farlo è sufficiente utilizzare l’attributo “soundLevel”, a cui vengono associati valori percentuali; per esempio, se vogliamo che un particolare audio venga riprodotto alla metà del proprio volume dobbiamo specificare soundLevel=“50%”, mentre se vogliamo un volume doppio il codice sarà soundLevel=“200%”.
Nella prossima lezione vedremo applicazioni pratiche delle nozioni qui esposte.