Seitenelemente anpassen und positionieren

Es gibt zwei verschiedene Möglichkeiten, die Größe und Position eines Seitenelements abzurufen und zu ändern:

  1. Getter- und Setter-Funktionen für Größe und Position verwenden
  2. Manipulieren der affine Transformation mithilfe der Funktionen getTransform() und setTransform() unter Beibehaltung der inhärenten Größe.

Seitenelementeigenschaften lesen

Größe und Drehen

Wie in der Abbildung dargestellt, werden Größe und Position in Bezug auf den Begrenzungsrahmen eines gerenderten Seitenelements gemessen, wenn dieses keine Rotation hat:

  • Left und Top: gemessen von der linken oberen Ecke der Seite bis zur oberen linken Ecke des nicht gedrehten Begrenzungsrahmens. Verwenden Sie getLeft() und getTop(), um die Werte zu lesen.
  • Breite und Höhe: Breite und Höhe des nicht gedrehten Begrenzungsrahmens. Verwenden Sie getWidth() und getHeight(), um die Werte zu lesen.
  • Drehung: die Drehung im Uhrzeigersinn in Bezug auf die vertikale Linie um die Mitte des Begrenzungsrahmens. Verwenden Sie getRotation(), um den Wert zu lesen.

Alle Längen werden in Punkten (pt) gemessen. Die Drehung wird in Grad (°) gemessen.

Seitenelementeigenschaften festlegen

Sie können die Größe und Position eines Seitenelements festlegen, wenn Sie es mit einer Einfügemethode wie insertShape() erstellen. Bei einer vorhandenen Form können Sie Größe, Position und Drehung festlegen. Außerdem haben Sie die Möglichkeit, die Größe eines Elements so festzulegen, dass die Größe angepasst oder entlang einer Kante widergespiegelt wird.

Bei Erstellung

Beim Erstellen eines Seitenelements können Sie Informationen zur Position und Größe angeben.

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.');

Mit dem Skript oben wird auf der ersten Folie der aktiven Präsentation eine Form mit der angegebenen Position und Größe erstellt. Außerdem werden die Positions- und Größeninformationen der Form gelesen. Das erwartete Log ist:

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

Größe, Position und Drehung

Sie können die Größe und Position eines Seitenelements nach dem Erstellen aktualisieren:

  • Verwenden Sie setLeft() und setTop(), um die Position der oberen linken Ecke des nicht gedrehten Begrenzungsrahmens festzulegen.
  • Verwenden Sie setWidth() und setHeight(), um die gerenderte Breite und Höhe des Begrenzungsrahmens festzulegen.
  • Verwenden Sie setRotation(), um die Drehung des Begrenzungsrahmens im Uhrzeigersinn um seinen Mittelpunkt festzulegen.

Das folgende Skript erstellt eine Form auf der ersten Folie der aktiven Präsentation, verwendet Setter, um Position, Größe und Drehung zu aktualisieren, und liest die Positions- und Größeninformationen der Form.

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.');

Die erwartete Protokollausgabe von diesem Skript sieht so aus:

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

Die Größen, Positionen und Rotationen können in beliebiger Reihenfolge oder Kombination verwendet werden. Wenn Sie die dritte Zeile oben durch das folgende Skript ersetzen, erhalten Sie dasselbe Ergebnis:

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

Skalierung

Statt setWidth() und setHeight() oben zu verwenden, um die Größe der Form auf einen absoluten Wert festzulegen, können Sie mit scaleWidth() und scaleHeight() ein Seitenelement mit einem relativen Skalierungsfaktor strecken oder drücken.

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

Die folgende Abbildung zeigt, wie der Code oben auf einer um 45° gedrehten quadratischen Form funktioniert. Beachten Sie, dass die obere linke Ecke des Begrenzungsrahmens während der Skalierung fixiert ist.

Folienskalierung

Reflexion entlang der Kante

Das Argument in scaleWidth() und scaleHeight() kann negativ sein, damit ein Seitenelement horizontal oder vertikal gespiegelt werden kann.

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.

Die folgende Abbildung zeigt, wie der Code oben bei einer um 45° gedrehten Form funktioniert. Das Seitenelement wird entlang einer Kante seines Begrenzungsrahmens, aber nicht in der Mitte gedreht.

Reflektion von Folien

Linienrotation

Wie bei anderen Seitenelementen bezieht sich die Rotation einer Linie nicht auf den vertikalen Winkel der Linie, sondern auf die Drehung ihres Begrenzungsrahmens. Wenn Sie eine Linie mit angegebenen Start- und Endpunkten erstellen, erfolgt ihre Rotation immer um 0°. Wenn Sie die Endpunkte der Linie in der Benutzeroberfläche von Google Präsentationen ziehen, werden der vertikale Winkel sowie die Größe und Position des Begrenzungsrahmens geändert. Die Drehung ändert sich jedoch nicht. Mit setRotation() wird der Begrenzungsrahmen der Linie gedreht, wodurch der vertikale Winkel effektiv geändert wird. So können zwei Linien den gleichen visuellen vertikalen Winkel, aber unterschiedliche Begrenzungsrahmen und daher unterschiedliche Werte für Größe, Position und Drehung haben.

Beschränkungen

Einige Methoden zur Größen- und Positionierung sind mit einigen Arten von Seitenelementen nicht kompatibel. In der folgenden Tabelle sind die Methoden zusammengefasst, die mit bestimmten Arten von Seitenelementen nicht kompatibel sind.

Methoden Form Video Tabelle
getHeight(), getWidth() NO (gibt null zurück)
setHeight(), setWidth() NEIN
setRotation() NEIN NEIN
scaleHeight(), scaleWidth() NEIN

Alle Methoden zur Skalierung und Positionierung können unerwartete Ergebnisse liefern, wenn das Seitenelement Scherung aufweist. Alle Einschränkungen können sich ändern. Aktuelle Informationen finden Sie in der Referenz.

affine Transformationen verwenden

Zur besseren Kontrolle können Größe und Position eines Seitenelements auch über seine inhärente (native) Größe und seine affine Transformation berechnet und angepasst werden.

Google Apps Script bietet eine ähnliche Oberfläche zur Verwendung der affine Transformation wie die Google Slides API.

  • In diesem Artikel werden die Konzepte der affinen Transformation erläutert. Außerdem erfahren Sie, wie Sie die gerenderte Größe von der inhärenten (nativen) Größe und der Transformation für Seitenelemente ableiten können. Verwenden Sie in Apps Script:
    • getInherentWidth() und getInherentHeight() für die native Größe der Seitenelemente
    • getTransform() für die affine Transformation der Seitenelemente.
  • In diesem Artikel wird beschrieben, wie Sie mithilfe der affine Transformation Seitenelemente vergrößern und positionieren, um Skalierung, Rotation, Reflexion usw. zu erreichen. Verwenden Sie in Apps Script die Verwendung von
    • setTransform(), um die affine Transformation von Seitenelementen festzulegen (ähnlich dem ASOLUTE-Modus);
    • preconcatenateTransform(), um eine affine Transformation mit der aktuellen Transformation der Seitenelemente vorzu verketten (ähnlich dem Modus RELATIVE).

Das folgende Skript erstellt eine Form, legt ihre Transformation fest, liest ihre inhärente Größe und liest ihre affine Transformation.

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.');

Die erwartete Protokollausgabe von diesem Skript sieht so aus:

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

Die resultierende Form hat folgende Transformation und wird in Größe und Position gerendert:

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°.