หน้านี้ได้รับการแปลโดย Cloud Translation API

การแปลงและองค์ประกอบของหน้า
จัดทุกอย่างให้เป็นระเบียบอยู่เสมอด้วยคอลเล็กชัน บันทึกและจัดหมวดหมู่เนื้อหาตามค่ากำหนดของคุณ

คู่มือนี้จะอธิบายแนวคิดพื้นฐานที่ใช้ในการเปลี่ยนรูปแบบ (นั่นคือ การย้าย การหมุน การปรับขนาด และการบิดเบือน) องค์ประกอบของหน้า โดยเน้นที่การเปลี่ยนรูปแบบเชิงเชิงเส้นพื้นฐานและการดำเนินการของการเปลี่ยนรูปแบบ

ดูข้อมูลเพิ่มเติมเกี่ยวกับวิธีใช้การเปลี่ยนรูปแบบเชิงเชิงเส้นเพื่อให้ได้ผลลัพธ์ที่ต้องการได้ที่คู่มือปรับขนาดและตำแหน่งรูปร่าง

ขนาดและตําแหน่งที่มองเห็นได้ขององค์ประกอบหน้าเว็บจะควบคุมโดยพร็อพเพอร์ตี้ 2 อย่าง ได้แก่ size และ transform ขนาดจะอธิบายขนาดที่เหมาะสมหรือขนาดที่สร้างไว้ล่วงหน้าขององค์ประกอบหน้าเว็บที่สร้าง การแปลงจะระบุเมทริกซ์การเปลี่ยนรูปแบบเชิงเชิงเส้น 2 มิติซึ่งระบุวิธีเปลี่ยนรูปแบบของออบเจ็กต์ที่มีขนาดในตัวเพื่อให้ได้ลักษณะที่ปรากฏสุดท้าย

แผนภาพของรูปร่างที่แสดงผลผ่านการแปลงเชิงเชิงเส้น

เมื่อคุณเลือกองค์ประกอบหน้าใน UI ของสไลด์และเปลี่ยนขนาดที่มองเห็นได้โดยใช้แถบปรับ คุณกำลังอัปเดตเมทริกซ์การเปลี่ยนรูปแบบนี้ การย้ายองค์ประกอบไปทั่วหน้าเว็บหรือการหมุนองค์ประกอบจะอัปเดตเมทริกซ์การเปลี่ยนรูปแบบขององค์ประกอบด้วย

ใช้ UI ของสไลด์เพื่อเริ่มต้นใช้งาน

คณิตศาสตร์เมทริกซ์ที่คุณใช้เปลี่ยนรูปแบบและปรับขนาดองค์ประกอบหน้าเว็บมีประสิทธิภาพมาก แต่ก็อาจดูน่ากลัวในตอนแรก เนื้อหาส่วนใหญ่ในหน้านี้อธิบายการคำนวณเหล่านี้ อย่างไรก็ตาม คุณสามารถลดความซับซ้อนของข้อกําหนดของการเปลี่ยนรูปแบบและขนาดได้โดยใช้แนวทางต่อไปนี้

สร้างองค์ประกอบหน้าเว็บโดยใช้ UI ของสไลด์
ปรับขนาดองค์ประกอบของหน้าเว็บเหล่านี้ตามต้องการโดยยังคงใช้ UI ของสไลด์
อ่านขนาดและการเปลี่ยนรูปแบบขององค์ประกอบเหล่านั้นโดยใช้เมธอด get

ข้อมูลนี้น่าจะเพียงพอสําหรับการเริ่มต้นใช้งาน ส่วนที่เหลือของคู่มือนี้จะอธิบายการคํานวณการเปลี่ยนรูปแบบที่คุณสามารถใช้เพื่อจัดการองค์ประกอบหน้าเว็บอย่างละเอียด

เมทริกซ์การเปลี่ยนรูปแบบเชิงเชิงเส้น

ไลบรารีกราฟิกมักใช้เมทริกซ์การเปลี่ยนรูปแบบเชิงเชิงเส้น 2 มิติเพื่อควบคุมการปรับขนาด การหมุน การบิดเบือน การสะท้อน และการเปลี่ยนตำแหน่งขององค์ประกอบ ใน Slides API การเปลี่ยนรูปแบบขององค์ประกอบหน้าเว็บจะแสดงเป็นเมทริกซ์ 3x3 ดังนี้

$$A=\begin{bmatrix} scale\_x & shear\_x & translate\_x\\ shear\_y & scale\_y & translate\_y\\ 0 & 0 & 1 \end{bmatrix}$$

พารามิเตอร์ที่ใช้ในการเปลี่ยนรูปแบบ ได้แก่

