目錄

【iVX 初級(jí)工程師培訓(xùn)教程 10篇文拿證】01 了解 iVX 完成新年賀卡
【iVX 初級(jí)工程師培訓(xùn)教程 10篇文拿證】02 數(shù)值綁定及自適應(yīng)網(wǎng)站制作
【iVX 初級(jí)工程師培訓(xùn)教程 10篇文拿證】03 事件及猜數(shù)字小游戲
【iVX 初級(jí)工程師培訓(xùn)教程 10篇文拿證】04 畫布及我和 iVX 合照
【iVX 初級(jí)工程師培訓(xùn)教程 10篇文拿證】05 畫布及飛機(jī)大戰(zhàn)游戲制作
【iVX 初級(jí)工程師培訓(xùn)教程 10篇文拿證】06 數(shù)據(jù)庫(kù)及服務(wù)
【iVX 初級(jí)工程師培訓(xùn)教程 10篇文拿證】07 08 新聞頁(yè)制作
【iVX 初級(jí)工程師培訓(xùn)教程 10篇文拿證】09 聊天室制作

高分提升請(qǐng)查看專欄：
iVX入門到精通
大話 IVX 實(shí)戰(zhàn)到精通

一、畫布和圖片序列

在 iVX 中，畫布是用于對(duì)圖像進(jìn)行靈活編輯的組件，若你需要對(duì)圖片進(jìn)行融合，那么使用畫布是你最優(yōu)的選擇。

圖片序列在 iVX 中可以當(dāng)做是跟輪播圖類似的組件，不過(guò)和輪播圖有很大差別；輪播圖可以更加靈活的對(duì)圖片文本進(jìn)行操作，而圖片序列只能對(duì)多張圖片進(jìn)行播放。

1.1 圖片序列

圖片序列位于組件面板中圖片右側(cè)：

以相對(duì)定位應(yīng)用為例，創(chuàng)建相對(duì)定位應(yīng)用，在應(yīng)用中添加一個(gè)頁(yè)面，在頁(yè)面中點(diǎn)擊圖片序列即可添加；當(dāng)點(diǎn)擊圖片序列后將會(huì)彈出資源選擇窗口，只需要選擇多張圖片即可創(chuàng)建一個(gè)圖片序列，當(dāng)然也可以選擇一張 gif 動(dòng)圖：

選擇多張圖片后點(diǎn)擊確定即可：

此時(shí)在對(duì)象樹中點(diǎn)擊該圖片序列，在屬性中點(diǎn)擊圖片列表可以更改圖片位置：

在圖片位置中可以更改器播放時(shí)長(zhǎng)等：

二、動(dòng)畫和時(shí)間軸

動(dòng)畫在iVX中是比較有特色的，支持用戶自己定義動(dòng)畫路徑以及動(dòng)畫樣式。現(xiàn)在以一個(gè)絕對(duì)定位的文本為例：

點(diǎn)擊文本，可以在文本左側(cè)看到一個(gè)組件——軌跡，軌跡可以讓我們?yōu)樵摻M件創(chuàng)建幀動(dòng)畫：

為該文本添加軌跡屬性后，在底部可以看到有一個(gè)時(shí)間軸，咱們可以對(duì)這個(gè)時(shí)間軸在對(duì)應(yīng)的時(shí)間秒數(shù)打上關(guān)鍵幀，在這些關(guān)鍵幀中為其制作動(dòng)畫：

接著可拖動(dòng)時(shí)間軸為其添加關(guān)鍵幀：

在不同的時(shí)間點(diǎn)打上關(guān)鍵幀后，如下圖所示：

接著點(diǎn)擊那些打上的關(guān)鍵幀改動(dòng)其文本的位置或其他屬性，以位置為例：

接下來(lái)在多個(gè)時(shí)間軸改變其文本位置：

最后點(diǎn)擊軌跡，在屬性中打開(kāi)自動(dòng)播放即可：

預(yù)覽后文本將會(huì)根據(jù)關(guān)鍵幀信息播放動(dòng)畫。

三、我和iVX的合照

在第一點(diǎn)中介紹了畫布的作用，接下來(lái)咱們使用畫布合成一張圖片，并且下載到本地。

3.1 頁(yè)面繪制

以下是頁(yè)面繪制示例，其中需要注意，在畫布中繪制圖片是絕對(duì)定位環(huán)境，若想要一張圖片覆蓋于另外一張圖片之上，需要一張圖片在對(duì)象樹中位于另外一張圖片之上。

以上對(duì)象樹中我們發(fā)現(xiàn)有一個(gè)文件接口組件，文件接口組件是用于圖片資源獲取及上傳。

3.2 功能制作

需要自由的對(duì)圖片進(jìn)行合成，咱們對(duì)畫布添加點(diǎn)擊事件，點(diǎn)擊畫布即可選擇本地支資源圖片，咱們首先對(duì)畫布添加事件：

以上事件中，回調(diào)是指“某動(dòng)作做完之后”需要做的事情，在以上示例中，讀取完圖片后，指定畫布中的一個(gè)對(duì)象更改圖片為選擇的圖片。

接著對(duì)合成按鈕添加事件，點(diǎn)擊按鈕后使用畫布對(duì)圖片進(jìn)行輸出，輸出到畫布外圖片即可：

最后預(yù)覽如下：

總結(jié)

以上是生活随笔為你收集整理的【iVX 初级工程师培训教程 10篇文拿证】04 画布及我和 iVX 合照的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。