Editor ng Keyframe

Lumikha ng mga komplikado, eksaktong-timed animation gamit ang keyframes.

Ano ba ang Keyframes?

Ipinakikita ng Keyframes ang espesipikong mga pamantayan sa pag - aari sa espesipikong mga punto sa panahon. PinePaper awtomatikong may-akda (interpolates) sa pagitan ng keyframes upang lumikha ng mga makinis na transaksyon.

Pagbubukas ng Orasan

Ang panel ng Timeline ay nasa ilalim ng screen. Kung nakatago:

1. Click ***** sa menu
2. Pumili Ipakita ang Timeline**

Paglikha ng mga Susi

Pamamaraan 1: Tamang Paraan

1. Pumili ng isang bagay
2. Ilagay ang headhead sa nais na panahon
3. Palitan ang isang ari - arian (position, scale, opacity, kulay)
4. Awtomatikong nililikha ang isang keyframe

Pamamaraan 2: Tala ng Oras

1. Pumili ng isang bagay
2. Klick sa timeline sa nais na oras
3. Click Ad Keyframe o pindutin ang K

Tamang mga Bagay na Mahahalagang Susi

Pag - aayos ng mga Tipora

Paglilipat ng mga Susi

Drag isang keyframe kaliwa o pakanan sa timeline upang baguhin ang oras nito.

Nagbabagong mga Pamantayan

1. Click sa isang keyframe upang piliin ito
2. Paunlarin ang mga pamantayan sa Tamang Paraan
3. Ang mga pagbabago ay kapit sa susiang iyan

Pag - aalis ng mga Tipora

1. Piliin ang keyframe
2. Press Delete or right-click → Delete Keyframe******

Nag - uumapaw na mga Katuwaan

Supilin ang bilis ng mga anime sa pagitan ng mga keyfame:

Mga Pagkontrol sa Laro

Trist at Paghihiwalay

Ang bawat keyframe-animated na bagay ay lumilitaw sa timeline bilang isang dragging clip block (ang indigo bar sa likod ng keyframe na mga brilyante). Ang clip block ay nagpapahintulot sa iyo:

• Drag ang katawan — ilipat ang buong animation sa canvas time (timeOffset).
• Drag ang kaliwang gilid — Minaliit ang simula ng tumutugtog na sub-ranggo. Ang kanang gilid ng barangay ay nananatiling nakaangkla, na tumutugma sa kombensiyong Premiere/Canva.
• Drag ang kanang gilid — pinaliit ang dulo ng tumutugtog na sub-range, na naipit sa huling keyframe’s time.
• Pres S na ang playhead sa loob ng clip — ay nahati sa playhead. Ang bagong piraso ay nagiging sarili nitong rehistrong entry; ang mga biyak ng kadena ay lumilikha ng N+1 independiyenteng piraso.

Mga Data field

Ang clip-block UI maps sa mga field na ito sa item:

Sa labas ng canvas window ng clip ang bagay ay nakatago sa pamamagitan ng visible=false — ang opacity ay naiiwang nag-iisa kaya ang opacity-animating keyframes ay gumagana pa rin sa loob ng bintana.

// Programmatic equivalent of right-edge trim.
const item = app.create('text', {
  content: 'Reveal', x: 400, y: 300,
  animationType: 'keyframe',
  timeOffset: 2,        // clip starts at canvas time 2s
  clipInPoint: 1,       // skip the first 1s of keyframe data
  clipOutPoint: 4,      // stop at 4s of keyframe data → 3s clip window
  keyframes: [
    { time: 0, properties: { opacity: 0 } },
    { time: 1, properties: { opacity: 1 } },
    { time: 4, properties: { opacity: 0.3 } },
  ],
});

Kung ano ang nagbibigay sa iyo ng paghihiwalay

Ang split ay isang malalim na kopya. Ang bagay na Paper.js ay kinokopya sa pamamagitan ng Item.clone() (Greaters change + style); ang keyframe arrays (keyframes, contentKeyframes, propertyEasings) ay JSON round-tripped kaya ang bawat piraso ay nagmamay-ari ng datos nito. Ang pagkokodigo ay gumagampan ng mga kaliskis na li halos: Ang N splits ⇒ N+1 independiyenteng piraso, bawat isa ay ang sarili nitong rehistrong entry. Praktikal na mga resulta:

• Per-epice release — palitan ang isang solong keyframe’s easing sa isang piraso; ang iba ay hindi pa naaano.
• Per-piece na kulay o halaga interpolasyon — I - edit ang fillColor, strokeColor, o anumang masiglang pag - aari sa isang piraso upang maglagay ng ibang pagbabago sa bintana nito. Ang umiiral na kulay at mga ugpungang interpolator ay humahawak ng HSL/PRGB lerp hindi nagbabago.
• Per-piece spinial path — Ang spatialHandles ay nakatira sa loob ng indibiduwal na keyframaes, kaya ang pag-ikot sa landas ng reflection ng isang piraso ay hindi nakakaapekto sa iba.

Ang mga piraso ay hindi nakikita habang ang kanilang mga bintanang canvas ay hindi nagsasanib. Hanguin ang anumang piraso sa isang bagong posisyong canvas-time, batihin muli, o hatiin pa.

Halimbawa: Paunlarin sa Animasyon

1. Pumili ng teksto
2. Pagdating ng 0s: Ilagay ang Opacity sa 0
3. Pagsapit ng 1s: Ilagay ang Opaidad sa 1
4. Palayag sa Ease Out*
5. Pressplay Para Mag - view

Halimbawa: Pagbabago ng Kulay

1. Pumili ng isang bagay
2. Sa oras 0s: Ilagay ang Kulay sa #FF000000 (pula)
3. Pagsapit ng 2s: Ilagay ang Kulay sa #0000FF (blue)
4. Ang kulay ay maayos na nagbabago sa ispektrum

Halimbawa: Kamera Pan Epekto

Gumawa ng cinematic pan na umiikot sa malalaking imahen na ginagamit ang kambas bilang isang tanawin.

Kung Paano Ito Umaandar

Pagka ikaw ay may larawang mas malaki kay sa iyong kanbas:

• Ang canvas hangganan ay nagsisilbing camera viewport
• Paggalaw ng Larawan ay umalis = camera pans kanan***
• Paglilipat ng Larawan sa = camera pans down***

Paglikha ng Pang - ibabaw na Anisyon

1. Set canvas sukat sa iyong nais na output (hal.g., 1920×1080 para sa HD video)
2. I -port ang isang malaking imahen (mas malaki kaysa canvas)
3. Position ang imahen kaya ang simulang tanawin ay nakikita
4. Maglikha ng keyfame upang ilipat ang posisyon ng imahen

Row-by-Row Scanning Radition

Upang makita ang larawan sa isang tulad - ahas na disenyo:

Mapagpipilian: Sumunod ang Camera

Para sa dinamikong paggalaw ng kamera na kasunod ng isang bagay:

1. Gumawa ng maliit na marker o daanan
2. Magdagdag ng camera_follows kaugnay sa marker
3. Isaalang - alang ang posisyong palatandaan
4. Awtomatikong sumusunod ang viewport

Mga Tip