Capítulo 6
Leiaute da
6.1 Introdução
A NCL permite definir onde cada objeto de mídia será apresentado, isto é, em que classe de dispositivos e em qual região de apresentação de cada classe de dispositivos.
As classes de dispositivos e suas regiões podem ser definidas por meio de propriedades dos objetos de mídia (veja Capítulo 9), por meio de elementos descritores (veja Capítulo 7), ou por meio de elementos <regionBase> e
<region>, respectivamente, discutidos neste capítulo.
Para cada classe de dispositivos de saída podemos definir, no cabeçalho do documento (dentro do elemento <head>), uma base de regiões utilizando o elemento <regionBase>.
Dentro de uma base de regiões, definimos as regiões através de elementos
<region>. Os elementos <region> definem as áreas, nos dispositivos de saída, onde os objetos de mídia poderão ser exibidos inicialmente.2 Para organizar o leiaute das diversas partes do documento hipermídia, as regiões podem ser aninhadas. Em outras palavras, uma região pode ser definida com relação à área total associada ao dispositivo correspondente a uma base de regiões ou aninhada em outra região. A definição de base de regiões com diversas regiões aninhadas é ilustrada pela Listagem 6.1.
Vale relembrar que, como uma aplicação NCL é descrita em um documento XML, um elemento, que pode ou não conter outros (p. ex., <region>), possui duas formas de definição:
elemento atômico, sem outros elementos aninhados:
<region id=“rgPDAmenu1” />
elemento com outros elementos aninhados e com o fechamento explícito ao final do bloco:
<region id=“rgPDAmenu” >
<region id=“rgPDAmenu1” />
<region id=“rgPDAmenu2” />
<region id=“rgPDAmenu3” />
</region>
2 Como visto na Seção 10.3, durante a apresentação de um objeto de mídia, a aplicação NCL pode alterar os atributos que definem onde ele é exibido.
<head>
<!-- uma base para cada dispositivo -->
<regionBase id=“rbTV”> <!-- dispositivo: TV (default) -->
<region id=“rgTVtelaInteira”> <!-- tela da TV -->
<region id=“rgTVmenu” > <!-- menu na TV -->
<region id=“rgTVmenu1” />
<region id=“rgTVmenu2” />
<region id=“rgTVmenu3” />
</region>
</region>
</regionBase>
<regionBase id=“rbPDA” device=“systemScreen(1)”> <!-- disp:PDA-->
<region id=“rgPDAtelaInteira”> <!-- tela do PDA -->
<region id=“rgPDAmenu” > <!-- menu no PDA -->
<region id=“rgPDAmenu1” />
<region id=“rgPDAmenu2” />
<region id=“rgPDAmenu3” />
</region>
</region>
</regionBase>
<!-- continuação do cabeçalho da aplicação -->
</head>
Listagem 6.1 Definição das bases de regiões para dois dispositivos e suas regiões filhas, onde serão exibidas as mídias.
6.1.1 Importação de Base de Regiões
Além de elementos <region>, uma base de regiões também pode conter elementos <importBase>, para importar as regiões definidas na base de regiões de um outro documento NCL. O elemento <importBase> possui os seguintes atributos3:
alias: “apelido” do arquivo importado, ou seja, o nome que será utilizado como prefixo para se referir aos elementos importados, no formato
“apelido#id_do_elemento_importado”;
documentURI: a localização e o nome do arquivo que contém a base a ser importada;
region: no caso de o arquivo importado conter uma base de regiões, o atributo define qual região da aplicação conterá as regiões importadas. Se
T V
P D A
o atributo não for especificado, assume-se que seja toda a área de exibição do dispositivo.
A Listagem 6.2 apresenta o código correspondente à importação e uso de uma base de regiões de um documento NCL externo. As regiões definidas na base de regiões do arquivo “baseRegMenu.ncl” são importadas como filhos de <regionBase> do documento atual, ao passo que as regiões definidas na base de regiões do arquivo “baseRegMenu.ncl” são importadas como filhos da região “rgVideoAux”.
<regionBase>
<importBase alias=“regMenu” documentURI=“baseRegMenu.ncl” />
<importBase alias=“regDoc”
documentURI=“baseRegDocumentario.ncl”
region=“rgVideoAux” />
<region id=“rgTV”>
<region id=“rgVideoAux” top=“5%” left=“5%”
width=“50%” height=“50%” />
...
</region>
</regionBase>
...
<descriptorBase>
<descriptor id=“dLegenda” region=”regDoc#rgLegenda” />
...
</descriptorBase>
Listagem 6.2 Importação de uma base de regiões e uso de região importada, assumindo que no arquivo “baseRegDocumentario.ncl” haja uma região com identificador “rgLegenda”.
6.1.2 Atributos de Base de Regiões
Uma base de regiões <regionBase> possui os seguintes atributos:
id: identificador unívoco da base de regiões. Esse atributo não é obrigatório para o elemento <regionBase>, mas quando especificado deve seguir a mesma regra de formação para o atributo id definida no Capítulo 5;
device: classe de dispositivos à qual os filhos do elemento
<regionBase> se referem. Pode conter valores como
“systemScreen(i)”, “systemAudio(i)”, onde i é um inteiro maior que zero, conforme as classes de dispositivos disponíveis.
O atributo device também é opcional. Se não for definido, ele assume como default a classe “systemScreen(0)”. Nessa classe, só um dispositivo é
registrado, também por default: o dispositivo de exibição associado ao dispositivo onde está sendo processado o documento NCL. Neste capítulo, vamos supor que temos apenas um dispositivo de exibição e que, portanto, será declarado por default. Esse dispositivo pode ser uma TV ligada ao conversor digital (set-top box) onde a aplicação NCL está sendo executada, a tela de um computador onde a aplicação NCL está sendo processada etc. No Capítulo 15 trataremos da programação para múltiplos dispositivos de exibição.
Vale observar que, ao associar uma classe de dispositivos a uma base de regiões <regionBase>, o dispositivo escolhido define variáveis globais de ambiente, tais como:
“system.screenSize(i)”: tamanho de tela da classe de dispositivos i, expresso em (linhas, pixels/linha);
“system.screenGraphicSize(i)”: resolução do plano gráfico da classe de dispositivos i, expresso em (linhas, pixels/linha);
“system.audioType(i)”: tipo de áudio da classe de dispositivos i, que pode assumir um dos seguintes valores: “mono”, “stereo” ou “5.1”.
Essas e outras variáveis de ambiente são definidas na Seção 9.3.1.
6.1.3 Atributos de Região
Como já mencionamos, uma região serve para iniciar a posição dos objetos de mídia num local específico. Para apresentar um vídeo no centro da tela e com uma margem de 10%, por exemplo, podemos definir duas regiões:
“rgTV”, que ocupa toda a área disponível do dispositivo, e “rgTVcentro”, para que um objeto mídia seja apresentado no centro da tela, conforme a Listagem 6.3.
<regionBase id=“rbTV” device=“systemScreen(0)”>
<region id=“rgTV”>
<region id=“rgTVcentro” left=“10%” top=“10%”
width=“80%” height=“80%” />
</region>
</regionBase>
Listagem 6.3 Exemplo de definição de região centralizada em outra.
Essa definição corresponde ao leiaute apresentado na Figura 6.1.