Tamaño y posicionamiento de elementos de página

Existen dos maneras diferentes de obtener y cambiar el tamaño y la posición de un elemento de página:

  1. Uso de las funciones de método get y set para el tamaño y la posición
  2. Manipular su transformación afín mediante sus funciones getTransform() y setTransform(), a la vez que se preserva el tamaño inherente.

Cómo leer las propiedades de los elementos de página

Tamaño y rotación

Como se muestra en la figura, el tamaño y la posición se miden con respecto al cuadro delimitador de un elemento de página renderizado cuando no tiene rotación:

  • Izquierda y Parte superior: Se miden desde la esquina superior izquierda de la página hasta la esquina superior izquierda del cuadro de límite sin rotar. Usa getLeft() y getTop() para leer los valores.
  • Ancho y Altura: El ancho y la altura del cuadro de límite sin rotar. Usa getWidth() y getHeight() para leer los valores.
  • Rotación: Es la rotación en el sentido de las manecillas del reloj con respecto a la línea vertical alrededor. el centro del cuadro de límite. Usa getRotation() para leer el valor.

Todas las longitudes se miden en puntos (pt). La rotación se mide en grados. (°).

Cómo configurar las propiedades de los elementos de página

Puedes establecer el tamaño y la posición de un elemento de página cuando lo creas usando Un método de inserción, como insertShape() Para una forma existente, puedes establecer el tamaño, la posición y la rotación; también puedes establecer el escalamiento de un elemento o para reflejarlo en uno de sus bordes.

Durante la creación

Puedes proporcionar información sobre la posición y el tamaño cuando creas un elemento de página.

var slide = SlidesApp.getActivePresentation().getSlides()[0];
var shape = slide.insertShape(SlidesApp.ShapeType.TEXT_BOX, 100, 200, 300, 60);
Logger.log('Left: ' + shape.getLeft() + 'pt; Top: '
                    + shape.getTop() + 'pt; Width: '
                    + shape.getWidth() + 'pt; Height: '
                    + shape.getHeight() + 'pt; Rotation: '
                    + shape.getRotation() + ' degrees.');

La secuencia de comandos anterior crea una forma en la primera diapositiva de la presentación activa. con la posición y el tamaño especificados, y lee la información sobre posición y tamaño de la forma. El registro esperado es el siguiente:

Left: 100pt; Top: 200pt; Width: 300pt; Height: 60pt; Rotation: 0 degrees.

Tamaño, posición y rotación

Puedes actualizar el tamaño y la posición de un elemento de página después de su creación:

  • Usa setLeft() y setTop() para establecer la posición de la esquina superior izquierda de cuadro de límite sin rotar.
  • Usa setWidth() y setHeight() para establecer el ancho y la altura renderizados del límite. .
  • Utiliza setRotation() para establecer la rotación en el sentido de las manecillas del reloj del cuadro de límite alrededor de su en el centro de atención.

El siguiente {i>script<i} crea una forma en la primera diapositiva de la presentación activa: usa métodos set para actualizar su posición, tamaño y rotación, y lee la posición y la información del tamaño de la forma.

var slide = SlidesApp.getActivePresentation().getSlides()[0];
var shape = slide.insertShape(SlidesApp.ShapeType.RECTANGLE);
shape.setLeft(100).setTop(200).setWidth(50).setHeight(60).setRotation(90);
Logger.log('Left: ' + shape.getLeft()
                    + 'pt; Top: ' + shape.getTop()
                    + 'pt; Width: ' + shape.getWidth()
                    + 'pt; Height: ' + shape.getHeight()
                    + 'pt; Rotation: ' + shape.getRotation() + '\u00B0.');

El resultado de registro esperado de esta secuencia de comandos es como se muestra a continuación:

Left: 100pt; Top: 200pt; Width: 50pt; Height: 60pt; Rotation: 90°.

Los métodos set de tamaño, posición y rotación se pueden usar en cualquier orden o combinación. Si reemplazas la tercera línea de arriba con la siguiente secuencia de comandos, obtendrás el mismo resultado:

shape.setWidth(55);
shape.setRotation(90).setHeight(60).setLeft(100);
shape.setWidth(50).setTop(200);

Escalamiento

En lugar de usar setWidth() y setHeight() anteriores para establecer el tamaño de la forma a un valor absoluto, scaleWidth() y scaleHeight() se pueden usar para estirar o un elemento de página con un factor de escala relativo.

shape.scaleHeight(0.5).scaleWidth(2);

