本申請涉及動畫領(lǐng)域，具體而言，涉及一種基于Canvas的動畫播放速度調(diào)整方法及裝置。

背景技術(shù)：

目前，在使用HTML5Canvas繪制動畫的過程時，會使用動畫幀繪制技術(shù)，將每一幀按照一定順序串聯(lián)起來播放，只要幀播放速度合適，就可以創(chuàng)建一個流暢的動畫。在很多場景下，對幀播放速度有不同的要求，需要能夠動態(tài)、合理地調(diào)整動畫幀的播放速度，才能制作出合規(guī)格的動畫效果。相關(guān)技術(shù)中，通過調(diào)整動畫幀之間的時間間隔來達到改變幀播放速度的效果。通過調(diào)整動畫幀之間的播放間隔時間，改變動畫在兩個動畫幀之間停留的時間，目前，時間間隔只能根據(jù)開發(fā)人員的經(jīng)驗來判斷，然而，隨著兩個動畫幀之間時間間隔的擴大，動畫播放容易出現(xiàn)卡頓現(xiàn)象。

針對相關(guān)技術(shù)中當(dāng)兩個動畫幀之間時間間隔的擴大時，動畫播放容易出現(xiàn)卡頓現(xiàn)象的問題，目前尚未提出有效的解決方案。

技術(shù)實現(xiàn)要素：

本申請的主要目的在于提供一種基于Canvas的動畫播放速度調(diào)整方法及裝置，以解決相關(guān)技術(shù)中當(dāng)兩個動畫幀之間時間間隔的擴大時，動畫播放容易出現(xiàn)卡頓現(xiàn)象的問題。

為了實現(xiàn)上述目的，根據(jù)本申請的一個方面，提供了一種基于Canvas的動畫播放速度調(diào)整方法。該方法包括：分別獲取第一動畫幀的Canvas畫布上所有像素點數(shù)據(jù)和第二動畫幀的Canvas畫布上所有像素點數(shù)據(jù)，其中，第一動畫幀和第二動畫幀是相鄰播放的動畫幀；計算目標(biāo)幀數(shù)，其中，目標(biāo)幀數(shù)為在第一動畫幀和第二動畫幀之間需要創(chuàng)建的動畫幀的幀數(shù)；分別計算多個目標(biāo)變化差值，其中，多個目標(biāo)變化差值分別為多個像素點差值與目標(biāo)幀數(shù)的比值，多個像素點差值分別為多個像素點在第一動畫幀上的像素點數(shù)據(jù)與在第二動畫幀上的像素點數(shù)據(jù)之間的差值；分別根據(jù)多個目標(biāo)變化差值繪制多個目標(biāo)動畫幀；以及順序播放第一動畫幀、多個目標(biāo)動畫幀和第二動畫幀。

進一步地，計算目標(biāo)幀數(shù)包括：確定第一動畫幀和第二動畫幀之間的時間間隔； 確定單位時間間隔需要創(chuàng)建的動畫幀的幀數(shù)；以及計算目標(biāo)幀數(shù)，其中，目標(biāo)幀數(shù)為時間間隔與單位時間間隔需要創(chuàng)建的動畫幀的幀數(shù)的乘積。

進一步地，分別根據(jù)多個目標(biāo)變化差值繪制多個目標(biāo)動畫幀包括：分別根據(jù)第一動畫幀的Canvas畫布上每個像素點數(shù)據(jù)、目標(biāo)幀數(shù)和多個目標(biāo)變化差值，計算目標(biāo)幀數(shù)組像素點數(shù)據(jù)，得到多組像素點數(shù)據(jù)；以及分別根據(jù)多組像素點數(shù)據(jù)繪制多個目標(biāo)動畫幀。

進一步地，分別計算多個目標(biāo)變化差值包括：分別計算多個像素點差值，其中，多個像素點差值分別為多個像素點在第一動畫幀上的像素點數(shù)據(jù)與在第二動畫幀上的像素點數(shù)據(jù)之間的差值；以及根據(jù)多個像素點差值，分別計算多個目標(biāo)變化差值，其中，目標(biāo)變化差值是多個像素點差值與目標(biāo)幀數(shù)的比值。

