שינוי גודל ומיקום הרכיבים בדף

במדריך הזה מוסבר איך משנים את הגודל ואת המיקום של רכיבים בדף באמצעות טרנספורמציות זיקה. למבוא למושגים של טרנספורמציות בתחום, עיינו במדריך הקונספט טרנספורמציות.

טרנספורמציה של אלמנטים

ה-API של Slides מאפשר לשנות את המיקום של רכיבים בדף ולשנות את הגודל שלהם. כדי לעשות זאת, קודם צריך לקבוע את סוג הטרנספורמציה שצריך להחיל, ואז להחיל את הטרנספורמציה הזו באמצעות ה-method presentations.batchUpdate שמכילה רכיב UpdatePageElementTransformRequest אחד או יותר.

אפשר לבצע טרנספורמציות באחת משני applyModes:

• ABSOLUTE מבצעת טרנספורמציה להחליף את מטריצת הטרנספורמציה הקיימת של הרכיב. כל הפרמטרים שתשמיטו מבקשת העדכון של הטרנספורמציה יוגדרו כאפס.

• התמרות RELATIVE מוכפלות במטריצת הטרנספורמציה הקיימת של האלמנט (סדר הכפלות):

$$A' = BA$$

המרות יחסיות מזיזות או משנים את קנה המידה של רכיב הדף מהמיקום הנוכחי שלו. לדוגמה, הזזת צורה 100 נקודות שמאלה או סיבוב של 40 מעלות. טרנספורמציות מוחלטות מבטלות מידע קיים על מיקום וקנה מידה; לדוגמה, העברת צורה למרכז הדף או שינוי קנה המידה שלה לרוחב ספציפי.

בדרך כלל אפשר לבטא טרנספורמציות מורכבות כרצף של טרנספורמציות פשוטות יותר. חישוב מראש של טרנספורמציה – שילוב של מספר טרנספורמציות באמצעות הכפלת מטריצה – יכול בדרך כלל לצמצם את התקורה.

הסדר של פעולות הטרנספורמציה חשוב - ברוב המקרים, ביצוע רוטציה של רכיב לגבי נקודה ואז התרגום יפיק תוצאות שונות מאשר תרגום קודם.

בפעולות מסוימות צריך לדעת מהם הפרמטרים הקיימים של מאפיין הטרנספורמציה. אם אין את הערכים האלה, אפשר לאחזר אותם באמצעות בקשת presentations.pages.get.

תרגום

תרגום הוא הפעולה של העברה של רכיב בדף למיקום חדש באותו הדף. תרגומים מוחלטים מעבירים את הרכיב לנקודה ספציפית, ותרגומים יחסיים מעבירים את הרכיב למרחק ספציפי.

חשוב לזכור שהפרמטרים של התרגום מציינים את מיקום הפינה השמאלית העליונה של האלמנט, ולא את המרכז שלו.

מטריצת טרנספורמציה בסיסית של תרגום נראית כך:

$$T=\begin{bmatrix} 1 & 0 & translate\_x\\ 0 & 1 & translate\_y\\ 0 & 0 & 1 \end{bmatrix}$$

כשמשתמשים ב-UpdatePageElementTransformRequest כדי לתרגם רכיב (בלי לשנות את הגודל, הגזירה או הכיוון שלו), אפשר להשתמש באחד מהמבנהים הבאים של AffineTransform:

// Absolute translation:
{
  'transform': {
    'scaleX':  current scaleX value,
    'scaleY':  current scaleY value,
    'shearX':  current shearX value,
    'shearY':  current shearY value,
    'translateX': X coordinate to move to,
    'translateY': Y coordinate to move to,
    'unit': 'EMU' // or 'PT'
  }
}

// Relative translation (scaling must also be provided to avoid a matrix multiplication error):
{
  'transform': {
    'scaleX':  1,
    'scaleY':  1,
    'translateX': X coordinate to move by,
    'translateY': Y coordinate to move by,
    'unit': 'EMU' // or 'PT'
  }
}

שינוי קנה מידה

הרחבה היא הפעולה של מתיחה או לחיצה של אלמנט לאורך המימד X ו/או Y כדי לשנות את הגודל שלו. מטריצה בסיסית של טרנספורמציה לעומס (scaling) נראית כך:

$$S=\begin{bmatrix} scale\_x & 0 & 0\\ 0 & scale\_y & 0\\ 0 & 0 & 1 \end{bmatrix}$$

אפשר להשתמש במטריצה הזו ישירות בתור טרנספורמציה של RELATIVE כדי לשנות את הגודל של רכיב, אבל זה יכול להשפיע גם על צורת הגזירה והתרגום של הרכיב. כדי לשנות את גודל הרכיב בלי להשפיע על הגזירה או התרגום, עוברים למסגרת ההפניה שלו.

סיבוב