`translate_x`	พารามิเตอร์ translate จะระบุตำแหน่ง (X,Y) ของมุมซ้ายบนขององค์ประกอบหน้าเว็บ โดยสัมพันธ์กับมุมซ้ายบนของหน้า คุณระบุตำแหน่งแบบสัมพัทธ์ได้โดยใช้หน่วยของจุด (pt) หรือหน่วยเมตริกอังกฤษ (EMU)
`translate_y`
`scale_x`	พารามิเตอร์ขนาดควบคุมขนาดขององค์ประกอบหน้าเว็บเมื่อแสดงผล เหล่านี้คือตัวคูณที่ไม่มีหน่วย เช่น ค่า `scale_x` ที่ 1.5 จะขยายความกว้างขององค์ประกอบขึ้น 50%
`scale_y`
`shear_x`	พารามิเตอร์การเลื่อนยังไม่มีหน่วยและควบคุมการเอียงขององค์ประกอบหน้าเว็บด้วย คุณใช้พารามิเตอร์การปรับขนาดและการหักงอร่วมกันเพื่อหมุนองค์ประกอบหน้าเว็บได้
`shear_y`

คุณดูตัวอย่างมากมายบนเว็บที่แสดงวิธีที่เมทริกซ์การเปลี่ยนรูปแบบ 2 มิติส่งผลต่อการแสดงผลวัตถุกราฟิกได้

เมทริกซ์การเปลี่ยนรูปแบบจะสัมพันธ์กับกลุ่มหรือหน้าเว็บขององค์ประกอบ เช่น หากคุณหมุนกลุ่มที่มีสี่เหลี่ยมผืนผ้า ค่าในช่อง transform ของกลุ่มจะแสดงการหมุน แต่ค่าในช่อง transform ของสี่เหลี่ยมผืนผ้าจะไม่แสดงการหมุน

การคำนวณขนาดภาพ

หากต้องการกำหนดขนาดที่มองเห็นได้ (แสดงผล) ขององค์ประกอบหน้าเว็บ คุณต้องพิจารณาทั้งพร็อพเพอร์ตี้ขนาดและการเปลี่ยนรูปแบบร่วมกัน คุณไม่สามารถระบุได้ว่าองค์ประกอบหน้าเว็บ 2 รายการใดมีขนาดใหญ่กว่ากันเพียงจากการเปรียบเทียบพร็อพเพอร์ตี้ขนาดขององค์ประกอบ คุณต้องแมปขอบเขตขององค์ประกอบโดยใช้เมทริกซ์การเปลี่ยนรูปแบบและคำนวณขนาดที่แสดงผล

การแมปจุด

หากต้องการแมปจุดที่เฉพาะเจาะจงโดยใช้เมทริกซ์การเปลี่ยนรูปแบบ ให้แปลงจุด (x, y) เป็นเวกเตอร์ [x, y, 1] แล้วทำการคูณเมทริกซ์ ลองดูการแมปจุด p

\[p' = Ap\]

ซึ่งจะกลายเป็น

$$\begin{bmatrix} x'\\ y'\\ 1 \end{bmatrix} =\begin{bmatrix} scale\_x & shear\_x & translate\_x\\ shear\_y & scale\_y & translate\_y\\ 0 & 0 & 1 \end{bmatrix} \begin{bmatrix} x\\ y\\ 1 \end{bmatrix}$$

ดังนั้นพิกัดของจุดใหม่ p' คือ

$$x' = (scale\_x \times x) + (shear\_x \times y) + translate\_x\\ y' = (scale\_y \times y) + (shear\_y \times x) + translate\_y$$

การคำนวณขอบเขต

หากต้องการกำหนดขนาดที่แสดงผลของกล่องขอบเขตขององค์ประกอบหลังจากการเปลี่ยนรูปแบบที่มีการบิดเบือนและปรับขนาด ให้ใช้

$$width' = (scale\_x \times width) + (shear\_x \times height)\\ height' = (scale\_y \times height) + (shear\_y \times width)$$

ข้อจำกัด

ช่องการปรับขนาดและการวางตำแหน่งบางช่องใช้ไม่ได้กับองค์ประกอบหน้าเว็บบางประเภท ตารางด้านล่างแสดงสรุปความเข้ากันได้ขององค์ประกอบหน้าเว็บบางรายการกับฟิลด์การปรับขนาดและการวางตำแหน่ง

ช่อง	รูปร่าง	วิดีโอ	ตาราง
คำแปล	✔	✔	✔
Scale	✔	✔	ไม่**
การเลื่อน	✔	ไม่	ไม่

** หากต้องการอัปเดตมิติข้อมูลแถวและคอลัมน์ของตาราง ให้ใช้ UpdateTableRowPropertiesRequest และ UpdateTableColumnPropertiesRequest

ช่องการปรับขนาดและตำแหน่งทั้งหมดอาจให้ผลลัพธ์ที่ไม่คาดคิดหากองค์ประกอบหน้าเว็บมีการตัดเฉือน ข้อจำกัดทั้งหมดอาจมีการเปลี่ยนแปลง ดูข้อมูลล่าสุดได้ที่ Google Slides API