Organizar elementos em grupos

Os grupos permitem separar o design do mostrador do relógio em uma estrutura lógica.

Isso pode ser útil para organizar os componentes. É possível atribuir a cada grupo um name para indicar o que ele é.

Outro motivo pelo qual os grupos são muito úteis é que você pode tratar tudo dentro desse grupo como uma única entidade para ajustar a aparência, até mesmo de forma dinâmica, para mudar as fontes de dados.

Confira alguns exemplos de como isso pode ser útil. O Group a seguir contém vários elementos PartText, PartImage e PartDraw que compõem uma única parte lógica do mostrador do relógio:

<Group name="decorations" ...>
  <PartText ...>
  <PartImage ...>
  <PartDraw ...>
</Group>

Mudar o comportamento do modo ambiente

Depois de definir o Group, a visibilidade de todo o Group pode ser ajustada para o modo ambiente, por exemplo, para ocultar o Group:

<Group ...>
  <Variant mode="AMBIENT" target="alpha" value="0" />
  <PartText ...>
  <PartImage ...>
  <PartDraw ...>
</Group>

Isso evita a necessidade de adicionar um elemento Variant individualmente a cada elemento filho.

Transformar um grupo

Assim como o comportamento do ambiente, usando Variant, muitas das propriedades de Group podem ser ajustadas usando um ou mais elementos Transform.

Neste exemplo, o Group é girado com base no segundo. Ao especificar pivotX e pivotY como 0.5, a rotação ocorre em torno do centro do Group, independentemente de onde cada elemento, como PartText ou PartImage, está dentro desse Group:

<Group x="0" y="0" width="450" height="450" pivotX="0.5" pivotY="0.5">
  <!-- One full rotation per minute -->
  <Transform target="angle" value="[SECOND] * 6" />
  <PartText ...>
  <PartImage ...>
  <PartDraw ...>
</Group>