שינויי סיבוב מסובבים רכיב דף מסביב לנקודה, באמצעות הפרמטרים 'שינוי קנה מידה' ו'חיתוך'. מטריצת הטרנספורמציה הבסיסית של הסיבוב מוצגת בצורה הבאה, שבה זווית הסיבוב (ברדיאנים) נמדדת מציר ה-X ונעה נגד כיוון השעון:

$$R=\begin{bmatrix} cos(\theta) & sin(\theta) & 0\\ -sin(\theta) & cos(\theta) & 0\\ 0 & 0 & 1 \end{bmatrix}$$

בדומה להתאמה לעומס (scaling), אפשר להשתמש בצורת המטריצה הזו ישירות בתור טרנספורמציה של RELATIVE כדי לבצע סיבוב רכיב, אבל פעולה זו תגרום לסיבוב של הרכיב לגבי מקור הדף. כדי לסובב את הרכיב סביב המרכז או נקודה אחרת, עוברים למסגרת ההפניה הזו.

איך המרגש?

השתקפות משקפת רכיב על קו או ציר מסוים. מטריצת הטרנספורמציה של ההשתקפות בציר ה-x וציר ה-Y נראית בצורות הבאות:

$$F_x=\begin{bmatrix} 1 & 0 & 0\\ 0 & -1 & 0\\ 0 & 0 & 1\\ \end{bmatrix}\qquad\qquad F_y=\begin{bmatrix} -1 & 0 & 0\\ 0 & 1 & 0\\ 0 & 0 & 1\\ \end{bmatrix}$$

בדומה להתאמה לעומס (scaling), אפשר להשתמש במטריצה הזו ישירות בתור טרנספורמציה של RELATIVE כדי לשקף רכיב, אבל פעולה זו תגרום גם לתרגום של הרכיב. כדי לשקף את הרכיב ללא תרגום, עוברים למסגרת ההפניה שלו.

מסגרות עזר לרכיבים

החלה של קנה מידה בסיסי, השתקפות או סבב טרנספורמציה ישירות על רכיב בדף יוצרת טרנספורמציה במסגרת ההתייחסות של הדף. לדוגמה, סיבוב בסיסי מסובב את הרכיב של מקור הדף (הפינה השמאלית העליונה). עם זאת, אפשר לבצע פעולות במסגרת הייחוס של הרכיב עצמו, לדוגמה לבצע סיבוב של רכיב סביב נקודת המרכז שלו.

כדי לבצע טרנספורמציה של רכיב בתוך מסגרת העזר שלו, תוחמים אותו בין שני תרגומים אחרים: תרגום קודם T1 שמעביר את מרכז הרכיבים למקור הדף, והתרגום הבא T2 שמחזיר את הרכיב למיקום המקורי שלו. הפעולה המלאה יכולה לבטא כמכפלה של מטריצה:

$$A' = T2 \times B \times T1 \times A$$

אפשר גם לעבור למסגרות עזר אחרות על ידי תרגום נקודות שונות למקור במקום זאת. הנקודות האלה הופכות למרכז של מסגרת העזר החדשה.

אפשר לבצע כל אחת מהטרנספורמציות האלה בנפרד כבקשות טרנספורמציה של RELATIVE עוקבות. במצב אידיאלי, כדאי לחשב מראש את A' שלמעלה עם הכפלה של מטריצות, ולהחיל את התוצאה כטרנספורמציה אחת של ABSOLUTE. לחלופין, אפשר לחשב מראש את המכפלה T2 * B * T1 ולהחיל אותה כטרנספורמציה אחת של RELATIVE. שתי הדרכים יעילות יותר מבחינת פעולות ה-API, ולאחר מכן שליחת בקשות הטרנספורמציה בנפרד.

מגבלות

חלק משדות הגודל והמיקום לא תואמים לסוגים מסוימים של רכיבי דף. הטבלה הבאה מסכמת את התאימות של אלמנטים מסוימים בדף לשדות של גודל ומיקום.

שדה	צורה	וידאו	טבלה
תרגום	✔	✔	✔
קנה מידה	✔	✔	לא**
השמיעה	✔	לא	לא

** כדי לעדכן את המאפיינים של השורות והעמודות בטבלה, משתמשים ב-UpdateTableRowPropertiesRequest וב-UpdateTableColumnPropertiesRequest.

כל שדות הגודל והמיקום עשויים לספק תוצאות בלתי צפויות אם לרכיב הדף יש גזירה. כל המגבלות כפופות לשינויים. למידע עדכני, ראו Google Slides API.

יכול להיות ש-Slides API יעצב מחדש את הערכים

כשיוצרים רכיב בדף, אפשר לציין גודל וטרנספורמציה כדי לספק תוצאה חזותית מסוימת. עם זאת, יכול להיות שה-API יחליף את הערכים שסיפקתם בערכים אחרים שמניבים את אותו מראה חזותי. באופן כללי, אם כותבים גודל באמצעות ה-API, לא מובטח שיוחזרו אותו גודל. עם זאת, אם תיקחו את הטרנספורמציה, תקבלו את אותן התוצאות.