เรื่องการโหลดภาพและการทำ Animation 2D ด้วย QML นั้นง่ายมากๆ แค่ไม่กี่บรรทัดก็สามารถทำสร้าง Animation ที่สวยและน่าสนใจได้อย่างรวดเร็ว
Element Image คือ element หลักที่ใช้ในการแสดงภาพ propreties ที่สำคัญของ element นี้คือ properties "source" โดยที่ source อาจจะเป็นชื่อภาพ ซึ่งจะเป็นภาพที่อยู่ในเครื่องหรือเรียกจาก http ก็ได้ เช่น
source: "my_local_image.png"
source: "c:\image\my_local_image.png"
source: "http://miiniq.blogspot.com/my_net_image.png"
ถ้าต้องการเรียกใช้งานภาพแบบที่เรียกชื่อภาพอย่างเดียวภาพที่เรียกใช้งานนั้นจะต้องอยู่ใน directory เดียวกับ file.qml ที่เรียกภาพนั้น
ส่วนเรื่องเกี่ยวกับ Animation นั้นมีหลายรูปแบบ วันนี้จะนำมาเขียนก่อน 1 รูปแบบคือเรื่องของ NumberAnimation ที่ทำ animation กับ properties ของ element ที่เป็นตัวเลข เช่น width height scale opacity x y เป็นต้น การใช้งานหลักๆ เป็นดังนี้
จะต้องบอกว่าจะทำ animation กับ properties อะไร ตั้งแต่ค่าเท่าไหร่(Number1) ถึงเท่าไหร่(Number2) และระยะเวลาที่ทำ Animation เป็นเวลาเท่าไหร่(TimeInMilliSec) จาก Number1 ถึง Number2 และ element NumberAnimation จะต้องอยู่ภายใน element ที่ต้องการจะทำ animation นั้นๆ
จาก code ข้างบนเป็นการทำ NumberAnimation กับ properties x และ scale โดยที่ x เปลี่ยนจาก 0 เป็น 480 และ scale เปลี่ยนจาก 0.8 เป็น 0.2 และทั้ง 2 Animation จะทำงานแบบขนานกันที่เวลา 1000 mSec หรือ 1 วินาที .... ถึงตรงนี้เป็นยังไงครับ ง่ายฝุดๆ เลยป่ะครับ ^^
<< Qt 5.0 Programming V : Element ID and Navigating the Objects Tree
>> Qt 5.0 Programming VII : Animation part II
0 ความคิดเห็น:
แสดงความคิดเห็น