下面我們來學(xué)習(xí)一下iH5中級(jí)教程中的活動(dòng)必備，實(shí)現(xiàn)H5的倒計(jì)時(shí)功能。首先，我們需要添加媒體素材。選中舞臺(tái)，點(diǎn)擊頁(yè)面工具，新建一個(gè)頁(yè)面，并將其重命名為"倒計(jì)時(shí)"。然后，點(diǎn)擊圖片工具，上傳倒計(jì)時(shí)結(jié)束后會(huì)出

下面我們來學(xué)習(xí)一下iH5中級(jí)教程中的活動(dòng)必備，實(shí)現(xiàn)H5的倒計(jì)時(shí)功能。首先，我們需要添加媒體素材。選中舞臺(tái)，點(diǎn)擊頁(yè)面工具，新建一個(gè)頁(yè)面，并將其重命名為"倒計(jì)時(shí)"。然后，點(diǎn)擊圖片工具，上傳倒計(jì)時(shí)結(jié)束后會(huì)出現(xiàn)的圖片對(duì)象“漫畫”。由于倒計(jì)時(shí)結(jié)束后要顯示漫畫和內(nèi)容為“少俠，您的時(shí)間到了！”的中文字體，所以我們需要讓中文字體和漫畫同時(shí)顯示。選中“漫畫”對(duì)象，點(diǎn)擊中文字體工具，添加中文字體，使其成為“漫畫”對(duì)象的子對(duì)象，繼承“漫畫”對(duì)象的屬性和動(dòng)作。

在“倒計(jì)時(shí)”頁(yè)面下方添加內(nèi)容為“您的游戲時(shí)間還有”的中文字體。文字內(nèi)容可以根據(jù)自己的需求進(jìn)行自定義。

設(shè)置用于倒計(jì)時(shí)的計(jì)數(shù)器

接下來，我們需要設(shè)置用于倒計(jì)時(shí)的計(jì)數(shù)器。選中“倒計(jì)時(shí)”頁(yè)面，添加一個(gè)計(jì)數(shù)器。并找到舞臺(tái)左邊的計(jì)數(shù)器屬性面板，在初始值中設(shè)置為5，最小值設(shè)置為0。然后，在計(jì)數(shù)器下方添加內(nèi)容為“秒”的中文字體。

制作倒計(jì)時(shí)效果

現(xiàn)在，我們開始制作倒計(jì)時(shí)效果。選中“倒計(jì)時(shí)”頁(yè)面，添加一個(gè)時(shí)間軸，并將其重命名為“計(jì)時(shí)時(shí)間軸”。在左邊的屬性面板中，設(shè)置時(shí)間軸自動(dòng)播放，總時(shí)長(zhǎng)設(shè)置為1秒并設(shè)置循環(huán)播放。

選中“計(jì)時(shí)時(shí)間軸”，在這個(gè)時(shí)間軸下添加一個(gè)事件。觸發(fā)條件為結(jié)束，目標(biāo)對(duì)象是第二步中的計(jì)數(shù)器，目標(biāo)動(dòng)作為減1。這樣設(shè)置的原理是時(shí)間軸每播放1秒結(jié)束后，讓計(jì)數(shù)器減1。由于時(shí)間軸循環(huán)播放，所以計(jì)數(shù)器每一秒會(huì)減1，從而實(shí)現(xiàn)倒計(jì)時(shí)的效果。

在計(jì)數(shù)器下方再添加一個(gè)事件，觸發(fā)條件為等于，值為0，目標(biāo)對(duì)象是“計(jì)時(shí)時(shí)間軸”，目標(biāo)動(dòng)作為暫停。這個(gè)事件可以防止時(shí)間軸繼續(xù)循環(huán)播放，計(jì)數(shù)器繼續(xù)減1從而變成負(fù)數(shù)的情況。

制作出現(xiàn)的動(dòng)畫效果

我們還可以為倒計(jì)時(shí)結(jié)束后的漫畫對(duì)象添加一個(gè)動(dòng)效，讓它在倒計(jì)時(shí)結(jié)束后放大出現(xiàn)。選擇“漫畫”對(duì)象，在其下方添加一個(gè)動(dòng)效，時(shí)長(zhǎng)設(shè)置為1秒，動(dòng)效類型為放大出現(xiàn)，自動(dòng)播放設(shè)置為NO。注意：動(dòng)效的自動(dòng)播放默認(rèn)為YES，即默認(rèn)狀態(tài)下打開案例動(dòng)效會(huì)自動(dòng)播放。由于本案例中的圖片需要倒計(jì)時(shí)結(jié)束后出現(xiàn)，所以要將動(dòng)效的自動(dòng)播放設(shè)置為NO，不允許它自動(dòng)播放。

