利用Tweener製作動畫 – 貝茲曲線

在看過前面一篇Tweener基礎篇之後,應該會發現我們的動畫元件雖然可以依照不同的模式移動,但是在路徑上還依然是保持直線移動,而這一篇文章就要來示範如何讓元件利用貝茲曲線來產生移動路徑,至於甚麼是貝茲曲線?大家可以參考維基百科上面的說明,這邊就不贅述了。

在Tweener的官方網站裡有提供一個貝茲曲線產生器的Flash動畫讓大家下載,不過由於官方示範這個貝茲曲線產生器所使用的是舊版本的Tweener Class,所以在程式碼範例上有些缺失,馬老師這邊提供我修改過且進行中文化後的範例供大家下載

Tweener 貝茲曲線產生器 螢幕截圖

範例中Add Bezier Point是增加節點,Remove Point是刪除節點,利用這些功能並拖曳上面的範例曲線,就可以製作出你想要移動的路徑,接下來請先把「需要先被匯入與執行的Tweener」三行指令放置在程式碼的最前面,接著再把「Tweener動畫指令」貼上即可!這樣一來以後連製作這樣的路徑也會變得很方便了!

整個動畫的程式碼如下,也提供利用此效果製作的動畫檔給大家參考:

import caurina.transitions.Tweener
import caurina.transitions.properties.CurveModifiers
CurveModifiers.init()

Tweener.addTween(ball, {x:475, y:80, _bezier:[{x:150, y:43}, {x:71, y:206.5}], time:1, transition:"linear"});

希望這個範例對大家有所幫助,如果還有疑問,也可以在這邊回應唷~

You may also like...

1,615 Responses

  1. I will share you blog with my sis.

  2. orlistat adverse effects xenical 2017 que contiene las pastillas orlistat how efective is xenical

  3. heartgard ivermectin dose stromectol 3 mg dosage ivermectin 1 spot on for chickens what to dilute ivermectin with to give to dog for heartworms

  4. Feelo表示:

    Marina Rozenberg  01 05 2022 20:00:25 Hannah’s tried-and-true favorite to ship strands skyward is forehead cleaning soap, just like the Mecca Max Brow Guru Super Soap, $18. “You may customise the maintain and elegance, whereas retaining your brows nourished and conditioned,” she says. The Wet N Wild Ultimate Brow Pencil is perfect for an everyday natural eyebrow and is great in a travelling makeup case. I will definitely repurchase it in the correct colour to use for a daily natural brow look. So there’s the demonstration and review! As with any brow product, you need to know what you’re looking for, and what brow needs you have, and then base your choice on that. This one is going to give you good fill ins of color, and a hold on existing brow hairs. It won’t be super precise and skinny to create new hairs. http://themagicknode.com/community/profile/alicah434694057/ Facial rolling and gua sha is EVERYWHERE these days (in case you haven’t heard, read more about it HERE). These radiance-boosting, cheekbone-defining, detoxifying treatments are being buzzed about all over the pages of your favorite beauty magazines and jade rollers are seen in the hands of top models. And it’s no surprise facial rolling and gua sha is getting some legit attention – it promotes lymph drainage, de-puffs the face, relaxes over-tight muscles, and gives your skin an amazing glow. A gua sha tool still can be used if you have Botox or dermal fillers ― just avoid the treated areas. ” can be used on all untreated areas of your face, to even out the difference between the Botox and untreated skin,” Brindle said. “We recommend avoiding the treated area for 28 days after dermal filler treatment and 14 days after Botox. You can continue to use gua sha tools on other areas of your face.”

  5. diflucan costs diflucan singapore pharmacy how to take diflucan for yeast infection why did diflucan change from one side to three

  6. This is my first time i visit here. I found so many helpful stuff in your website especially its discussion. From the tons of responses on your posts, I guess I am not the only one having all the enjoyment here! keep up the excellent work

  7. diflucan表示:

    baricitinib gvhd baricitinib price baricitinib for lupus baricitinib coronavirus

  8. diflucan 150 mg diflucan prescription cost over the counter diflucan substitute what class of drugs is diflucan

  9. xanax and paxil generic paxil cr does paxil make you sweat what category of drugs is paxil

  10. a study of baricitinib in participants with systemic lupus erythematosus “‘compensation'” cost of baricitinib baricitinib是什么药 olumiant alopecia areata

  11. نقي表示:

    This has to be one of my favorite posts! And on top of thats its also very helpful topic for newbies. thank a lot for the information!

  12. These kind of posts are always inspiring and I prefer to read quality content so I happy to find many good point here in the post. writing is simply wonderful! thank you for the post

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。