進一步地，在分別獲取第一動畫幀的Canvas畫布上所有像素點數(shù)據(jù)和第二動畫幀的Canvas畫布上所有像素點數(shù)據(jù)之后，在計算目標(biāo)幀數(shù)之前，該方法還包括：將獲取到的第一動畫幀的Canvas畫布上所有像素點數(shù)據(jù)存儲至第一臨時變量并將獲取到的第二動畫幀的Canvas畫布上所有像素點數(shù)據(jù)存儲至第二臨時變量。

為了實現(xiàn)上述目的，根據(jù)本申請的另一方面，提供了一種基于Canvas的動畫播放速度調(diào)整裝置。該裝置包括：獲取單元，用于分別獲取第一動畫幀的Canvas畫布上所有像素點數(shù)據(jù)和第二動畫幀的Canvas畫布上所有像素點數(shù)據(jù)，其中，第一動畫幀和第二動畫幀是相鄰播放的動畫幀；第一計算單元，用于計算目標(biāo)幀數(shù)，其中，目標(biāo)幀數(shù)為在第一動畫幀和第二動畫幀之間需要創(chuàng)建的動畫幀的幀數(shù)；第二計算單元，用于分別計算多個目標(biāo)變化差值，其中，多個目標(biāo)變化差值分別為多個像素點差值與目標(biāo)幀數(shù)的比值，多個像素點差值分別為多個像素點在第一動畫幀上的像素點數(shù)據(jù)與在第二動畫幀上的像素點數(shù)據(jù)之間的差值；繪制單元，用于分別根據(jù)多個目標(biāo)變化差值繪制多個目標(biāo)動畫幀；以及播放單元，用于順序播放第一動畫幀、多個目標(biāo)動畫幀和第二動畫幀。

進一步地，第一計算單元包括：第一確定模塊，用于確定第一動畫幀和第二動畫幀之間的時間間隔；第二確定模塊，用于確定單位時間間隔需要創(chuàng)建的動畫幀的幀數(shù)；以及第一計算模塊，用于計算目標(biāo)幀數(shù)，其中，目標(biāo)幀數(shù)為時間間隔與單位時間間隔需要創(chuàng)建的動畫幀的幀數(shù)的乘積。

進一步地，繪制單元包括：第二計算模塊，用于分別根據(jù)第一動畫幀的Canvas畫布上每個像素點數(shù)據(jù)、目標(biāo)幀數(shù)和多個目標(biāo)變化差值，計算目標(biāo)幀數(shù)組像素點數(shù)據(jù)，得到多組像素點數(shù)據(jù)；以及繪制模塊，用于分別根據(jù)多組像素點數(shù)據(jù)繪制多個目標(biāo)動畫幀。

進一步地，第二計算單元包括：第三計算模塊，用于分別計算多個像素點差值，其中，多個像素點差值分別為多個像素點在第一動畫幀上的像素點數(shù)據(jù)與在第二動畫幀上的像素點數(shù)據(jù)之間的差值；以及第四計算模塊，用于根據(jù)多個像素點差值，分別計算多個目標(biāo)變化差值，其中，目標(biāo)變化差值是多個像素點差值與目標(biāo)幀數(shù)的比值。

進一步地，該裝置還包括：存儲單元，用于將獲取到的第一動畫幀的Canvas畫布上所有像素點數(shù)據(jù)存儲至第一臨時變量并將獲取到的第二動畫幀的Canvas畫布上所有像素點數(shù)據(jù)存儲至第二臨時變量。

通過本申請，采用以下步驟：分別獲取第一動畫幀的Canvas畫布上所有像素點數(shù)據(jù)和第二動畫幀的Canvas畫布上所有像素點數(shù)據(jù)，其中，第一動畫幀和第二動畫幀是相鄰播放的動畫幀；計算目標(biāo)幀數(shù)，其中，目標(biāo)幀數(shù)為在第一動畫幀和第二動畫幀之間需要創(chuàng)建的動畫幀的幀數(shù)；分別計算多個目標(biāo)變化差值，其中，多個目標(biāo)變化差值分別為多個像素點差值與目標(biāo)幀數(shù)的比值，多個像素點差值分別為多個像素點在第一動畫幀上的像素點數(shù)據(jù)與在第二動畫幀上的像素點數(shù)據(jù)之間的差值；分別根據(jù)多個目標(biāo)變化差值繪制多個目標(biāo)動畫幀；以及順序播放第一動畫幀、多個目標(biāo)動畫幀和第二動畫幀，解決了相關(guān)技術(shù)中當(dāng)兩個動畫幀之間時間間隔的擴大時，動畫播放容易出現(xiàn)卡頓現(xiàn)象的問題，通過繪制出多個目標(biāo)動畫幀來補充時間間隔被拉長的兩個動畫幀時間的動畫幀，達到合理補充動畫幀，使得動畫播放流暢，進而實現(xiàn)了在動畫播放時不出現(xiàn)卡頓的現(xiàn)象。

