Istnieją 2 sposoby pobierania i zmieniania rozmiaru oraz pozycji elementu strony:
- Użycie funkcji pobierania i ustalania do określania rozmiaru i pozycji.
- Manipulowanie przekształceniem afinicznym za pomocą funkcji
getTransform()isetTransform()przy zachowaniu rozmiaru wewnętrznego.
Odczytywanie właściwości elementu strony
Jak widać na ilustracji, rozmiar i położenie są mierzone w odniesieniu do ramki ograniczającej renderowanego elementu strony, gdy nie jest on obracany:
- Lewo i Góra: mierzone od lewego górnego rogu strony do lewego górnego rogu nieobróconej ramki ograniczającej. Użyj
getLeft()igetTop(), aby odczytać wartości. - Szerokość i Wysokość: szerokość i wysokość nieobróconej ramki ograniczającej.
Użyj
getWidth()igetHeight(), aby odczytać wartości. - Obrót: obrót w prawo względem pionowej linii wokół środka ramki ograniczającej. Użyj
getRotation(), aby odczytać wartość.
Wszystkie długości są mierzone w punktach (pkt). Obrót jest mierzony w stopniach (°).
Ustawianie właściwości elementu strony
Rozmiar i pozycję elementu strony możesz ustawić podczas jego tworzenia za pomocą metody wstawiania, takiej jak insertShape(). W przypadku istniejącego kształtu możesz ustawić rozmiar, położenie i obrót, a także ustawić skalowanie elementu, aby zmienić jego rozmiar lub odzwierciedlić go wzdłuż jednej z jego krawędzi.
W momencie utworzenia
Podczas tworzenia elementu strony możesz podać informacje o pozycji i rozmiarze.
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.');
Powyższy skrypt tworzy kształt na pierwszym slajdzie aktywnej prezentacji o określonym położeniu i rozmiarze oraz odczytuje informacje o położeniu i rozmiarze kształtu. Oczekiwany dziennik:
Left: 100pt; Top: 200pt; Width: 300pt; Height: 60pt; Rotation: 0 degrees.
Rozmiar, położenie i obrót
Rozmiar i pozycję elementu strony możesz zmienić po jego utworzeniu:
- Użyj elementów
setLeft()isetTop(), by ustawić położenie lewego górnego rogu nieobróconej ramki ograniczającej. - Użyj właściwości
setWidth()isetHeight(), aby ustawić renderowaną szerokość i wysokość ramki ograniczającej. - Użyj właściwości
setRotation(), aby ustawić obrót ramki ograniczającej w prawo wokół jej środka.
Poniższy skrypt tworzy kształt na pierwszym slajdzie aktywnej prezentacji, używa elementów ustawiających, aby zaktualizować jego pozycję, rozmiar i obrót, a także odczytuje informacje o położeniu i rozmiarze kształtu.
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.');
Oczekiwane dane wyjściowe tego skryptu w dzienniku:
Left: 100pt; Top: 200pt; Width: 50pt; Height: 60pt; Rotation: 90°.
Ustawienia rozmiaru, pozycji i rotacji mogą być używane w dowolnej kolejności i w dowolnej kombinacji. Zastąpienie trzeciego wiersza powyżej poniższym skryptem spowoduje taki sam efekt:
shape.setWidth(55);
shape.setRotation(90).setHeight(60).setLeft(100);
shape.setWidth(50).setTop(200);
Skalowanie
Zamiast używać właściwości setWidth() i setHeight() powyżej, aby ustawić rozmiar kształtu na wartość bezwzględną, możesz używać właściwości scaleWidth() i scaleHeight() do rozciągania lub ściśnięcia elementu strony ze względnym współczynnikiem skalowania.
shape.scaleHeight(0.5).scaleWidth(2);
Poniższy rysunek pokazuje, jak działa powyższy kod na kwadratowym kształcie obróconym pod kątem 45°. Pamiętaj, że lewy górny róg ramki ograniczającej jest stały podczas skalowania.
Odbicie wzdłuż krawędzi
Argumenty w funkcjach scaleWidth() i scaleHeight() mogą być ujemne, więc można ich użyć do odwrócenia elementu strony w pionie lub poziomie.
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.
Ilustracja poniżej pokazuje, jak działa kod w przypadku kształtu ustawionego pod kątem 45°. Zauważ, że element strony jest obrócony wzdłuż jednej z krawędzi ramki ograniczającej, ale nie do środka.
Obrót linii
Podobnie jak w przypadku innych elementów strony obrót linii nie wyznacza jej pionowego kąta, ale obrót ramki ograniczającej. Gdy utworzysz linię z określonym punktem początkowym i końcowym, jej obrót wynosi zawsze 0°. Przeciąganie punktów końcowych linii w interfejsie Prezentacji Google zmienia jej kąt pionowy, a także rozmiar i położenie ramki ograniczającej, ale nie zmienia jej obrotu. Użycie funkcji setRotation() powoduje obrócenie ramki ograniczającej linii, co w praktyce zmienia jej kąt pionowy. Oznacza to, że 2 linie mogą mieć ten sam wizualny kąt pionowy, ale różne ramki ograniczające, a tym samym różne wartości rozmiaru, położenia i obrotu.
Ograniczenia
Niektóre metody określania rozmiaru i pozycjonowania są niezgodne z niektórymi typami elementów strony. W tabeli poniżej znajdziesz zestawienie metod, które są niezgodne z określonymi typami elementów strony.
| Metody | Kształt | Wideo | Tabela |
|---|---|---|---|
| getHeight(), getWidth() | ✔ | ✔ | NO (zwraca wartość null) |
| setHeight(), setWidth() | ✔ | ✔ | NIE |
| setRotation() | ✔ | NIE | NIE |
| scaleHeight(), scaleWidth() | ✔ | ✔ | NIE |
Wszystkie metody dobierania rozmiaru i pozycjonowania mogą dawać nieoczekiwane rezultaty, jeśli element strony jest ścięty. Wszystkie ograniczenia mogą ulec zmianie. Aktualne informacje znajdziesz w dokumentacji.
Korzystanie z przekształceń afinicznych
W przypadku zaawansowanej kontroli rozmiar i położenie elementu strony można też obliczać i dostosowywać na podstawie jego rozmiaru (natywnego) i przekształcenia afinansowego.
Skrypt Google Apps Script ma podobny interfejs, w którym można korzystać z przekształcania afinansowego w interfejsie API Prezentacji Google.
- W tym artykule wyjaśniamy koncepcje przekształcenia afinacyjnego oraz wnioskowanie o wyrenderowany rozmiar na podstawie rozmiaru wewnętrznego i przekształcenia elementów strony. W Apps Script użyj polecenia:
getInherentWidth()igetInherentHeight()dla natywnego rozmiaru elementów strony;getTransform()dla przekształcenia afinacyjnego elementów strony.
- W tym artykule opisujemy, jak dopasować rozmiar i położenie elementów strony za pomocą przekształcenia afinacyjnego, aby uzyskać skalowanie, obrót, odbicie itp. W Apps Script użyj polecenia
setTransform(), aby ustawić przekształcenie afiniczne elementów strony (podobnie do trybu ABSOLUTE),preconcatenateTransform(), aby wstępnie połączyć przekształcenie afiniczne do bieżącego przekształcenia elementów strony (podobnie do trybu RELATIVE).
Poniższy skrypt tworzy kształt, ustawia jego przekształcenie, odczytuje jego rozmiar i odczytuje przekształcenie afiniczne.
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.');
Oczekiwane dane wyjściowe tego skryptu w dzienniku:
Inherent width: 236.2pt; Inherent height: 236.2pt.
Powstały kształt będzie miał następujące przekształcenie oraz wyrenderowany rozmiar i pozycję:
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°.