Panduan ini menjelaskan konsep dasar yang digunakan dalam mengubah (yaitu, memindahkan, memutar, menskalakan, dan memiringkan) elemen halaman, yang berfokus terutama pada transformasi afin yang mendasarinya dan operasinya.
Untuk mengetahui informasi selengkapnya tentang cara menggunakan transformasi afin untuk mencapai hasil tertentu, lihat panduan Bentuk Ukuran dan Posisi.
Ukuran visual dan posisi elemen halaman dikontrol oleh dua properti: size dan transform. Ukuran menjelaskan ukuran ideal atau bawaan elemen halaman yang dibuat. Transformasi menentukan matriks transformasi afin dua dimensi yang menentukan cara objek pada ukuran bawaannya ditransformasikan sehingga menghasilkan tampilan visual akhirnya.
Saat memilih elemen halaman di UI Slide dan mengubah ukuran visualnya menggunakan handle penyesuaian, Anda sebenarnya memperbarui matriks transformasi ini. Memindahkan elemen di seluruh halaman atau memutarnya juga akan memperbarui matriks transformasi elemen.
Menggunakan UI Slide untuk memulai
Aritmetika matriks yang Anda gunakan untuk mengubah dan mengubah ukuran elemen halaman sangat canggih, tetapi pada awalnya dapat membingungkan; sebagian besar halaman ini menjelaskan penghitungan ini. Namun, Anda dapat menyederhanakan spesifikasi transformasi dan ukuran menggunakan pendekatan berikut:
- Buat elemen halaman menggunakan UI Slide.
- Skalakan posisi elemen halaman ini sesuai keinginan, tetap menggunakan UI Slide.
- Baca ukuran dan transformasi elemen tersebut menggunakan metode get.
Hal ini sudah cukup untuk memulai; bagian selanjutnya dari panduan ini menjelaskan penghitungan transformasi yang dapat Anda gunakan untuk memanipulasi elemen halaman secara mendetail.
Matriks transformasi afin
Matriks transformasi afin dua dimensi biasanya digunakan oleh library grafik untuk mengontrol skala, rotasi, geser, refleksi, dan terjemahan elemen. Di Slides API, transformasi elemen halaman direpresentasikan sebagai matriks 3x3:
Parameter yang digunakan dalam transformasi adalah:
translate_x |
Parameter terjemahan menentukan posisi (X,Y) sudut kiri atas elemen halaman, relatif terhadap sudut kiri atas halaman. Anda menentukan posisi relatif menggunakan Unit dari titik (pt) atau unit metrik Inggris (EMU). |
translate_y
| |
scale_x
| Parameter skala mengontrol seberapa besar elemen halaman saat
dirender. Ini adalah faktor pengganda tanpa satuan; misalnya, nilai scale_x
1,5 akan memperbesar lebar elemen sebesar 50%.
|
scale_y
| |
shear_x
| Parameter geser juga tidak memiliki satuan dan mengontrol kemiringan elemen halaman. Parameter penskalaan dan pergeseran dapat digunakan bersama untuk memutar elemen halaman. |
shear_y |
Anda dapat menemukan banyak contoh di web yang menunjukkan cara matriks transformasi 2D memengaruhi rendering objek grafis.
Matriks transformasi bersifat relatif terhadap grup atau halaman yang berisi elemen. Misalnya, jika Anda memutar grup yang berisi persegi panjang,
nilai kolom transform
grup akan mencerminkan rotasi, tetapi nilai kolom transform
persegi panjang tidak.
Menghitung ukuran visual
Untuk menentukan ukuran visual (dirender) elemen halaman, Anda harus mempertimbangkan properti ukuran dan transformasi secara bersamaan. Anda tidak dapat menentukan mana dari dua elemen halaman yang secara visual lebih besar hanya dengan membandingkan properti ukurannya: Anda harus memetakan batas elemen menggunakan matriks transformasi dan menghitung ukuran yang dirender.
Memetakan titik
Untuk memetakan titik tertentu menggunakan matriks transformasi, konversikan titik (x, y) menjadi vektor [x, y, 1], lalu lakukan perkalian matriks. Pertimbangkan pemetaan titik p:
Hal ini menjadi:
Oleh karena itu, koordinat titik baru p' adalah:
Menghitung batas
Untuk menentukan ukuran yang dirender dari kotak pembatas elemen setelah transformasi yang memiringkan dan menskalakan, gunakan:
Untuk mengetahui informasi selengkapnya tentang cara menggunakan transformasi afin untuk mencapai hasil tertentu, lihat panduan Bentuk Ukuran dan Posisi.
Batasan
Beberapa kolom ukuran dan pemosisian tidak kompatibel dengan beberapa jenis elemen halaman. Tabel di bawah ini merangkum kompatibilitas elemen halaman tertentu dengan kolom ukuran dan pemosisian.
Kolom | Bentuk | Video | Tabel |
---|---|---|---|
Translation | ✔ | ✔ | ✔ |
Menskalakan | ✔ | ✔ | Tidak** |
Shear | ✔ | Tidak | Tidak |
** Untuk memperbarui dimensi baris dan kolom tabel, gunakan
UpdateTableRowPropertiesRequest
dan
UpdateTableColumnPropertiesRequest
.
Semua kolom ukuran dan pemosisian dapat memberikan hasil yang tidak terduga jika elemen halaman memiliki pergeseran. Semua batasan dapat berubah sewaktu-waktu. Untuk informasi terbaru, lihat Google Slides API.