附圖說明

構(gòu)成本申請的一部分的附圖用來提供對本申請的進一步理解，本申請的示意性實施例及其說明用于解釋本申請，并不構(gòu)成對本申請的不當(dāng)限定。在附圖中：

圖1是根據(jù)本申請實施例的基于Canvas的動畫播放速度調(diào)整方法的流程圖；以及

圖2是根據(jù)本申請實施例的基于Canvas的動畫播放速度調(diào)整裝置的示意圖。

具體實施方式

需要說明的是，在不沖突的情況下，本申請中的實施例及實施例中的特征可以相互組合。下面將參考附圖并結(jié)合實施例來詳細(xì)說明本申請。

為了使本技術(shù)領(lǐng)域的人員更好地理解本申請方案，下面將結(jié)合本申請實施例中的附圖，對本申請實施例中的技術(shù)方案進行清楚、完整地描述，顯然，所描述的實施例僅僅是本申請一部分的實施例，而不是全部的實施例?；诒旧暾堉械膶嵤├?，本領(lǐng)域普通技術(shù)人員在沒有做出創(chuàng)造性勞動前提下所獲得的所有其他實施例，都應(yīng)當(dāng)屬于 本申請保護的范圍。

需要說明的是，本申請的說明書和權(quán)利要求書及上述附圖中的術(shù)語“第一”、“第二”等是用于區(qū)別類似的對象，而不必用于描述特定的順序或先后次序。應(yīng)該理解這樣使用的數(shù)據(jù)在適當(dāng)情況下可以互換，以便這里描述的本申請的實施例。此外，術(shù)語“包括”和“具有”以及他們的任何變形，意圖在于覆蓋不排他的包含，例如，包含了一系列步驟或單元的過程、方法、系統(tǒng)、產(chǎn)品或設(shè)備不必限于清楚地列出的那些步驟或單元，而是可包括沒有清楚地列出的或?qū)τ谶@些過程、方法、產(chǎn)品或設(shè)備固有的其它步驟或單元。

根據(jù)本申請的實施例，提供了一種基于Canvas的動畫播放速度調(diào)整方法。

圖1是根據(jù)本申請實施例的基于Canvas的動畫播放速度調(diào)整方法的流程圖。如圖1所示，該方法包括以下步驟：

步驟S101，分別獲取第一動畫幀的Canvas畫布上所有像素點數(shù)據(jù)和第二動畫幀的Canvas畫布上所有像素點數(shù)據(jù)，其中，第一動畫幀和第二動畫幀是相鄰播放的動畫幀。

步驟S102，計算目標(biāo)幀數(shù)，其中，目標(biāo)幀數(shù)為在第一動畫幀和第二動畫幀之間需要創(chuàng)建的動畫幀的幀數(shù)。

可選地，在本申請實施例提供的基于Canvas的動畫播放速度調(diào)整方法中，計算目標(biāo)幀數(shù)可以通過以下步驟實現(xiàn)：確定第一動畫幀和第二動畫幀之間的時間間隔；確定單位時間間隔需要創(chuàng)建的動畫幀的幀數(shù)；以及計算目標(biāo)幀數(shù)，其中，目標(biāo)幀數(shù)為時間間隔與單位時間間隔需要創(chuàng)建的動畫幀的幀數(shù)的乘積。

例如，確定第一動畫幀和第二動畫幀之間的時間間隔為1ms，如果每毫秒播放的動畫為14幀，則在第一動畫幀和第二動畫幀之間需要創(chuàng)建的目標(biāo)幀數(shù)為14*1＝14幀。

可選地，在本申請實施例提供的基于Canvas的動畫播放速度調(diào)整方法中，在分別獲取第一動畫幀的Canvas畫布上所有像素點數(shù)據(jù)和第二動畫幀的Canvas畫布上所有像素點數(shù)據(jù)之后，在計算目標(biāo)幀數(shù)之前，該方法還包括：將獲取到的第一動畫幀的Canvas畫布上所有像素點數(shù)據(jù)存儲至第一臨時變量并將獲取到的第二動畫幀的Canvas畫布上所有像素點數(shù)據(jù)存儲至第二臨時變量。