En la siguiente figura, se muestra cómo funciona el código anterior en una forma cuadrada rotada a 45°. Ten en cuenta que la esquina superior izquierda del cuadro de límite se fija durante el ajuste.

Escalamiento de Presentaciones

Reflejo a lo largo del borde

El argumento en scaleWidth() y scaleHeight() puede ser negativo para que puedan usarse para girar un elemento de página en sentido horizontal o vertical.

shape.scaleWidth(-1); // Flip horizontally along the left edge of the bounding box.
shape.scaleHeight(-1); // Flip vertically along the top edge of the bounding box.

En la siguiente figura, se muestra cómo funciona el código anterior en una forma girada a 45°. Ten en cuenta que El elemento de página está invertido a lo largo de uno de los bordes del cuadro delimitador, pero no en el centro.

Reflexión sobre Presentaciones

Rotación de línea

Al igual que otros elementos de página, la rotación de una línea no es el ángulo vertical de la línea, sino también la rotación de su cuadro delimitador. Cuando creas una línea con puntos de inicio y finalización especificados, su rotación siempre es de 0°. Arrastrar los extremos de la línea en la IU de Presentaciones de Google también cambian su ángulo vertical. como el tamaño y la posición de su cuadro delimitador, pero no cambia su rotación. El uso de setRotation() rota el cuadro delimitador de la línea, lo que cambia eficazmente su ángulo vertical. Entonces, dos líneas pueden tienen el mismo ángulo vertical visual, pero diferentes cuadros de límite y, por lo tanto, valores de tamaño, posición y rotación diferentes.

Limitaciones

Algunos métodos de tamaño y posicionamiento no son compatibles con algunos tipos de página o de terceros. En la siguiente tabla, se resumen los métodos que no son compatibles con ciertos tipos de elementos de página.

Métodos Forma Video Tabla
getHeight(), getWidth() ✔ ✔ NO (devuelve nulo)
setHeight(), setWidth() ✔ ✔ NO
setRotation() ✔ NO NO
scaleHeight(), scaleWidth() ✔ ✔ NO

Todos los métodos de tamaño y posicionamiento pueden dar resultados inesperados si la página de la imagen tiene una distorsión. Todas las limitaciones están sujetas a cambios. Comprobar la referencia de información actualizada.

Usa transformaciones afines

Para un control avanzado, el tamaño y la posición de un elemento de página también se pueden calculadas y ajustadas a través de su tamaño inherente (nativo) y la transformación afín

Google Apps Script proporciona una interfaz similar para usar la transformación afín y la API de Presentaciones de Google.

  • Para leer, esto article explica conceptos de transformación afín y cómo inferir el tamaño renderizado a partir de elementos (nativo) y las transformaciones de los elementos de página. En Apps Script, usa
    • getInherentWidth() y getInherentHeight() para el tamaño nativo de la página elementos;
    • getTransform() para la transformación afín de los elementos de página.
  • Para escribir, esto article describe cómo ajustar el tamaño y posicionar los elementos de página con la transformación afín para lograr rotación, reflexión, etc. En Apps Script, usa
    • setTransform() para establecer la transformación afín de los elementos de página (similar a modo ABSOLUTE);
    • preconcatenateTransform() para preconcatenar una transformación afín a la transformación actual de los elementos de página (similar al modo RELATIVE)

La siguiente secuencia de comandos crea una forma, establece su transformación, lee su tamaño inherente y lee su transformación afín.

var slide = SlidesApp.getActivePresentation().getSlides()[0];
var shape = slide.insertShape(SlidesApp.ShapeType.RECTANGLE);
shape.setTransform(SlidesApp.newAffineTransformBuilder()
                   .setScaleX(2)
                   .setScaleY(1)
                   .setTranslateX(100)
                   .setTranslateY(200)
                   .build());
Logger.log('Inherent width: ' + shape.getInherentWidth()
                              + 'pt; Inherent height: '
                              + shape.getInherentHeight() + 'pt.');

El resultado de registro esperado de esta secuencia de comandos es como se muestra a continuación:

Inherent width: 236.2pt; Inherent height: 236.2pt.

La forma resultante tendrá la siguiente transformación y el tamaño y la posición renderizados:

AffineTransform{scaleX=2.0, scaleY=1.0, shearX=0.0, shearY=0.0, translateX=100.0, translateY=200.0}
Left: 100pt; Top: 200pt; Width: 472.4pt; Height: 236.2pt; Rotation: 0°.