Relasi

5 min read

Relasi adalah perilaku-didorong link antara item. Alih-alih memindah secara manual setiap gerakan, Anda dapat mendeklarasikan hubungan seperti “orbit bulan ini di planet itu” dan PinePaper menangani animasi secara otomatis.

Relations panel showing linked items Panel Hubungan
The menunjukkan item yang terhubung dengan berbagai hubungan type

Tipe Relasi Inti

Relasi Deskripsi Penggunaan Contoh
orbit Pergerakan melingkar di sekitar target Bulan mengorbit planet
berikut Bergerak menuju target dengan smoodthing Label mengikuti karakter
dicantol _ ke Bergerak dengan target (ofset tetap) Hat di atas kepala karakter
mempertahankan _ jarak Menjaga jarak tetap dari target Elektron sekitar inti
point _ at Putar ke target wajah Panah menunjuk pada kursor
cermin Posisi cermin di seluruh sumbu Efek refleksi
paralel Pergerakan berbasis-kedalaman Scrolling latar
bounds _ to Tetap dalam batasan yang didefinisikan Bola memantul dalam kotak

Hubungan Animasi

Relasi Deskripsi Penggunaan Contoh
vectors-action Skala dari nol ke ukuran penuh Item muncul secara berurutan
_ terhuyung dengan Animasi grup dengan sempoyongan Judul huruf muncul satu per satu
mengindikasikan Pulsa sorot sementara Menarik perhatian ke objek
yang beredar dan terbenam Draws shape around target Sorot suatu elemen kunci
gelombang _ melalui Efek distorsi gelombang Riak melalui baris butir
morphs _ to Animasi pengubah bentuk Bentuk transisi ke yang lain
layers-action Lihat panci untuk mengikuti target Kamera pelacakan karakter
camera _ animata Zum / pan dengan bingkai kunci Urutan perbesaran sinematik

Relasi Animasi Procedural

Hubungan ini menciptakan animasi tanpa membutuhkan item target:

Relasi Deskripsi Penggunaan Contoh
didorong _ oleh Properti mengikuti properti lain Opasitas dikendalikan oleh posisi
wiggle Gerakan suara procedural Jittery, gerakan organik
time _ expression Ekspresi Matematika dari waktu ke waktu Osilasi gelombang sinus

Menambahkan Relasi

Dari UI

  1. Pilih * * source item * * (yang akan bergerak)
  2. Buka bagian * * Relations * * di panel Properti
  3. Pilih tipe hubungan
  4. Pilih * * target item * * (yang berhubungan dengan)
  5. Atur parameter yang diperlukan

Parameter Relasi

Setiap tipe hubungan memiliki parameter tertentu:

orbit:

Parameter Deskripsi Baku
radius Jarak dari target 100
kecepatan Kecepatan rotasi 0.5
arah clockwise atau counter-clockwise searah jarum jam
fase Mulai sudut (radian) 0

berikut:

Parameter Deskripsi Baku
ofset [x, y] ofset dari target [0, 0]
smoodthing Gerakan disapu (0-1) 0.1
tunda Ikuti penundaan dalam detik 0

wiggle:

Parameter Deskripsi Baku
frekuensi Osilasi per detik 2
amplitudo Perpindahan maksimum (px) 10
properti position, rotation, opacity, scale posisi
benih Nilai benih yang dapat direproduksi 0

time _ expression:

Parameter Deskripsi
properti Properti untuk dianimasi (x, y, rotation, opacity, scale)
ekspresi Ekspresi matematika menggunakan t (waktu) dan v (nilai dasar)

Fungsi yang tersedia: sin, cos, abs, floor, ceil, sqrt, pow, min, max, clamp, lerp, lerp, smoothstep

Item orbiting another item
A lingkaran kecil mengorbit yang lebih besar menggunakan "orbit" diffi

Relasi Tergulung Waktu

Relasi hanya dapat aktif selama jendela waktu tertentu:

Parameter Deskripsi
startTime Ketika hubungan mengaktifkan (detik)
akhir Waktu Ketika hubungan menonaktifkan (detik)
autoHapus Otomatis hapus setelah akhir Waktu

Hal ini memungkinkan Anda membuat urutan di mana item mengubah perilaku dari waktu - misalnya, orbit item selama 3 detik, kemudian mengikuti selama 2 detik.

Animasi Kamera

Hubungan camera_animates menciptakan zoom sinematik dan urutan pan:

  1. Tambahkan hubungan camera_animates untuk membuat pergerakan kamera keyframed
  2. Tentukan tingkat zum dan posisi tengah pada waktu yang berbeda
  3. Titik lihat animata lancar antara keyframes

Ini sempurna untuk presentasi, tutorial, dan intros sinematik di mana Anda ingin membimbing perhatian penonton.

Tips

    • Composable: * * Beberapa hubungan dapat diterapkan ke item yang sama. Mereka menerapkan urutan masing-masing frame, sehingga Anda dapat menggabungkan orbits dengan wiggle untuk kompleks gerakan organik.
      • Mulai sederhana * * - Mulai dengan follows atau attached_to sebelum mencoba setup kompleks
      • Gunakan waktu-scoping * * - Buat urutan dengan memberikan hubungan jendela waktu yang berbeda
      • Combine with keyframes * * - Relations and keyframe animations can work together
      • Pratilik sering * * - Putar timeline untuk melihat bagaimana hubungan berinteraksi
    • Terkait: * * [Animasi] (/features/animations) £124; [Keyframe Editor] (/features/keyframes)