通過將獲取到的第一動畫幀的Canvas畫布上所有像素點數(shù)據(jù)存儲至第一臨時變量，將獲取到的第二動畫幀的Canvas畫布上所有像素點數(shù)據(jù)存儲至第二臨時變量，將像素點數(shù)據(jù)存儲在HTML5Canvas的內(nèi)存中，保證了在后續(xù)需要調(diào)用像素點數(shù)據(jù)時，能夠快速的調(diào)用像素點數(shù)據(jù)，從而提升效率。

步驟S103，分別計算多個目標(biāo)變化差值，其中，多個目標(biāo)變化差值分別為多個像素點差值與目標(biāo)幀數(shù)的比值，多個像素點差值分別為多個像素點在第一動畫幀上的像素點數(shù)據(jù)與在第二動畫幀上的像素點數(shù)據(jù)之間的差值。

具體地，在本申請實施例提供的基于Canvas的動畫播放速度調(diào)整方法中，分別計算多個目標(biāo)變化差值包括：分別計算多個像素點差值，其中，多個像素點差值分別為多個像素點在第一動畫幀上的像素點數(shù)據(jù)與在第二動畫幀上的像素點數(shù)據(jù)之間的差值；以及根據(jù)多個像素點差值，分別計算多個目標(biāo)變化差值，其中，目標(biāo)變化差值是多個像素點差值與目標(biāo)幀數(shù)的比值。

需要說明的是，對于每個像素點的像素點數(shù)據(jù)都采用16進制表示，例如，白色像素點數(shù)據(jù)為：#ffffff，黑色像素點數(shù)據(jù)為：#000000，六位十六進制可以逐位變化，如果從白色像素點數(shù)據(jù)變化到黑色像素點數(shù)據(jù)，每一位都從f變化到0，如果每次減1，則需要減16次。

例如，在第一動畫幀上的像素點A的像素點數(shù)據(jù)為#eeeeee，在第二動畫幀上的像素點A的像素點數(shù)據(jù)為#000000，像素點A的像素點差值為像素點A在第一動畫幀上的像素點數(shù)據(jù)與在第二動畫幀上的像素點數(shù)據(jù)之間的差值，即像素點A的像素點差值eeeeee，如果目標(biāo)幀數(shù)為14幀，計算出像素點A的每一位上目標(biāo)變化差值為1，即，像素點A需要每幀遞增的數(shù)值為1。

步驟S104，分別根據(jù)多個目標(biāo)變化差值繪制多個目標(biāo)動畫幀。

可選地，在本申請實施例提供的基于Canvas的動畫播放速度調(diào)整方法中，分別根據(jù)多個目標(biāo)變化差值繪制多個目標(biāo)動畫幀包括：分別根據(jù)第一動畫幀的Canvas畫布上每個像素點數(shù)據(jù)、目標(biāo)幀數(shù)和多個目標(biāo)變化差值，計算目標(biāo)幀數(shù)組像素點數(shù)據(jù)，得到多組像素點數(shù)據(jù)；以及分別根據(jù)多組像素點數(shù)據(jù)繪制多個目標(biāo)動畫幀。

需要說明的是，目標(biāo)幀數(shù)組像素點數(shù)據(jù)中的目標(biāo)幀數(shù)組是數(shù)量詞，即計算組數(shù)為為目標(biāo)幀數(shù)的像素點數(shù)據(jù)。

例如，上述計算出像素點A的每一位上目標(biāo)變化差值為1，即，像素點A需要每幀遞增的數(shù)值為1，在第一動畫幀的像素點A的像素點數(shù)據(jù)為#eeeeee，在第一動畫幀和第二動畫幀之間需要創(chuàng)建的目標(biāo)幀數(shù)為14，計算出像素點A在第一目標(biāo)動畫幀的像素點數(shù)據(jù)為#dddddd，像素點A在第二目標(biāo)動畫幀的像素點數(shù)據(jù)為#cccccc，像素點A在第三目標(biāo)動畫幀的像素點數(shù)據(jù)為#bbbbbb……像素點A在第十四目標(biāo)動畫幀的像素點數(shù)據(jù)為#111111，也分別計算出第一動畫幀上的像素點B、像素點C、像素點D等等每個在第一動畫幀上的像素點，在多個目標(biāo)動畫幀的像素點數(shù)據(jù)，即得到多組像素點數(shù)據(jù)，根據(jù)得到的多組像素點數(shù)據(jù)繪制出多個目標(biāo)動畫幀。

