Esistono due modi diversi per ottenere e modificare le dimensioni e la posizione di un elemento di pagina:
- Utilizzo delle funzioni getter e setter per dimensioni e posizione.
- Manipolare la sua trasformazione affine mediante le funzioni
getTransform()esetTransform()mantenendo le dimensioni intrinseche.
Lettura delle proprietà degli elementi di pagina
Come mostrato nella figura, le dimensioni e la posizione vengono misurate in relazione al riquadro di delimitazione di un elemento di pagina sottoposto a rendering quando non è presente alcuna rotazione:
- A sinistra e In alto: misurate dall'angolo in alto a sinistra della pagina all'angolo in alto a sinistra del riquadro di delimitazione non ruotato. Utilizza
getLeft()egetTop()per leggere i valori. - Larghezza e Altezza: la larghezza e l'altezza del riquadro di delimitazione non ruotato.
Utilizza
getWidth()egetHeight()per leggere i valori. - Rotazione: la rotazione in senso orario rispetto alla linea verticale attorno al centro del riquadro di delimitazione. Usa
getRotation()per leggere il valore.
Tutte le lunghezze sono misurate in punti (pt). La rotazione si misura in gradi (°).
Impostare le proprietà degli elementi di pagina
Puoi impostare le dimensioni e la posizione di un elemento di pagina quando lo crei utilizzando un metodo di inserimento come insertShape(). Nel caso di una forma esistente, puoi impostare
le dimensioni, la posizione e la rotazione; puoi anche impostare il ridimensionamento
di un elemento in modo da ridimensionarlo o rifletterlo lungo uno dei suoi bordi.
Al momento della creazione
Puoi fornire informazioni sulla posizione e sulle dimensioni quando crei un elemento della pagina.
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.');
Lo script precedente crea una forma sulla prima slide della presentazione attiva con la posizione e le dimensioni specificate e legge le informazioni su posizione e dimensioni della forma. Il log previsto è:
Left: 100pt; Top: 200pt; Width: 300pt; Height: 60pt; Rotation: 0 degrees.
Dimensioni, posizione e rotazione
Puoi aggiornare le dimensioni e la posizione di un elemento di pagina dopo la creazione:
- Utilizza
setLeft()esetTop()per impostare la posizione dell'angolo in alto a sinistra del riquadro di delimitazione non ruotato. - Utilizza
setWidth()esetHeight()per impostare la larghezza e l'altezza visualizzate del riquadro di delimitazione. - Utilizza
setRotation()per impostare la rotazione in senso orario del riquadro di delimitazione intorno al suo centro.
Lo script seguente crea una forma sulla prima slide della presentazione attiva, utilizza i setter per aggiornarne posizione, dimensioni e rotazione e legge le informazioni su posizione e dimensioni della 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.');
L'output di log previsto da questo script è il seguente:
Left: 100pt; Top: 200pt; Width: 50pt; Height: 60pt; Rotation: 90°.
I parametri di impostazione di dimensioni, posizione e rotazione possono essere utilizzati in qualsiasi ordine o combinazione. La sostituzione della terza riga sopra riportata con lo script seguente produrrà lo stesso risultato:
shape.setWidth(55);
shape.setRotation(90).setHeight(60).setLeft(100);
shape.setWidth(50).setTop(200);
Scalabilità
Invece di usare setWidth() e setHeight() qui sopra per impostare le dimensioni della forma
su un valore assoluto, puoi usare scaleWidth() e scaleHeight() per estendere o
stringere un elemento di pagina con un fattore di scala relativo.
shape.scaleHeight(0.5).scaleWidth(2);
La figura seguente mostra come funziona il codice riportato sopra su una forma quadrata ruotata di 45°. Tieni presente che l'angolo in alto a sinistra del riquadro di delimitazione rimane fisso durante l'applicazione del ridimensionamento.
Riflesso lungo il bordo
L'argomento in scaleWidth() e scaleHeight() può essere negativo, così da poter essere utilizzato per capovolgere un elemento di pagina orizzontalmente o verticalmente.
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.
La figura seguente mostra come funziona il codice sopra su una forma ruotata di 45°. Tieni presente che l'elemento della pagina è capovolto lungo uno dei bordi del riquadro di delimitazione, ma non al centro.
Rotazione della linea
Come per altri elementi della pagina, la rotazione di una linea non è l'angolo verticale della linea, ma la rotazione del relativo riquadro di delimitazione. Quando crei una linea con i punti di inizio e fine specificati, la sua rotazione è sempre di 0°. Trascinando i punti finali della linea nell'interfaccia utente di Presentazioni Google, vengono modificati anche l'angolo verticale, le dimensioni e la posizione del riquadro di delimitazione, ma non la rotazione. L'utilizzo di setRotation() ruota il riquadro di delimitazione della linea, modificando in modo efficace il suo angolo verticale. Pertanto, due linee possono avere lo stesso angolo visivo verticale, ma riquadri di delimitazione diversi e quindi valori di dimensioni, posizione e rotazione diversi.
Limitazioni
Alcuni metodi di dimensionamento e posizionamento non sono compatibili con alcuni tipi di elementi della pagina. La tabella riportata di seguito riassume i metodi che non sono compatibili con determinati tipi di elementi di pagina.
| Metodi | Shape | Video | Tabella |
|---|---|---|---|
| getHeight(), getWidth() | ✔ | ✔ | NO (restituisce null) |
| setHeight(), setWidth() | ✔ | ✔ | NO |
| setRotation() | ✔ | NO | NO |
| scaleHeight(), scaleWidth() | ✔ | ✔ | NO |
Tutti i metodi di dimensionamento e posizionamento possono restituire risultati imprevisti se l'elemento di pagina ha il taglio. Tutte le limitazioni sono soggette a modifica. Controlla i riferimenti per informazioni aggiornate.
Utilizzo delle trasformazioni affini
Per il controllo avanzato, è possibile calcolare e regolare le dimensioni e la posizione di un elemento di pagina anche tramite le sue dimensioni intrinseche (native) e la trasformazione affine.
Google Apps Script fornisce un'interfaccia simile per utilizzare la trasformazione affine dell'API Presentazioni Google.
- Da leggere, questo articolo spiega i concetti della trasformazione affine e come dedurre le dimensioni visualizzate da dimensioni intrinseche (native) e la trasformazione per gli elementi della pagina. In Apps Script, utilizza:
getInherentWidth()egetInherentHeight()per le dimensioni native degli elementi di pagina;getTransform()per la trasformazione affine degli elementi della pagina.
- Per scrivere, questo articolo descrive come ridimensionare e posizionare gli elementi della pagina utilizzando la trasformazione affine per ottenere scalabilità, rotazione, riflessione e così via. In Apps Script, utilizza
setTransform()per impostare la trasformazione affine degli elementi di pagina (in modo simile alla modalità ASSOLUTA);preconcatenateTransform()per preconcatenare una trasformata affine alla trasformazione corrente degli elementi di pagina (simile alla modalità RELATIVA).
Lo script seguente crea una forma, ne imposta la trasformazione, ne legge le dimensioni intrinseche e legge la trasformazione affine.
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.');
L'output di log previsto da questo script è il seguente:
Inherent width: 236.2pt; Inherent height: 236.2pt.
La forma risultante avrà la seguente trasformazione, oltre a dimensioni e posizione visualizzate:
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°.