頁面渲染方法及裝置制造方法
【專利摘要】本發明實施例提供一種頁面渲染方法及裝置。該方法包括:根據頁面對應的源文件中包含的動畫元素標識確定動畫元素;將所述動畫元素或所述動畫元素及所述動畫元素的子元素作為待渲染的目標圖層,對該目標圖層進行渲染得到與所述待渲染的目標圖層對應的紋理;將所述待渲染的目標圖層對應的所述紋理與包括所述源文件中其它元素的圖層對應的紋理進行合成,并顯示到所述頁面上。通過本發明實施例提供的方法,將來可能發生變化的一個或多個元素可以預先被標識出來,然后作為特殊的圖層,當該些元素發生變化時,可以將該特殊圖層進行單獨處理,避免影響其他圖層,有效提升了渲染性能。
【專利說明】頁面渲染方法及裝置
【技術領域】
[0001 ] 本發明實施例涉及計算機【技術領域】,尤其涉及一種頁面渲染方法及裝置。
【背景技術】
[0002]瀏覽器是目前使用最廣泛的軟件之一,主要功能是將用戶選擇的網絡資源通過網頁的形式呈現出來,通常稱這個過程為頁面渲染。實現頁面渲染的關鍵模塊是瀏覽器中的渲染引擎,渲染引擎將網頁中包含的各種元素分為若干圖層進行渲染,每一個圖層由一組具有相同顯示需求的元素組成,最終將每一個圖層的內容按照一定規則進行合成顯示。但是目前的圖層劃分規則造成在某些動畫場景下,動態變化的元素分布于多個圖層,因此當這些元素發生變化時,整個或大部分頁面都需要進行重新渲染,而重新渲染過程計算復雜,耗時較大,因此對頁面的渲染性能造成很大的影響。
【發明內容】
[0003]本發明實施例提供一種頁面渲染方法及裝置,在一定程度上提高頁面的渲染性倉泛。
[0004]第一方面,本發明實施例提供一種頁面渲染方法,包括:
[0005]根據所述頁面對應的源文件中包含的動畫元素標識確定動畫元素,其中,所述動畫元素標識用于指示所述動畫元素;
[0006]將所述動畫元素,或,所述動畫元素及所述動畫元素的子元素作為待渲染的目標圖層,對所述待渲染的目標圖層進行渲染,得到與所述待渲染的目標圖層對應的紋理;
[0007]將所述待渲染的目標圖層對應的所述紋理與包括所述源文件中其它元素的圖層對應的紋理進行合成,并顯示到所述頁面上。
[0008]結合第一方面,在第一方面的第一種可能的實施方式中,所述方法還包括:
[0009]當隱藏所述待渲染的目標圖層包含的任意一個元素時,判斷所述元素是否為紋理隱藏標識指示的元素,若所述元素為紋理隱藏標識指示的元素,則將所述待渲染的目標圖層對應的所述紋理進行隱藏;
[0010]當重新顯示所述隱藏的所述元素時,將所述隱藏的所述紋理重新進行顯示。
[0011]結合第一方面或第一方面的第一種可能的實施方式,在第一方面的第二種可能的實施方式中,當所述待渲染的目標圖層中任意一個或多個待渲染的目標圖層的內容發生變化時,還包括:
[0012]根據所述待渲染的目標圖層對應的屬性信息確定所述待渲染的目標圖層中發生變化的一個或多個待渲染的目標圖層;
[0013]對所述發生變化的一個或多個待渲染的目標圖層進行重新渲染,生成與所述發生變化的待渲染的目標圖層對應的新的紋理;其中,所述頁面中的其它未發生變化的待渲染的目標圖層對應的紋理保持原來的狀態;
[0014]將所述發生變化的待渲染的目標圖層對應的所述新的紋理、其它未發生變化的待渲染的目標圖層對應的紋理以及包括所述源文件中其它元素的圖層對應的紋理合成后顯示到所述頁面上。
[0015]結合第一方面或第一方面的第一種可能的實施方式,在第一方面的第三種可能的實施方式中,
[0016]當所述待渲染的目標圖層中任意一個或多個待渲染的目標圖層的位置信息或透明度信息發生變化時,還包括:
[0017]根據所述待渲染的目標圖層的位置信息或透明度信息確定發生變化的一個或多個待渲染的目標圖層;
[0018]更改所述一個或多個待渲染的目標圖層對應的紋理的紋理屬性;
[0019]將所述一個或多個待渲染的目標圖層對應的更改紋理屬性后的紋理,其它未發生變化的待渲染的目標圖層對應的紋理以及包括所述源文件中其它元素的圖層對應的紋理合成后顯示到所述頁面上。
[0020]結合第一方面、第一方面的第一種至第三種可能的實施方式中的任一種可能的實現方式,在第一方面的第四種可能的實施方式中,所述對所述待渲染的目標圖層進行渲染,得到與所述待渲染的目標圖層對應的紋理,包括:
[0021]對所述待渲染的目標圖層中包含的一個或多個元素進行布局;
[0022]根據布局后的所述待渲染的目標圖層中包含的元素的繪制信息生成所述待渲染的目標圖層的繪制命令;
[0023]根據所述待渲染的目標圖層的繪制命令繪制與所述待渲染的目標圖層對應的圖像;
[0024]將所述待渲染的目標圖層對應的圖像轉換為與所述待渲染的目標圖層對應的紋理。
[0025]第二方面,本發明實施例提供一種頁面渲染裝置,包括:
[0026]第一確定模塊,用于根據所述頁面對應的源文件中包含的動畫元素標識確定動畫元素,其中,所述動畫元素標識用于指示所述動畫元素;
[0027]渲染生成模塊,用于將所述第一確定模塊確定的所述動畫元素,或,所述動畫元素及所述動畫元素的子元素作為待渲染的目標圖層,對所述待渲染的目標圖層進行渲染,得到與所述待渲染的目標圖層對應的紋理;
[0028]合成顯示模塊,用于將所述渲染生成模塊得到的所述待渲染的目標圖層對應的所述紋理與包括所述源文件中其它元素的圖層對應的紋理進行合成,并顯示到所述頁面上。
[0029]結合第二方面,在第二方面的第一種可能的實施方式中,所述頁面渲染裝置還包括:
[0030]紋理隱藏模塊,用于當隱藏所述待渲染的目標圖層包含的任意一個元素時,判斷所述元素是否為紋理隱藏標識指示的元素,若所述元素為紋理隱藏標識指示的元素,則將所述待渲染的目標圖層對應的所述紋理進行隱藏;
[0031]重新顯示模塊,用于當重新顯示所述紋理隱藏模塊所隱藏的所述元素時,將所述隱藏的所述紋理重新進行顯示。
[0032]結合第二方面或第二方面的第一種可能的實施方式,在第二方面的第二種可能的實施方式中,所述頁面渲染裝置還包括:[0033]第二確定模塊,用于當所述待渲染的目標圖層中任意一個或多個待渲染的目標圖層的內容發生變化時,根據所述待渲染的目標圖層對應的屬性信息確定所述待渲染的目標圖層中發生變化的一個或多個待渲染的目標圖層;
[0034]所述渲染生成模塊還用于對所述第二確定模塊確定的所述發生變化的一個或多個待渲染的目標圖層進行重新渲染,生成與所述發生變化的待渲染的目標圖層對應的新的紋理;其中,所述頁面中的其它未發生變化的待渲染的目標圖層對應的紋理保持原來的狀態;
[0035]所述合成顯示模塊還用于將所述發生變化的待渲染的目標圖層對應的所述新的紋理、其它未發生變化的待渲染的目標圖層對應的紋理以及包括所述源文件中其它元素的圖層對應的紋理合成后顯示到所述頁面上。
[0036]結合第二方面或第二方面的第二種可能的實施方式,在第二方面的第三種可能的實施方式中,所述頁面渲染裝置還包括:
[0037]屬性更改模塊,用于當所述待渲染的目標圖層中任意一個或多個待渲染的目標圖層的位置信息或透明度信息發生變化時,根據所述待渲染的目標圖層的位置信息或透明度信息確定發生變化的一個或多個待渲染的目標圖層;更改所述一個或多個待渲染的目標圖層對應的紋理的紋理屬性;
[0038]所述合成顯示模塊還用于將所述一個或多個待渲染的目標圖層對應的更改紋理屬性后的紋理,其它未發生變化的待渲染的目標圖層對應的紋理以及包括所述源文件中其它元素的圖層對應的紋理合成后顯示到所述頁面上。
[0039]結合第二方面、第二方面的第一種至第二方面的第三種可能的實施方式中的任一種可能的實施方式,在第二方面的第四種可能的實施方式中,所述渲染生成模塊具體用于:對所述待渲染的目標圖層中包含的一個或多個元素進行布局;根據布局后的所述待渲染的目標圖層中包含的元素的繪制信息生成所述待渲染的目標圖層的繪制命令;根據所述待渲染的目標圖層的繪制命令繪制與所述待渲染的目標圖層對應的圖像;將所述待渲染的目標圖層對應的圖像轉換為與所述待渲染的目標圖層對應的紋理。
[0040]可見,本發明實施例提供的頁面渲染方法及裝置,根據頁面對應的源文件中包含的動畫元素標識確定動畫元素,并將確定的的動畫元素或動畫元素及該動畫元素的子元素作為待渲染的目標圖層;并對該待渲染的目標圖層進行單獨渲染(其他元素組成的圖層的紋理可以保持不變),生成與該待渲染的目標圖層對應的紋理;最后將所生成的待渲染的目標圖層的紋理與其他元素組成的圖層對應的紋理進行合成后顯示至頁面上。本發明實施例提供的方法,使得用戶可以根據自己的需求指定將來可能發生變化的一個或多個元素作為動畫元素,并將該動畫元素或動畫元素及該動畫元素的子元素作為特殊的圖層,當這些元素發生變化時,可以將該特殊圖層進行單獨處理,避免影響其他圖層,有效地提升了頁面的渲染性能。
【專利附圖】
【附圖說明】
[0041]為了更清楚地說明本發明實施例中的技術方案,下面將對本發明實施例中所需要使用的附圖做一簡單地介紹,顯而易見地,下面描述中的附圖是本發明的一些實施例,對于本領域普通技術人員來講,在不付出創造性勞動性的前提下,還可以根據這些附圖獲得其他的附圖。
[0042]圖1為本發明實施例提供的一種頁面渲染方法的流程示意圖;
[0043]圖2為對待渲染的目標圖層進行渲染并生成紋理的具體流程示意圖;
[0044]圖3為本發明實施例提供的另一種頁面渲染方法的流程示意圖;
[0045]圖4為本發明實施例提供的再一種頁面渲染方法的流程示意圖;
[0046]圖5為本發明實施例提供的一種頁面渲染裝置的結構示意圖;
[0047]圖6為本發明實施例提供的另一種頁面渲染裝置的結構示意圖;
[0048]圖7為本發明實施例提供的再一種頁面渲染裝置的結構示意圖;
[0049]圖8為本發明實施例提供的再一種頁面渲染裝置的結構示意圖;
[0050]圖9為本發明實施例提供的再一種頁面渲染裝置的結構示意圖。
【具體實施方式】
[0051]為使本發明實施例的目的、技術方案和優點更加清楚,下面將結合本發明實施例中的附圖,對本發明實施例中的技術方案進行清楚、完整地描述,顯然,所描述的實施例是本發明的一部分實施例,而不是全部的實施例。基于本發明中的實施例,本領域普通技術人員在沒有作出創造性勞動前提下所獲得的所有其他實施例,都屬于本發明保護的范圍。
[0052]請參閱圖1,為本發明提供的頁面渲染方法實施例一的流程示意圖。該方法可以應用于渲染引擎,較佳的,可以應用于Webkit、Geoko、Presto、Blink等瀏覽器渲染引擎,當然也可以應用于其他類型的渲染引擎,對此本發明實施例不做限定。如圖1所示,該方法可以包括:
[0053]SlOl:根據頁面對應的源文件中包含的動畫元素標識確定動畫元素,其中,該動畫元素標識用于指示所述動畫元素。
[0054]具體的,在瀏覽器窗口中所顯示的頁面實際包括多個圖層,每個圖層都包括一個或多個元素,并且其中的一些元素還可以包括一個或多個子元素,每個元素上都有其對應的屬性信息和繪制信息,這里的屬性信息是元素在頁面中的位置或顏色等信息,繪制信息是與該元素的繪制形狀相關的信息。
[0055]這些元素及元素的各種信息在頁面顯示之前會保存在頁面對應的源文件中,例如:超文本標記語言(Hyper Text Mark-up Language,以下簡稱HTML)文件就是一種典型的源文件。在源文件中通過增加動畫元素標識將一個或多個源文件中的元素指示為動畫元素,該動畫元素為未來可能發生變化的元素,并且該動畫元素可以包括相應的子元素,該子元素的個數大于等于0,動畫元素是否具備子元素可以根據源文件的結構來判定。
[0056]S102:將上述動畫元素,或,動畫元素及該動畫元素的子元素作為待渲染的目標圖層,對該待渲染的目標圖層進行渲染,得到與該待渲染的目標圖層對應的紋理。
[0057]渲染引擎可以從相應的服務器中獲取該頁面對應的源文件,在對源文件進行解析的過程中通過識別動畫元素標識確定動畫元素,當動畫元素具備子元素時,也要確定這些子元素,然后將該動畫元素,或者,該動畫元素及其子元素確定為待渲染的目標圖層。需要注意的是,如果有多個動畫元素,則該多個動畫元素中的每個動畫元素作為一個待渲染的目標圖層,或,將每個動畫元素及每個動畫元素的子元素單獨地作為一個待渲染的目標圖層,即最后得到的待渲染的目標圖層可以為多個。[0058]進一步地,將上述所確定的待渲染的目標圖層進行單獨渲染,可選的,可以利用相應的軟件命令實現,將該待渲染的目標圖層放入一個單獨渲染模塊中來執行渲染過程。
[0059]S103:將上述待渲染的目標圖層對應的紋理與包括上述源文件中其它元素的圖層對應的紋理進行合成,并顯示到頁面上。
[0060]具體的,在上述頁面渲染過程中,僅對該待渲染的目標圖層進行單獨渲染,生成待渲染的目標圖層對應的紋理,其他元素所在的圖層對應的紋理不變。在最后進行顯示時,只需要將上述生成的待渲染的目標圖層的紋理與包括其他元素的圖層對應的紋理進行合成并顯示至頁面上即可。
[0061]可見,本發明實施例提供的頁面渲染方法,根據頁面對應的源文件中包含的動畫元素標識確定動畫元素,并將確定的的動畫元素或動畫元素及該動畫元素的子元素作為待渲染的目標圖層;并對該待渲染的目標圖層進行單獨渲染(其他元素組成的圖層的紋理可以保持不變),生成與該待渲染的目標圖層對應的紋理;最后將所生成的待渲染的目標圖層的紋理與其他元素組成的圖層對應的紋理進行合成后顯示至頁面上。本發明實施例提供的方法,使得用戶可以根據自己的需求指定將來可能發生變化的一個或多個元素作為動畫元素,并將該動畫元素或動畫元素及該動畫元素的子元素作為特殊的圖層,當這些元素發生變化時,可以將該特殊圖層進行單獨處理,避免影響其他圖層,有效地提升了頁面的渲染性倉泛。
[0062]在上述圖1所示實施例的基礎上,作為本發明實施例的一種可行的實施方式,圖2為對待渲染的目標圖層進行渲染并生成紋理的具體流程示意圖。參考圖2,該步驟包括:
[0063]S201:對上述待渲染的目標圖層中包含的一個或多個兀素進行布局。
[0064]具體的,當頁面發生動畫時,由于通過本發明實施例事先標識出了發生動畫的這些元素,這些元素都包含在該待渲染的目標圖層中,所以只需要對該待渲染的目標圖層中的一個或多個元素進行布局,即對這些元素的位置信息、高度信息等進行相應的布局。
[0065]S202:根據布局后的待渲染的目標圖層中包含的元素的繪制信息生成待渲染的目標圖層的繪制命令。
[0066]S203:根據待渲染的目標圖層的繪制命令繪制與待渲染的目標圖層對應的圖像。
[0067]具體的,每個元素相應的都有自己的繪制信息,該繪制信息為表示該元素在對應到頁面上的形狀的信息。為了使得渲染引擎在后期的圖像繪制過程中能夠將待渲染的目標圖層的元素準確繪制出來,需要將這些元素的繪制信息轉換為相應的繪制命令,從而根據該繪制命令繪制出相應的圖像,這里的圖像實際上就是該些元素對應的實際的圖形。
[0068]S204:將待渲染的目標圖層對應的圖像轉換為與待渲染的目標圖層對應的紋理。
[0069]具體的,在上述圖像(可以是位圖圖像,也可以是矢量圖像)繪制完成以后,可選的,渲染引擎可以對這些圖像進行保存,對于保存的形式,可以是分塊保存,也可以是其他形式的保存,本發明實施例對此并不做限制。之后,渲染引擎將上述圖像轉換成相應的紋理,與其它紋理進行合成后顯示至頁面上。
[0070]需要說明的是,以上步驟S201-S204的渲染過程可以參考現有技術實現,本發明實施例中不再詳細描述。
[0071]圖3為本發明提供的頁面渲染方法實施例二的流程圖。本實施例涉及的場景是在待渲染的目標圖層的某個元素需要隱藏時的處理過程。如圖3所示,該方法可以包括:[0072]S301:當隱藏上述待渲染的目標圖層包含的任意一個元素時,判斷該元素是否為紋理隱藏標識指示的元素;若該元素為紋理隱藏標識指示的元素,則將上述待渲染的目標圖層對應的紋理進行隱藏。
[0073]S302:當重新顯示隱藏的該元素時,將上述隱藏的紋理重新進行顯示。
[0074]具體的,當用戶需要隱藏待渲染的目標圖層中包含的任意一個元素時,若該元素為預先在源文件中利用紋理隱藏標識指示出來的元素,則渲染引擎將上述待渲染的目標圖層對應的紋理進行隱藏。其中,上述紋理隱藏標識用于指示包含該紋理隱藏標識指示的元素所在的圖層對應的紋理不需要被刪除。具體的,例如通過自動改變該紋理對應的屬性為“隱藏”,使得計算機獲知到該屬性從而將該紋理進行隱藏,但與該紋理對應的數據仍然保
&3甶O
[0075]另外需要說明的是,上述通過紋理隱藏標識指示出來的元素可以是上述動畫元素,也可以為待渲染的目標圖層中的其他元素。紋理隱藏標識用來指示計算機它所標識的元素在需要隱藏時不需要被刪除,僅需隱藏即可。
[0076]現有技術中,當要隱藏某個元素時,所做的處理是將該元素所在的圖層對應的紋理刪除,在需要重新顯示該元素時,需要將該元素所在的圖層進行重新渲染,從而增加了計算機的開銷。但是,在本發明實施例中,當用戶需要再次顯示該元素時(該元素即上述被紋理隱藏標識指示出來的元素),渲染引擎所做的操作是將之前隱藏的待渲染的目標圖層的紋理進行重新顯示,無需渲染引擎對待渲染的目標圖層的紋理進行再次渲染,從而大大降低了計算機的開銷。
[0077]可見,本發明實施例提供的頁面渲染方法,通過用戶將待渲染的目標圖層中的某一元素預先利用紋理隱藏標識指示出來,在渲染引擎需要隱藏該元素時,渲染引擎根據紋理隱藏標識隱藏并保存該元素,在重新顯示時,只需將待渲染的目標圖層的紋理重新進行顯示即可,避免了現有技術通過刪除待渲染的目標圖層的紋理才能達到隱藏待渲染的目標圖層中的某一元素,大大降低了計算機的開銷,更加有效的提升了渲染性能。
[0078]圖4為本發明提供的頁面渲染方法實施例三的流程圖,作為本發明實施例的一種可行的實施方式,本實施例提供的方法涉及的是當待渲染的目標圖層中的任意一個圖層發生變化時如何處理。
[0079]具體的,當上述確定出來的待渲染的目標圖層為多個時,該待渲染的目標圖層中任意一個或多個待渲染的目標圖層的內容可能會發生變化,當發生變化時,請參閱圖4,本發明實施例提供的頁面渲染方法還可以包括:
[0080]S401:根據上述待渲染的目標圖層對應的內容屬性信息確定上述待渲染的目標圖層中發生變化的一個或多個待渲染的目標圖層。
[0081]具體的,渲染引擎根據動畫元素標識所指示的動畫元素確定出多個待渲染的目標圖層,渲染引擎在最初均會對所確定的多個待渲染的目標圖層進行渲染,獲取相應的紋理;并且,其他元素所在的圖層的紋理依然保持原來的狀態。進一步的,當用戶在頁面上執行相應的操作致使頁面的內容發生變化,并且所發生的變化位于上述待渲染的目標圖層中的一個或多個待渲染的目標圖層,也就是說上述多個待渲染的目標圖層中的一個或多個待渲染的目標圖層的內容此時發生了變化,則該待渲染的目標圖層對應的內容屬性信息將會發生改變,渲染引擎根據該內容屬性信息即可確定上述多個待渲染的目標圖層中發生變化的待渲染的目標圖層。
[0082]需要說明的是,這里的待渲染的目標圖層對應的內容屬性信息為向渲染引擎指示上述一個或多個的待渲染的目標圖層所發生的變化是內容上的變化的信息。該內容屬性信息會隨著待渲染的目標圖層的內容的變化發生改變,從而使得渲染引擎獲知到這些內容發生變化的待渲染的目標圖層,進而對這些內容發生變化的待渲染的目標圖層的紋理進行重新繪制。
[0083]本發明實施例所說的圖層的內容變化是指圖層中包含的元素的增加、刪除或修改等操作,圖層整體發生的變化,例如圖層位置變化或透明度變化等不包含在所謂的內容變化中。例如:當待渲染的目標圖層中的某些元素的增加或減少,這些增加或減少的元素對應到實際的頁面上可能是頁面上增加了某個圖片或減少了某個圖片,因此該待渲染的目標圖層發生的變化實際上是內容的變化,需要渲染引擎對發生變化的待渲染的目標圖層的紋理進行重新繪制,因此,該發生內容變化的待渲染的目標圖層就會通過改變自己的內容屬性信息告知渲染引擎自己需要進行生成新的紋理。
[0084]S402:對該發生變化的一個或多個待渲染的目標圖層進行重新渲染,生成與上述發生變化的待渲染的目標圖層對應的新的紋理;其中,上述頁面中的其它未發生變化的待渲染的目標圖層對應的紋理保持原來的狀態。
[0085]具體的,渲染引擎對所確定的發生變化的一個或多個待渲染的目標圖層進行重新渲染,以獲取這些發生變化的待渲染的目標圖層對應的新的紋理,并且,對于上述所確定的待渲染的目標圖層中的其他未發生變化的待渲染的目標圖層,其紋理保持原來的狀態。
[0086]對上述發生變化的一個或多個待渲染的目標圖層進行重新渲染,以獲取該些發生變化的待渲染的目標圖層對應的新的紋理的具體過程可以參見上述圖2所示的實施例,在此不再贅述。
[0087]S403:將上述發生變化的待渲染的目標圖層對應的新的紋理、其它未發生變化的待渲染的目標圖層對應的紋理以及包括上述源文件中其它元素的圖層對應的紋理合成后顯示到上述頁面上。
[0088]可見,本發明實施例提供的頁面渲染方法,用戶通過頁面對應的源文件中包含的動畫元素標識確定動畫元素,渲染引擎根據所確定的動畫元素或該動畫元素及其子元素確定待渲染的目標圖層,并將該待渲染的目標圖層對應的紋理顯示至頁面后,當該待渲染的目標圖層中的一個或多個待渲染的目標圖層的內容發生變化時,僅需要對這些內容發生變化的待渲染的目標圖層進行重新渲染,從而避免了對所有待渲染的目標圖層進行重新渲染的過程,進一步提升了渲染的性能,也節約了計算機的開銷。
[0089]在另一種場景下,用戶在頁面執行相應的操作導致上述待渲染的目標圖層中任意一個或多個待渲染的目標圖層的位置信息或透明度信息發生變化,則渲染引擎根據所述待渲染的目標圖層的位置信息或透明度信息確定發生變化的一個或多個待渲染的目標圖層,然后更改發生變化的待渲染的目標圖層對應的紋理的紋理屬性;將該更改屬性后的紋理、其它未發生變化的待渲染的目標圖層對應的紋理以及包括上述源文件中其它元素的圖層對應的紋理合成后顯示到上述頁面上。
[0090]需要說明的是,這里的待渲染的目標圖層的位置信息或透明度信息和前述實施例中提到的待渲染的目標圖層對應的內容屬性信息是不同的概念,待渲染的目標圖層對應的內容屬性信息主要指示的是待渲染的目標圖層的內容是否發生變化,這里的待渲染的目標圖層的位置信息或透明度信息指示的是待渲染的目標圖層發生的變化是非內容上的變化。
[0091]可見,本發明實施例提供的頁面渲染方法,用戶通過頁面對應的源文件中包含的動畫元素標識確定動畫元素,渲染引擎根據所確定的動畫元素或該動畫元素及其子元素確定待渲染的目標圖層,并將該待渲染的目標圖層對應的紋理顯示至頁面后,當該多個待渲染的目標圖層中的一個或多個待渲染的目標圖層的位置信息或形狀信息發生變化時,僅需要更改發生變化的待渲染的目標圖層對應的原來紋理的紋理屬性,從而避免了對所有待渲染的目標圖層進行重新渲染的過程,進一步提升了渲染的性能,也節約了計算機的開銷。
[0092]為了能夠更加清楚的說明本發明實施例在相應的渲染引擎進行頁面渲染時帶來的有益效果,接下來的實施例以渲染引擎為webkit為例介紹本發明提供的頁面渲染方法。可以理解的是,本發明實施例并不局限于webkit渲染引擎。
[0093]實施例四
[0094]為了便于理解,首先介紹一下webkit渲染引擎執行頁面渲染時的基本過程:webkit引擎從網絡服務器中請求網絡資源并對其進行解析,獲得多個元素和各元素的層疊樣式表(Cascading Style Sheets,以下簡稱CSS)屬性;根據上述獲得的多個元素構造文檔對象模型(Document Object Model,以下簡稱DOM)樹;將上述各個元素的CSS屬性附加至上述DOM樹后生成渲染樹(render tree),其中,渲染樹可以包括一個根層(render view)和render view下的多個圖層,可選的,這些圖層下可以有一個或多個子圖層。[!卩,renderview對應一個根元素(根元素下包括父元素,父元素下包括子元素),渲染樹中的每個圖層對應一個父元素及該父元素下的子元素。之后,對渲染樹中的所有圖層進行布局,實際上是對該些圖層對應的父元素及該父元素下的子元素進行布局。根據布局后的各個元素的繪制信息生成相應的繪制命令,根據該繪制命令繪制為圖像,并將圖像轉換為相應的紋理(Texture);最后將上述紋理進行合成后顯示到頁面上。
[0095]基于webkit渲染引擎,本發明實施例提供的頁面渲染方法包括:`[0096]Dwebkit渲染引擎獲取所述頁面的源HTML文件,該HTML文件中包括多個元素以及元素的相關信息,并且,開發者在HTML文件中利用動畫元素標識指示出未來可能發生變化的某些元素為動畫元素。動畫元素標識用于指示該元素在后面的處理過程中可以被包括在待渲染的目標圖層中,這里的待渲染的目標圖層即為動畫層(下面的實施例中所提到的動畫層均為待渲染的目標圖層,動畫層標識均為動畫元素標識)。
[0097]需說明的是,這里的動畫元素標識具體可以采用布爾變量,例如isAnimationLayer就是一個布爾變量,當isAnimationLayer=true時標識該兀素為動畫元素,當isAnimationLayer=false時標識該元素不是動畫元素;也可以當一個元素后有isAnimationLayer標識時確定該元素為動畫元素,當沒有該標識時確定該元素不是動畫元素。
[0098]2) webkit渲染引擎解析HTML文件生成DOM樹;將相應的CSS文件也執行解析并附加到該DOM樹上生成渲染樹(render tree)。該渲染樹包括至少兩個渲染層(renderlayer),每一個渲染層包含一個父元素及該父元素的子元素(沒有子元素也是可以的),這里的父元素和子元素可以統稱為元素。
[0099]需要注意的是,在本發明實施例中,這棵渲染樹中的某些元素上已經有了動畫層標識。
[0100]3)webkit渲染引擎對該渲染樹進行解析,提取有動畫層標識的一個元素及其子元素,將它們確定為動畫層。最終確定的動畫層可以是一個,也可以是多個,本發明實施例對此不做限制。當確定出多個動畫層時,可以通過一個動畫層列表(AnimationList)來維護所有的動畫層的信息,其中,該動畫層列表中記錄的可以是動畫層標識與其當初所在的渲染層的映射關系。
[0101]現有技術中,當頁面中發生動畫時,由于動畫層和其它渲染層沒有區分,所以會觸發所有元素進行重新渲染,計算時間較長,渲染性能較差。但采用本發明實施例提供的方案之后,所有可能發生變化的元素已經放到動畫層中,因此當頁面發生變化時,只需要對動畫層進行單獨的渲染。
[0102]4)當頁面發生變化時,webkit渲染引擎對確定出的動畫層進行渲染,以獲取該動畫層對應的紋理。
[0103]具體的,首先,對動畫層中所包含的元素進行布局,該布局過程包括元素的絕對位置信息的確定、顏色信息確定等;其次,根據布局后的動畫層中所包含的所有元素的繪制信息生成該動畫層的繪制命令,并將該繪制命令保存至動畫層樹(AnimationLayersTree)中的SKPicture中,該AnimationLayersTree和SKPicture可以看做是軟件實現時的一個命令模塊;最后,根據該繪制命令繪制圖像(SKPbitmap),并將圖像轉換為與動畫層對應的紋理,可選的,可以將該些紋理可以分塊(Ti Ie )進行保存。
[0104]5)將動畫層的紋理與其他元素所在的圖層對應的紋理進行合成后顯示至頁面上。
[0105]可見,本發明實施例提供的頁面渲染方法,根據頁面對應的源文件中用戶利用動畫元素標識指示出的動畫元素或該動畫元素和該動畫元素的子元素確定待渲染的目標圖層;并對該待渲染的目標圖層進行單獨渲染(其他元素組成的圖層的紋理保持不變),生成與該待渲染的目標圖層對應的紋理;最后將所生成的待渲染的目標圖層的紋理與其他圖層對應的紋理進行合成后顯示至頁面上。本發明實施例提供的方法,使得用戶可以根據自己的需求指定將來可能發生變化的一個或多個元素作為動畫元素,并將該動畫元素或動畫元素及該動畫元素的子元素作為特殊的圖層,當該些元素發生變化時,可以將該特殊圖層進行單獨處理,避免影響其他圖層,有效地提升了渲染效率和性能。
[0106]實施例五
[0107]具體的,本實施例可以對應上述圖3所示的實施例。在本發明實施例中,用戶可以通過動畫元素標識在源文件中指示出動畫元素,還可以通過紋理隱藏標識在源文件中指示出待隱藏的元素,并且該動畫元素和待隱藏的元素可以是同一個元素,也可以不是同一個元素。具體的,若以webkit渲染引擎為例,該紋理隱藏標識可以為紋理保存標識(reservetexture)。
[0108]一般的,上述待隱藏的元素有“ Vi sibi I i ty ”標識,該標識的值默認為Vi sibIe,表明該待隱藏的元素此時是需要顯示的,相應的,該元素所在的動畫層可以具備isHidden標識,該標識的值默認為False。當該元素需要被隱藏時,該元素的“visibility”會被置為hidden。若按照現有技術處理,webkit渲染引擎會將之前生成的動畫層的紋理進行刪除以達到隱藏的目的,并且在需要重新顯示該元素時,瀏覽器會對動畫層的所有元素進行重新渲染以獲取動畫層的紋理,進而重新在頁面上顯示該動畫層。但是,本發明實施例中,渲染引擎會檢測“reservetexture”的值,當“reservetexture”的值為True時,表示該元素被隱藏時(visibility=hidden)只需隱藏之前所渲染的動畫層的紋理,并將動畫層的isHidden屬性置為True,以使該動畫層的紋理不顯示在頁面上,而并不需要刪除之前繪制的動畫層的紋理,這樣做的好處是在頁面需要再次顯示該元素時,只需要該元素所在的動畫層的isHidden屬性改為F alse,可以重用之前保存的該動畫層的紋理數據,提升整體渲染性能。
[0109]可見,本發明實施例提供的頁面渲染方法,通過用戶將待渲染的目標圖層中的某一元素預先利用紋理隱藏標識指示出來,在該元素需要被隱藏時,瀏覽器根據紋理隱藏標識隱藏并保存該元素,在重新顯示時,只需將待渲染的目標圖層的紋理重新進行顯示即可,避免了現有技術通過刪除待渲染的目標圖層的紋理才能達到隱藏待渲染的目標圖層中的某一元素,大大降低了計算機的開銷,更加有效的提升了渲染性能。
[0110]實施例六
[0111]具體的,本實施例對應上述圖4所示的實施例。
[0112]當webkit渲染引擎根據用戶在HTML文件中通過“ isAnimationlayer”指示出的動畫元素確定的動畫層為多個時,webkit渲染引擎對所確定的多個動畫層的紋理進行繪制后,與其他元素所在的圖層對應的紋理進行合成并顯示至頁面上。當用戶在頁面上執行了某一操作后,webkit渲染引擎會根據渲染樹的的“isAnimationLayoutOnly”標識判斷所發生的變化是不是位于上述所確定的多個動畫層上,當“isAnimation LayoutOnIy^標識為True,表明所發生的變化僅位于上述所確定的多個動畫層上;當“isAnimationLayoutOnly”為False時,表明所發生的變化還位于其他元素所在的圖層上,需要對所有的圖層進行重新布局。
[0113]當所發生的變化僅位于上述所確定的多個動畫層上時,webkit渲染引擎根據上述多個動畫層的屬性信息(即“isDirty”標識)確定該多個動畫層中的哪些動畫層發生了內容變化,當該多個動畫層中某些動畫層的“isDirty”標識的值為True時,表明這些動畫層的內容發生了變化,需要對該些動畫層進行重新渲染,獲取新的紋理;當該多個動畫層中某些動畫層的“isDirty”標識的值為False時,表明該些動畫層內容未發生變化,繼續沿用之前所繪制的紋理。
[0114]最后,webkit渲染引擎將上述發生變化的動畫層對應的新的紋理,其他未發生變化的動畫層對應的紋理以及上述源文件中其他元素所在的圖層對應的紋理進行合成顯示到頁面上。
[0115]當所發生的變化還位于其他元素所在的圖層上時,webkit渲染引擎需要對所有的圖層進行重新布局,并且這些圖層的紋理仍然按照現有技術進行繪制,即當頁面其他內容變化(非動畫層的內容)后,還是會準備其他圖層的新紋理以及最后的頁面繪制,不過這個過程就不會把動畫層的紋理繪制出來(動畫層有其單獨的紋理繪制過程);另一方面,繼續對動畫層進行單獨繪制,優選的,可以采取isReady標識來標識動畫層的圖像紋理是否已經繪制好,當isReady為true時,表示該動畫層的紋理已經繪制成功,當isReady為false時,表示該動畫層的紋理還沒有繪制成功。在對動畫層的紋理進行繪制的過程中,不需要所有動畫層的圖像準備好后才開始繪制紋理,但是,當動畫層樹中存在部分動畫層的isReady標識還是false的情況,表明還未完成整個頁面的渲染(即部分動畫層的紋理未準備好,也沒有繪制到屏幕上),則此時需要把紋理繪制過程中的返回值設置為真,使得webkit渲染引擎獲知還需要對上述未準備好紋理的動畫層繼續進行繪制,以確保頁面的整體渲染和顯
/Jn ο
[0116]可見,本發明實施例提供的頁面渲染方法,用戶通過頁面對應的源文件中包含的動畫元素標識確定動畫元素,渲染引擎根據所確定的動畫元素或該動畫元素及其子元素確定待渲染的目標圖層,并將該待渲染的目標圖層對應的紋理顯示至頁面后,當該待渲染的目標圖層中的一個或多個待渲染的目標圖層的內容發生變化時,僅需要對這些內容發生變化的待渲染的目標圖層進行重新渲染,從而避免了對所有待渲染的目標圖層進行重新渲染的過程,進一步提升了渲染的性能,也節約了計算機的開銷。
[0117]實施例七
[0118]具體的,本實施例對應的是上述待渲染的目標圖層中任意一個或多個待渲染的目標圖層的位置信息或透明度信息發生變化時,渲染引擎進行相應處理的實施例。
[0119]具體的,當webkit渲染引擎確定頁面發生的變化位于上述多個動畫層上,webkit渲染引擎可以通過上述多個動畫層的“hasOpacity”標識或“hasTransfrom”標識判斷是否含有內容未變的動畫效果,即是否是上述多個動畫層的位置信息或透明度信息發生變化。當“hasOpacity”標識或“hasTransfrom”標識的值為True時,表明動畫層含有內容未變的動畫效果,當“hasOpacity”標識和“hasTransfrom”標識的值為False時,表明動畫層沒有內容未變的動畫效果。
[0120]當上述多個動畫層的位置信息或透明度信息發生變化時,則webkit渲染引擎更改該發生變化的動畫層對應的紋理的紋理屬性。最后,webkit渲染引擎將該發生變化的動畫層對應的更改紋理屬性后的紋理、其它未發生變化的動畫層對應的紋理以及上述源文件中其它元素組成的圖層對應的紋理合成后顯示到上述頁面上。
[0121]可見,本發明實施例提供的頁面渲染方法,用戶通過頁面對應的源文件中包含的動畫元素標識確定動畫元素,渲染引擎根據所確定的動畫元素或該動畫元素及其子元素確定待渲染的目標圖層,并將該待渲染的目標圖層對應的紋理顯示至頁面后,當該待渲染的目標圖層中的一個或多個待渲染的目標圖層的位置信息或形狀信息發生變化時,僅需要更改發生變化的待渲染的目標圖層對應的原來紋理的紋理屬性,從而避免了對所有待渲染的目標圖層進行重新渲染的過程,進一步提升了渲染的性能,也節約了計算機的開銷。
[0122]本領域普通技術人員可以理解:實現上述各方法實施例的全部或部分步驟可以通過程序指令相關的硬件來完成。前述的程序可以存儲于一計算機可讀取存儲介質中。該程序在執行時,執行包括上述各方法實施例的步驟;而前述的存儲介質包括:R0M (Read-OnlyMemory,只讀存儲器)、RAM (Random Access Memory,隨機存儲器)、磁碟或者光盤等各種可以存儲程序代碼的介質。
[0123]請參閱圖5,為本發明提供的頁面渲染裝置實施例一的結構示意圖。如圖5所示,該頁面渲染裝置30包括:
[0124]第一確定模塊10,用于根據所述頁面對應的源文件中包含的動畫元素標識確定動畫元素,其中,所述動畫元素標識用于指示所述動畫元素。
[0125]渲染生成模塊11,用于對上述第一確定模塊10確定的動畫元素,或,該動畫元素及該動畫元素的子元素作為待渲染的目標圖層,對該待渲染的目標圖層進行渲染,得到與待渲染的目標圖層對應的紋理。[0126]合成顯示模塊12,用于將上述渲染生成模塊11得到的待渲染的目標圖層對應的所述紋理與包括上述源文件中其它元素組成的圖層對應的紋理合成后顯示到頁面上。
[0127]本實施例涉及的頁面渲染裝置可以執行上述方法實施例,其實現原理和技術效果類似,在此不再贅述。
[0128]可見,本發明實施例提供的頁面渲染裝置,根據頁面對應的源文件中包含的動畫元素標識確定動畫元素,并將確定的的動畫元素或動畫元素及該動畫元素的子元素作為待渲染的目標圖層;并對該待渲染的目標圖層進行單獨渲染(其他元素組成的圖層的紋理可以保持不變),生成與該待渲染的目標圖層對應的紋理;最后將所生成的待渲染的目標圖層的紋理與其他元素組成的圖層對應的紋理進行合成后顯示至頁面上,使得用戶可以根據自己的需求指定將來可能發生變化的一個或多個元素作為動畫元素,并將該動畫元素或動畫元素及該動畫元素的子元素作為特殊的圖層,當這些元素發生變化時,可以將該特殊圖層進行單獨處理,避免影響其他圖層,有效地提升了頁面的渲染性能。
[0129]圖6為本發明提供的頁面渲染裝置實施例二的結構示意圖,在上述圖5所示實施例的基礎上,進一步地,該頁面渲染裝置30還可以包括:
[0130]紋理隱藏模塊13,用于當隱藏上述待渲染的目標圖層包含的任意一個元素時,判斷該元素是否為紋理隱藏標識指示的元素,若該元素為紋理隱藏標識指示的元素,則將上述待渲染的目標圖層對應的紋理進行隱藏。
[0131]重新顯示模塊14,用于當重新顯示所述紋理隱藏模塊13所隱藏的元素時,將隱藏的所述紋理重新進行顯示。
[0132]本實施例涉及的頁面渲染裝置可以執行上述方法實施例,其實現原理和技術效果類似,在此不再贅述。
[0133]可見,本發明實施例提供的頁面渲染裝置,通過用戶將待渲染的目標圖層中的某一元素預先利用紋理隱藏標識指示出來,在渲染引擎需要隱藏該元素時,渲染引擎根據紋理隱藏標識隱藏并保存該元素,在重新顯示時,只需將待渲染的目標圖層的紋理重新進行顯示即可,避免了現有技術通過刪除待渲染的目標圖層的紋理才能達到隱藏待渲染的目標圖層中的某一元素,大大降低了計算機的開銷,更加有效的提升了渲染性能。
[0134]圖7為本發明提供的頁面渲染裝置實施例三的結構示意圖,在上述圖6所示實施例的基礎上,進一步地,上述頁面渲染裝置30還可以包括:
[0135]第二確定模塊15,用于當上述待渲染的目標圖層中任意一個或多個待渲染的目標圖層的內容發生變化時,根據上述待渲染的目標圖層對應的屬性信息確定上述待渲染的目標圖層中發生變化的一個或多個待渲染的目標圖層。
[0136]渲染生成模塊11還用于對第二確定模塊15確定的上述發生變化的一個或多個待渲染的目標圖層進行重新渲染,生成與該發生變化的待渲染的目標圖層對應的新的紋理。其中,上述頁面中的其它未發生變化的待渲染的目標圖層對應的紋理保持原來的狀態。
[0137]上述合成顯示模塊12還用于將該發生變化的待渲染的目標圖層對應的新的紋理、其它未發生變化的待渲染的目標圖層對應的紋理以及包括上述源文件中其它元素組成的圖層對應的紋理合成后顯示到頁面上。
[0138]本實施例涉及的頁面渲染裝置可以執行上述方法實施例,其實現原理和技術效果類似,在此不再贅述。[0139]圖8為本發明提供的頁面渲染裝置實施例四的結構示意圖,在上述圖7所述實施例的基礎上,進一步地,上述頁面渲染裝置30還可以包括:
[0140]屬性更改模塊16,用于當所述待渲染的目標圖層中任意一個或多個待渲染的目標圖層的位置信息或透明度信息發生變化時,根據所述待渲染的目標圖層的位置信息或透明度信息確定發生變化的一個或多個待渲染的目標圖層;更改所述一個或多個待渲染的目標圖層對應的紋理的紋理屬性。
[0141]相應的,所述合成顯示模塊還用于將所述一個或多個待渲染的目標圖層對應的更改紋理屬性后的紋理,其它未發生變化的待渲染的目標圖層對應的紋理以及包括所述源文件中其它元素的圖層對應的紋理合成后顯示到所述頁面上。
[0142]本實施例涉及的頁面渲染裝置可以執行上述方法實施例,其實現原理和技術效果類似,在此不再贅述。
[0143]進一步地,在上述實施例的基礎上,上述渲染生成模塊11具體用于對上述待渲染的目標圖層中包含的一個或多個元素進行布局;根據布局后的待渲染的目標圖層中包含的元素的繪制信息生成待渲染的目標圖層的繪制命令;并根據該待渲染的目標圖層的繪制命令繪制與待渲染的目標圖層對應的圖像;并將待渲染的目標圖層對應的圖像轉換為與待渲染的目標圖層對應的紋理。
[0144]本實施例涉及的頁面渲染裝置可以執行上述方法實施例,其實現原理和技術效果類似,在此不再贅述。
[0145]可見,本發明實施例提供的頁面渲染裝置,當上述待渲染的目標圖層中的一個或多個待渲染的目標圖層的內容發生變化時,僅需要對這些內容發生變化的待渲染的目標圖層進行重新渲染;該上述待渲染的目標圖層中的一個或多個待渲染的目標圖層的位置信息或形狀信息發生變化時,僅需要更改發生變化的待渲染的目標圖層對應的原來紋理的紋理屬性,從而避免了對所有待渲染的目標圖層進行重新渲染的過程,進一步提升了渲染的性能,也節約了計算機的開銷。
[0146]圖9為本發明提供的頁面渲染裝置實施例五的結構示意圖。如圖9所示,該頁面渲染裝置30包括:處理器20、存儲器21以及用戶接口 22,三者通過總線23連接。當然,除此之外,本發明實施例提供的頁面渲染裝置還可以包括用于與其它設備通信的通信接口等。圖9所示的頁面渲染裝置具體可以為手機、平板電腦、臺式計算機、便攜式計算機、服務器等電子設備。
[0147]總線23用于實現處理器20、存儲器21以及用戶接口 22之間的連接通信。該總線可以是 ISA(Industry Standard Architecture,工業標準體系結構)總線、PCI(PeripheralComponent Interconnect,外部設備互連)總線或 EISA (Extended Industry StandardArchitecture,擴展工業標準體系結構)總線等。所述總線可以是一條或多條物理線路,當是多條物理線路時可以分為地址總線、數據總線、控制總線等。
[0148]用戶接口 22用于接收用戶的操作,或向用戶展示頁面。例如,在本發明實施例中,用戶通過用戶接口 22操作頁面,使得頁面上的內容發生變化,從而觸發處理器20對該頁面進行重新渲染。
[0149]存儲器21用于存儲計算機程序,可以包括應用程序和操作系統程序。
[0150]處理器20,用于從存儲器21中讀取計算機程序并用于執行以下操作,具體為:[0151]根據所述頁面對應的源文件中包含的動畫元素標識確定動畫元素,其中,該動畫元素標識用于指示動畫元素;將該動畫元素,或,動畫元素及該動畫元素的子元素作為待渲染的目標圖層,對該待渲染的目標圖層進行渲染,得到與該待渲染的目標圖層對應的紋理;將該待渲染的目標圖層對應的紋理與包括源文件中其它元素的圖層對應的紋理進行合成,并顯示到頁面上。
[0152]可選的,上述處理器20還可以用于當隱藏上述待渲染的目標圖層包含的任意一個元素時,判斷該元素是否為紋理隱藏標識指示的元素,若該元素為紋理隱藏標識指示的元素,則將上述待渲染的目標圖層對應的紋理進行隱藏;當重新顯示上述隱藏的元素時,將上述隱藏的紋理重新進行顯示。
[0153]可選的,當上述待渲染的目標圖層中任意一個或多個待渲染的目標圖層的內容發生變化時,上述處理器20還可以用于根據上述上待渲染的目標圖層對應的屬性信息確定待渲染的目標圖層中發生變化的一個或多個待渲染的目標圖層;并對該發生變化的一個或多個待渲染的目標圖層進行重新渲染,生成與該發生變化的待渲染的目標圖層對應的新的紋理;其中,上述頁面中的其它未發生變化的待渲染的目標圖層對應的紋理保持原來的狀態;并將上述發生變化的待渲染的目標圖層對應的新的紋理、其它未發生變化的待渲染的目標圖層對應的紋理以及包括上述源文件中其它元素組成的圖層對應的紋理合成后顯示到頁面上。
[0154]在另一種實現方式下,若上述待渲染的目標圖層中任意一個或多個待渲染的目標圖層的位置信息或透明度信息發生變化,則上述處理器20還可以用于根據所述待渲染的目標圖層的位置信息或透明度信息確定發生變化的一個或多個待渲染的目標圖層;更改所述一個或多個待渲染的目標圖層對應的紋理的紋理屬性;將所述一個或多個待渲染的目標圖層對應的更改紋理屬性后的紋理,其它未發生變化的待渲染的目標圖層對應的紋理以及包括所述源文件中其它元素的圖層對應的紋理合成后顯示到所述頁面上。
[0155]可選的,上述處理器20在對待渲染的目標圖層進行渲染以生成待渲染的目標圖層對應的紋理時,具體用于對上述待渲染的目標圖層中包含的一個或多個元素進行布局;并根據布局后的待渲染的目標圖層中包含的元素的繪制信息生成上述待渲染的目標圖層的繪制命令;并根據該待渲染的目標圖層的繪制命令繪制與該待渲染的目標圖層對應的圖像;并將該待渲染的目標圖層對應的圖像轉換為與該待渲染的目標圖層對應的紋理。
[0156]本實施例涉及的頁面渲染裝置可以執行上述方法實施例,其中包含的計算機程序可以按照前述裝置實施例介紹的模塊形式劃分,也可以按照其它模塊劃分方式,也可以不劃分模塊。具體實現方法參考前述實施例,在此不再贅述。
[0157]綜上所述,本發明實施例提供的頁面渲染方法及裝置,根據頁面對應的源文件中包含的動畫元素標識確定動畫元素,并將確定的的動畫元素或動畫元素及該動畫元素的子元素作為待渲染的目標圖層;并對該待渲染的目標圖層進行單獨渲染(其他元素組成的圖層的紋理可以保持不變),生成與該待渲染的目標圖層對應的紋理;最后將所生成的待渲染的目標圖層的紋理與其他元素組成的圖層對應的紋理進行合成后顯示至頁面上,使得用戶可以根據自己的需求指定將來可能發生變化的一個或多個元素作為動畫元素,并將該動畫元素或動畫元素及該動畫元素的子元素作為特殊的圖層,當這些元素發生變化時,可以將該特殊圖層進行單獨處理,避免影響其他圖層,有效地提升了頁面的渲染性能。[0158]進一步的,通過用戶將待渲染的目標圖層中的某一元素預先利用紋理隱藏標識指示出來,在渲染引擎需要隱藏該元素時,渲染引擎根據紋理隱藏標識隱藏并保存該元素,在重新顯示時,只需將待渲染的目標圖層的紋理重新進行顯示即可,避免了現有技術通過刪除待渲染的目標圖層的紋理才能達到隱藏待渲染的目標圖層中的某一元素,大大降低了計算機的開銷,更加有效的提升了渲染性能。
[0159]更進一步的,當上述待渲染的目標圖層中的一個或多個待渲染的目標圖層的內容發生變化時,僅需要對這些內容發生變化的待渲染的目標圖層進行重新渲染;當上述待渲染的目標圖層中的一個或多個待渲染的目標圖層的位置信息或形狀信息發生變化時,僅需要更改發生變化的待渲染的目標圖層對應的原來紋理的紋理屬性,從而避免了對所有待渲染的目標圖層進行重新渲染的過程,進一步提升了渲染的性能,也節約了計算機的開銷。
[0160]最后應說明的是:以上各實施例僅用以說明本發明的技術方案,而非對其限制;盡管參照前述各實施例對本發明進行了詳細的說明,本領域的普通技術人員應當理解:其依然可以對前述各實施例所記載的技術方案進行修改,或者對其中部分或者全部技術特征進行等同替換;而這些修改或者替換,并不使相應技術方案的本質脫離本發明各實施例技術方案的范圍。
[0161]以上所述,僅為本發明的【具體實施方式】,但本發明的保護范圍并不局限于此,任何熟悉本【技術領域】的技術人員在本發明揭露的技術范圍內,可輕易想到變化或替換,都應涵蓋在本發明的保護范圍之內。因此,本發明的保護范圍應以所述權利要求的保護范圍為準。
【權利要求】
1.一種頁面渲染方法,其特征在于,包括: 根據所述頁面對應的源文件中包含的動畫元素標識確定動畫元素,其中,所述動畫元素標識用于指示所述動畫元素; 將所述動畫元素,或,所述動畫元素及所述動畫元素的子元素作為待渲染的目標圖層,對所述待渲染的目標圖層進行渲染,得到與所述待渲染的目標圖層對應的紋理; 將所述待渲染的目標圖層對應的所述紋理與包括所述源文件中其它元素的圖層對應的紋理進行合成,并顯示到所述頁面上。
2.根據權利要求1所述的頁面渲染方法,其特征在于,還包括: 當隱藏所述待渲染的目標圖層包含的任意一個元素時,判斷所述元素是否為紋理隱藏標識指示的元素,若所述元素為紋理隱藏標識指示的元素,則將所述待渲染的目標圖層對應的所述紋理進行隱藏; 當重新顯示所述隱藏的所述元素時,將所述隱藏的所述紋理重新進行顯示。
3.根據權利要求1或2所述的頁面渲染方法,其特征在于,當所述待渲染的目標圖層中任意一個或多個待渲染的目標圖層的內容發生變化時,還包括: 根據所述待渲染的目標圖層對應的內容屬性信息確定所述待渲染的目標圖層中發生變化的一個或多個待渲染的目標圖層; 對所述發生變化的一個或多個待渲染的目標圖層進行重新渲染,生成與所述發生變化的待渲染的目標圖層對應的新的紋理;其中,所述頁面中的其它未發生變化的待渲染的目標圖層對應的紋理保持 原來的狀態; 將所述發生變化的待渲染的目標圖層對應的所述新的紋理、其它未發生變化的待渲染的目標圖層對應的紋理以及包括所述源文件中其它元素的圖層對應的紋理合成后顯示到所述頁面上。
4.根據權利要求1或2所述的頁面渲染方法,其特征在于,當所述待渲染的目標圖層中任意一個或多個待渲染的目標圖層的位置信息或透明度信息發生變化時,還包括: 根據所述待渲染的目標圖層的位置信息或透明度信息確定發生變化的一個或多個待渲染的目標圖層; 更改所述一個或多個待渲染的目標圖層對應的紋理的紋理屬性; 將所述一個或多個待渲染的目標圖層對應的更改紋理屬性后的紋理,其它未發生變化的待渲染的目標圖層對應的紋理以及包括所述源文件中其它元素的圖層對應的紋理合成后顯示到所述頁面上。
5.根據權利要求1-4任一項所述的頁面渲染方法,其特征在于,所述對所述待渲染的目標圖層進行渲染,得到與所述待渲染的目標圖層對應的紋理,包括: 對所述待渲染的目標圖層中包含的一個或多個元素進行布局; 根據布局后的所述待渲染的目標圖層中包含的元素的繪制信息生成所述待渲染的目標圖層的繪制命令; 根據所述待渲染的目標圖層的繪制命令繪制與所述待渲染的目標圖層對應的圖像; 將所述待渲染的目標圖層對應的圖像轉換為與所述待渲染的目標圖層對應的紋理。
6.一種頁面渲染裝置,其特征在于,包括: 第一確定模塊,用于根據所述頁面對應的源文件中包含的動畫元素標識確定動畫元素,其中,所述動畫元素標識用于指示所述動畫元素; 渲染生成模塊,用于將所述第一確定模塊確定的所述動畫元素,或,所述動畫元素及所述動畫元素的子元素作為待渲染的目標圖層,對所述待渲染的目標圖層進行渲染,得到與所述待渲染的目標圖層對應的紋理; 合成顯示模塊,用于將所述渲染生成模塊得到的所述待渲染的目標圖層對應的所述紋理與包括所述源文件中其它元素的圖層對應的紋理進行合成,并顯示到所述頁面上。
7.根據權利要求6所述的頁面渲染裝置,其特征在于,所述頁面渲染裝置還包括: 紋理隱藏模塊,用于當隱藏所述待渲染的目標圖層包含的任意一個元素時,判斷所述元素是否為紋理隱藏標識指示的元素,若所述元素為紋理隱藏標識指示的元素,則將所述待渲染的目標圖層對應的所述紋理進行隱藏; 重新顯示模塊,用于當重新顯示所述紋理隱藏模塊所隱藏的所述元素時,將所述隱藏的所述紋理重新進行顯示。
8.根據權利要求6或7所述的頁面渲染裝置,其特征在于,所述頁面渲染裝置還包括: 第二確定模塊,用于當所述待渲染的目標圖層中任意一個或多個待渲染的目標圖層的內容發生變化時,根據所述待渲染的目標圖層對應的內容屬性信息確定所述待渲染的目標圖層中發生變化的一個或多個待渲染的目標圖層; 所述渲染生成模塊,還用于對所述第二確定模塊確定的所述發生變化的一個或多個待渲染的目標圖層進行重新渲染,生成與所述發生變化的待渲染的目標圖層對應的新的紋理;其中,所述頁面中的其它未發生變化的待渲染的目標圖層對應的紋理保持原來的狀態; 所述合成顯示模塊還用于將所述發生變化的待渲染的目標圖層對應的所述新的紋理、其它未發生變化的待渲染的目標圖層對應的紋理以及包括所述源文件中其它元素的圖層對應的紋理合成后顯示到所述頁面上。
9.根據權利要求6或7所述的頁面渲染裝置,其特征在于,所述頁面渲染裝置還包括: 屬性更改模塊,用于當所述待渲染的目標圖層中任意一個或多個待渲染的目標圖層的位置信息或透明度信息發生變化時,根據所述待渲染的目標圖層的位置信息或透明度信息確定發生變化的一個或多個待渲染的目標圖層;更改所述一個或多個待渲染的目標圖層對應的紋理的紋理屬性; 所述合成顯示模塊還用于將所述一個或多個待渲染的目標圖層對應的更改紋理屬性后的紋理,其它未發生變化的待渲染的目標圖層對應的紋理以及包括所述源文件中其它元素的圖層對應的紋理合成后顯示到所述頁面上。
10.根據權利要求6-9任一項所述的頁面渲染裝置,其特征在于,所述渲染生成模塊具體用于:對所述待渲染的目標圖層中包含的一個或多個元素進行重新布局;根據布局后的所述待渲染的目標圖層中包含的元素的繪制信息生成所述待渲染的目標圖層的繪制命令;根據所述待渲染的目標圖層的繪制命令繪制與所述待渲染的目標圖層對應的圖像;將所述待渲染的目標圖層對應的圖像轉換為與所述待渲染的目標圖層對應的紋理。
【文檔編號】G06F17/30GK103678631SQ201310704331
【公開日】2014年3月26日 申請日期:2013年12月19日 優先權日:2013年12月19日
【發明者】董平, 陳章 申請人:華為技術有限公司