步驟S105，順序播放第一動畫幀、多個目標(biāo)動畫幀和第二動畫幀。

順序播放上述得到的第一動畫幀、多個目標(biāo)動畫幀和第二動畫幀，從而形成有效的動畫。

通過上述步驟，根據(jù)兩個像素點的顏色十六進制值的變化量來繪制每一幀的畫布上各個像素點的顏色，從而創(chuàng)造動畫幀，補充到相鄰播放的動畫幀的時間間隔內(nèi)。從而合理補充動畫幀，調(diào)整動畫播放速度，使得動畫播放流暢。

本申請實施例提供的基于Canvas的動畫播放速度調(diào)整方法，通過分別獲取第一動畫幀的Canvas畫布上所有像素點數(shù)據(jù)和第二動畫幀的Canvas畫布上所有像素點數(shù)據(jù)，其中，第一動畫幀和第二動畫幀是相鄰播放的動畫幀；計算目標(biāo)幀數(shù)，其中，目標(biāo)幀數(shù)為在第一動畫幀和第二動畫幀之間需要創(chuàng)建的動畫幀的幀數(shù)；分別計算多個目標(biāo)變化差值，其中，多個目標(biāo)變化差值分別為多個像素點差值與目標(biāo)幀數(shù)的比值，多個像素點差值分別為多個像素點在第一動畫幀上的像素點數(shù)據(jù)與在第二動畫幀上的像素點數(shù)據(jù)之間的差值；分別根據(jù)多個目標(biāo)變化差值繪制多個目標(biāo)動畫幀；以及順序播放第一動畫幀、多個目標(biāo)動畫幀和第二動畫幀，解決了相關(guān)技術(shù)中當(dāng)兩個動畫幀之間時間間隔的擴大時，動畫播放容易出現(xiàn)卡頓現(xiàn)象的問題，通過繪制出多個目標(biāo)動畫幀來補充時間間隔被拉長的兩個動畫幀時間的動畫幀，達到合理補充動畫幀，使得動畫播放流暢，進而實現(xiàn)了在動畫播放時不出現(xiàn)卡頓的現(xiàn)象。

需要說明的是，在附圖的流程圖示出的步驟可以在諸如一組計算機可執(zhí)行指令的計算機系統(tǒng)中執(zhí)行，并且，雖然在流程圖中示出了邏輯順序，但是在某些情況下，可以以不同于此處的順序執(zhí)行所示出或描述的步驟。

本申請實施例還提供了一種基于Canvas的動畫播放速度調(diào)整裝置，需要說明的是，本申請實施例的基于Canvas的動畫播放速度調(diào)整裝置可以用于執(zhí)行本申請實施例所提供的基于Canvas的動畫播放速度調(diào)整方法。以下對本申請實施例提供的基于Canvas的動畫播放速度調(diào)整裝置進行介紹。

圖2是根據(jù)本申請實施例的基于Canvas的動畫播放速度調(diào)整裝置的示意圖。如圖2所示，該裝置包括：獲取單元10、第一計算單元20、第二計算單元30、繪制單元40和播放單元50。

獲取單元10，用于分別獲取第一動畫幀的Canvas畫布上所有像素點數(shù)據(jù)和第二動畫幀的Canvas畫布上所有像素點數(shù)據(jù)，其中，第一動畫幀和第二動畫幀是相鄰播放的動畫幀。

第一計算單元20，用于計算目標(biāo)幀數(shù)，其中，目標(biāo)幀數(shù)為在第一動畫幀和第二動畫幀之間需要創(chuàng)建的動畫幀的幀數(shù)。

第二計算單元30，用于分別計算多個目標(biāo)變化差值，其中，多個目標(biāo)變化差值分別為多個像素點差值與目標(biāo)幀數(shù)的比值，多個像素點差值分別為多個像素點在第一動畫幀上的像素點數(shù)據(jù)與在第二動畫幀上的像素點數(shù)據(jù)之間的差值。

繪制單元40，用于分別根據(jù)多個目標(biāo)變化差值繪制多個目標(biāo)動畫幀。

