Transformações e elementos de página

Neste guia, descrevemos os conceitos subjacentes usados na transformação de elementos de página (ou seja, movimento, rotação, escalonamento e distorção), com foco especialmente na transformação afim e suas operações.

Para saber mais sobre como usar transformações afins para alcançar resultados específicos, consulte o guia Dimensionar e posicionar formas.

O tamanho e a posição visual de um elemento de página são controlados por duas propriedades: size e transform. O tamanho descreve o tamanho ideal ou integrado do elemento de página que está sendo criado. Na transformação, uma matriz de transformação afim (link em inglês) bidimensional que determina como um objeto no tamanho integrado é transformado para resultar na aparência final.

Quando você seleciona um elemento de página na IU das Apresentações e muda o tamanho visual usando as alças de ajuste, está atualizando essa matriz de transformação. Mover o elemento pela página ou girá-lo também atualiza a matriz de transformação do elemento.

Use a interface das Apresentações Google para começar

A aritmética da matriz que você usa para transformar e redimensionar elementos da página é muito eficiente, mas pode ser intimidante no início. A maior parte desta página descreve esses cálculos. No entanto, é possível simplificar a especificação de transformações e tamanhos usando a seguinte abordagem:

1. Crie elementos de página usando a interface do Apresentações Google.
2. Posicione a escala desses elementos da página como quiser, ainda usando a interface do Apresentações.
3. Leia o tamanho e a transformação desses elementos usando o método get.

Isso pode ser o suficiente para você começar. O restante deste guia explica em detalhes os cálculos de transformação que podem ser usados para manipular elementos de página.

Matrizes de transformações afins

As matrizes de transformação afim bidimensionais são normalmente usadas por bibliotecas de gráficos para controlar a escala, a rotação, a distorção, o reflexo e a translação de elementos. Na API Slides, a transformação de um elemento de página é representada como uma matriz 3x3:

$$A=\begin{bmatrix} scale\_x & shear\_x & translate\_x\\ shear\_y & scale\_y & translate\_y\\ 0 & 0 & 1 \end{bmatrix}$$

Os parâmetros usados na transformação são:

translate_x	Os parâmetros de tradução especificam a posição (X,Y) do canto superior esquerdo do elemento de página em relação ao canto superior esquerdo da página. Especifique a posição relativa usando Unidades de pontos (pt) ou unidades métricas em inglês (EMU).
translate_y
scale_x	Os parâmetros de escala controlam o tamanho do elemento de página quando renderizado. Esses são fatores multiplicadores sem unidade.Por exemplo, um valor scale_x de 1,5 aumenta a largura do elemento em 50%.
scale_y
shear_x	Os parâmetros de distorção também não têm unidade e controlam a inclinação de um elemento de página. Os parâmetros de escala e distorção podem ser usados juntos para girar um elemento de página.
shear_y

Há muitos exemplos na Web que mostram como as matrizes de transformação bidimensionais afetam a renderização de objetos gráficos.

A matriz de transformação é relativa ao grupo ou à página que o contém. Por exemplo, se você girar um grupo que contenha um retângulo, os valores de campo transform do grupo refletirão a rotação, mas os valores do campo transform do retângulo não.

Como calcular o tamanho visual

Para determinar o tamanho visual (renderizado) de um elemento de página, considere as propriedades de tamanho e transformação em conjunto. Não é possível determinar qual dos dois elementos da página é visualmente maior apenas comparando as propriedades de tamanho: é necessário mapear os limites do elemento usando a matriz de transformação e calcular um tamanho renderizado.

Mapear um ponto

Para mapear um ponto específico usando a matriz de transformação, converta o ponto (x, y) em um vetor [x, y, 1] e, em seguida, realize a multiplicação de matrizes. Considere o mapeamento de um ponto p:

\[p' = Ap\]

O resultado é o seguinte:

$$\begin{bmatrix} x'\\ y'\\ 1 \end{bmatrix} =\begin{bmatrix} scale\_x & shear\_x & translate\_x\\ shear\_y & scale\_y & translate\_y\\ 0 & 0 & 1 \end{bmatrix} \begin{bmatrix} x\\ y\\ 1 \end{bmatrix}$$

Portanto, as coordenadas do novo ponto p' são:

$$x' = (scale\_x \times x) + (shear\_x \times y) + translate\_x\\ y' = (scale\_y \times y) + (shear\_y \times x) + translate\_y$$

Calculando o limite

Para determinar o tamanho renderizado da caixa delimitadora de um elemento após uma transformação que distorce e dimensiona, use:

$$width' = (scale\_x \times width) + (shear\_x \times height)\\ height' = (scale\_y \times height) + (shear\_y \times width)$$

Para saber mais sobre como usar transformações afins para alcançar resultados específicos, consulte o guia Dimensionar e posicionar formas.

Limitações

Alguns campos de dimensionamento e posicionamento são incompatíveis com alguns tipos de elementos de página. A tabela abaixo resume a compatibilidade de determinados elementos de página com os campos de dimensionamento e posicionamento.

Campo	Forma	Video	Tabela
Tradução	✔	✔	✔
Escala	✔	✔	Não**
Shear (link em inglês)	✔	Não	Não

** Para atualizar as dimensões de linha e coluna da tabela, use UpdateTableRowPropertiesRequest e UpdateTableColumnPropertiesRequest.

Todos os campos de dimensionamento e posicionamento poderão fornecer resultados inesperados se o elemento da página tiver distorção. Todas as limitações estão sujeitas a alterações. Para informações atualizadas, consulte API Google Slides.