在計(jì)數(shù)器下方再添加一個(gè)事件，觸發(fā)條件為等于，值為0，目標(biāo)對(duì)象是“漫畫”對(duì)象下的動(dòng)效1，目標(biāo)動(dòng)作為開始。當(dāng)?shù)褂?jì)時(shí)結(jié)束之后，即計(jì)數(shù)器等于0，動(dòng)效開始播放，從而實(shí)現(xiàn)動(dòng)畫效果。

快速數(shù)字變化步驟

首先，我們需要添加媒體素材。選中舞臺(tái)，新建一個(gè)頁(yè)面，并將其重命名為"數(shù)值動(dòng)態(tài)增加"。然后，在頁(yè)面下方添加內(nèi)容為"%"和"百分比"的字體，并將其移動(dòng)到合適的位置。

選中“數(shù)值動(dòng)態(tài)增加”頁(yè)面，上傳一張帶有鏤空?qǐng)A且與舞臺(tái)大小相同的圖片。為了讓文字更明顯，我們可以將前面的文字和后面所有的文字以及計(jì)數(shù)器都設(shè)置成白色。

接下來，我們開始制作快速增加的數(shù)值變化效果。選中“數(shù)值動(dòng)態(tài)增加”頁(yè)面，在頁(yè)面下方添加一個(gè)計(jì)數(shù)器。在舞臺(tái)左邊的屬性面板中，適當(dāng)調(diào)整計(jì)數(shù)器的樣式和大小，并將最大值設(shè)置為85。

在頁(yè)面下方再添加一個(gè)時(shí)間軸，并將其重命名為“計(jì)時(shí)器”。將時(shí)間軸設(shè)置為自動(dòng)播放，時(shí)長(zhǎng)設(shè)置為0.02秒并設(shè)置循環(huán)播放。

在“計(jì)時(shí)器”時(shí)間軸下添加一個(gè)事件，觸發(fā)條件為結(jié)束，目標(biāo)對(duì)象為這個(gè)頁(yè)面里的計(jì)數(shù)器1，目標(biāo)動(dòng)作為加1。即案例播放時(shí)，“計(jì)時(shí)器”時(shí)間軸會(huì)自動(dòng)播放且循環(huán)播放，每次播放結(jié)束后，計(jì)數(shù)器就會(huì)加1。

在計(jì)數(shù)器下方再添加一個(gè)事件，觸發(fā)條件為等于，值為85，目標(biāo)對(duì)象是“計(jì)時(shí)器”時(shí)間軸對(duì)象，目標(biāo)動(dòng)作為暫停。即當(dāng)計(jì)數(shù)器不斷加1，直至加到85時(shí)，時(shí)間軸停止播放。這個(gè)事件可以防止“時(shí)間軸繼續(xù)循環(huán)播放，計(jì)數(shù)器顯示的數(shù)值不斷增加”的情況。

制作增加的進(jìn)度條動(dòng)態(tài)效果

因?yàn)榍懊嬉呀?jīng)上傳了帶有鏤空?qǐng)A條的圖片，所以只需要制作逐漸增加的進(jìn)度條效果。選中“數(shù)值動(dòng)態(tài)增加”頁(yè)面，添加一個(gè)時(shí)間軸，并將其設(shè)置為自動(dòng)播放，時(shí)長(zhǎng)為2.5秒。然后，將其拖動(dòng)到鏤空?qǐng)A條圖片的上一層。

選中時(shí)間軸，添加兩個(gè)透明按鈕，并為其添加填充顏色和軌跡。通過關(guān)鍵幀設(shè)置動(dòng)畫，使色塊隨著鏤空?qǐng)A條逐漸填充。兩個(gè)色塊的關(guān)鍵幀設(shè)置是通過位置和寬高的變化來實(shí)現(xiàn)的。

在時(shí)間軸下方添加一個(gè)事件，觸發(fā)條件為結(jié)束，目標(biāo)對(duì)象是計(jì)時(shí)器，目標(biāo)動(dòng)作為暫停。這樣可以防止進(jìn)度條播放結(jié)束后，表示進(jìn)度數(shù)字的計(jì)數(shù)器還在增加的情況。

將鏤空?qǐng)A條