播放單元50，用于順序播放第一動畫幀、多個目標(biāo)動畫幀和第二動畫幀。

本申請實施例提供的基于Canvas的動畫播放速度調(diào)整裝置，通過獲取單元10分別獲取第一動畫幀的Canvas畫布上所有像素點數(shù)據(jù)和第二動畫幀的Canvas畫布上所有像素點數(shù)據(jù)，其中，第一動畫幀和第二動畫幀是相鄰播放的動畫幀；第一計算單元20計算目標(biāo)幀數(shù)，其中，目標(biāo)幀數(shù)為在第一動畫幀和第二動畫幀之間需要創(chuàng)建的動畫幀的幀數(shù)；第二計算單元30分別計算多個目標(biāo)變化差值，其中，多個目標(biāo)變化差值分別為多個像素點差值與目標(biāo)幀數(shù)的比值，多個像素點差值分別為多個像素點在第一動畫幀上的像素點數(shù)據(jù)與在第二動畫幀上的像素點數(shù)據(jù)之間的差值；繪制單元40分別根據(jù)多個目標(biāo)變化差值繪制多個目標(biāo)動畫幀；以及播放單元50順序播放第一動畫幀、多個目標(biāo)動畫幀和第二動畫幀，解決了相關(guān)技術(shù)中當(dāng)兩個動畫幀之間時間間隔的擴大時，動畫播放容易出現(xiàn)卡頓現(xiàn)象的問題，通過繪制單元40繪制出多個目標(biāo)動畫幀來補充時間間隔被拉長的兩個動畫幀時間的動畫幀，達到合理補充動畫幀，使得動畫播放流暢，進而實現(xiàn)了在動畫播放時不出現(xiàn)卡頓的現(xiàn)象。

可選地，在本申請實施例提供的基于Canvas的動畫播放速度調(diào)整裝置中，第一計算單元20包括：第一確定模塊，用于確定第一動畫幀和第二動畫幀之間的時間間隔；第二確定模塊，用于確定單位時間間隔需要創(chuàng)建的動畫幀的幀數(shù)；以及第一計算模塊，用于計算目標(biāo)幀數(shù)，其中，目標(biāo)幀數(shù)為時間間隔與單位時間間隔需要創(chuàng)建的動畫幀的幀數(shù)的乘積。

可選地，在本申請實施例提供的基于Canvas的動畫播放速度調(diào)整裝置中，繪制單元40包括：第二計算模塊，用于分別根據(jù)第一動畫幀的Canvas畫布上每個像素點數(shù)據(jù)、目標(biāo)幀數(shù)和多個目標(biāo)變化差值，計算目標(biāo)幀數(shù)組像素點數(shù)據(jù)，得到多組像素點數(shù)據(jù)；以及繪制模塊，用于分別根據(jù)多組像素點數(shù)據(jù)繪制多個目標(biāo)動畫幀。

可選地，在本申請實施例提供的基于Canvas的動畫播放速度調(diào)整裝置中，第二計算單元30包括：第三計算模塊，用于分別計算多個像素點差值，其中，多個像素點差值分別為多個像素點在第一動畫幀上的像素點數(shù)據(jù)與在第二動畫幀上的像素點數(shù)據(jù)之間的差值；以及第四計算模塊，用于根據(jù)多個像素點差值，分別計算多個目標(biāo)變化差值，其中，目標(biāo)變化差值是多個像素點差值與目標(biāo)幀數(shù)的比值。

可選地，在本申請實施例提供的基于Canvas的動畫播放速度調(diào)整裝置中，該裝 置還包括：存儲單元，用于將獲取到的第一動畫幀的Canvas畫布上所有像素點數(shù)據(jù)存儲至第一臨時變量并將獲取到的第二動畫幀的Canvas畫布上所有像素點數(shù)據(jù)存儲至第二臨時變量。

所述基于Canvas的動畫播放速度調(diào)整裝置包括處理器和存儲器，上述獲取單元10、第一計算單元20、第二計算單元30、繪制單元40和播放單元500等均作為程序單元存儲在存儲器中，由處理器執(zhí)行存儲在存儲器中的上述程序單元實現(xiàn)相應(yīng)功能。

處理器中包含內(nèi)核，由內(nèi)核去存儲器中調(diào)取相應(yīng)的程序單元。內(nèi)核可以設(shè)置一個或以上，通過調(diào)整內(nèi)核參數(shù)來調(diào)整Canvas動畫的播放速度。

存儲器可能包括計算機可讀介質(zhì)中的非永久性存儲器，隨機存取存儲器(RAM)和/或非易失性內(nèi)存等形式，如只讀存儲器(ROM)或閃存(flash RAM)，存儲器包括至少一個存儲芯片。

本申請還提供了一種計算機程序產(chǎn)品的實施例，當(dāng)在數(shù)據(jù)處理設(shè)備上執(zhí)行時，適于執(zhí)行初始化有如下方法步驟的程序代碼：分別獲取第一動畫幀的Canvas畫布上所有像素點數(shù)據(jù)和第二動畫幀的Canvas畫布上所有像素點數(shù)據(jù)，其中，第一動畫幀和第二動畫幀是相鄰播放的動畫幀；計算目標(biāo)幀數(shù)，其中，目標(biāo)幀數(shù)為在第一動畫幀和第二動畫幀之間需要創(chuàng)建的動畫幀的幀數(shù)；分別計算多個目標(biāo)變化差值，其中，多個目標(biāo)變化差值分別為多個像素點差值與目標(biāo)幀數(shù)的比值，多個像素點差值分別為多個像素點在第一動畫幀上的像素點數(shù)據(jù)與在第二動畫幀上的像素點數(shù)據(jù)之間的差值；分別根據(jù)多個目標(biāo)變化差值繪制多個目標(biāo)動畫幀；以及順序播放第一動畫幀、多個目標(biāo)動畫幀和第二動畫幀。

需要說明的是，對于前述的各方法實施例，為了簡單描述，故將其都表述為一系列的動作組合，但是本領(lǐng)域技術(shù)人員應(yīng)該知悉，本申請并不受所描述的動作順序的限制，因為依據(jù)本申請，某些步驟可以采用其他順序或者同時進行。其次，本領(lǐng)域技術(shù)人員也應(yīng)該知悉，說明書中所描述的實施例均屬于優(yōu)選實施例，所涉及的動作和模塊并不一定是本申請所必須的。

在上述實施例中，對各個實施例的描述都各有側(cè)重，某個實施例中沒有詳述的部分，可以參見其他實施例的相關(guān)描述。

在本申請所提供的幾個實施例中，應(yīng)該理解到，所揭露的裝置，可通過其它的方式實現(xiàn)。例如，以上所描述的裝置實施例僅僅是示意性的，例如所述單元的劃分，僅僅為一種邏輯功能劃分，實際實現(xiàn)時可以有另外的劃分方式，例如多個單元或組件可以結(jié)合或者可以集成到另一個系統(tǒng)，或一些特征可以忽略，或不執(zhí)行。

所述作為分離部件說明的單元可以是或者也可以不是物理上分開的，作為單元顯 示的部件可以是或者也可以不是物理單元，即可以位于一個地方，或者也可以分布到多個網(wǎng)絡(luò)單元上?？梢愿鶕?jù)實際的需要選擇其中的部分或者全部單元來實現(xiàn)本實施例方案的目的。

另外，在本申請各個實施例中的各功能單元可以集成在一個處理單元中，也可以是各個單元單獨物理存在，也可以兩個或兩個以上單元集成在一個單元中。上述集成的單元既可以采用硬件的形式實現(xiàn)，也可以采用軟件功能單元的形式實現(xiàn)。

顯然，本領(lǐng)域的技術(shù)人員應(yīng)該明白，上述的本申請的各模塊或各步驟可以用通用的計算裝置來實現(xiàn)，它們可以集中在單個的計算裝置上，或者分布在多個計算裝置所組成的網(wǎng)絡(luò)上，可選地，它們可以用計算裝置可執(zhí)行的程序代碼來實現(xiàn)，從而，可以將它們存儲在存儲裝置中由計算裝置來執(zhí)行，或者將它們分別制作成各個集成電路模塊，或者將它們中的多個模塊或步驟制作成單個集成電路模塊來實現(xiàn)。這樣，本申請不限制于任何特定的硬件和軟件結(jié)合。

以上所述僅為本申請的優(yōu)選實施例，并不用于限制本申請，對于本領(lǐng)域的技術(shù)人員來說，本申請可以有各種更改和變化。凡在本申請的精神和原則之內(nèi)，所作的任何修改、等同替換、改進等，均應(yīng)包含在本申請的保護范圍之內(nèi)。