一種網(wǎng)頁顯示方法及裝置的制造方法
【技術領域】
[0001 ] 本發(fā)明具體實施例涉及瀏覽器技術領域,特別涉及一種網(wǎng)頁顯示方法及裝置。
【背景技術】
[0002]隨著計算機和互聯(lián)網(wǎng)技術的發(fā)展,使用各種終端,例如臺式計算機、智能手機、平板電腦等瀏覽網(wǎng)頁是人們日常生活中最為常見的應用之一。在終端中的瀏覽器上瀏覽網(wǎng)頁時,用戶可以通過例如對滾動條的拖動操作、手指在觸摸屏上的滑動操作等使瀏覽器所顯示的網(wǎng)頁發(fā)生滾動,從而使該網(wǎng)頁的各部分依次呈現(xiàn)在瀏覽器窗口中,供用戶查看。瀏覽器窗口中的網(wǎng)頁部分被稱為網(wǎng)頁的頁面可見區(qū)域。為了使該頁面可見區(qū)域呈現(xiàn)出來,瀏覽器需要先生成該頁面可見區(qū)域的實際位圖,并將該實際位圖繪制上屏。
[0003]然而在終端,尤其在移動終端的瀏覽器上瀏覽網(wǎng)頁時,如果瀏覽器所顯示的網(wǎng)頁滾動速度過快,由于受到例如頁面可見區(qū)域的復雜度、終端的計算性能和分辨率,以及瀏覽器內核本身的渲染能力等因素的影響,瀏覽器對該實際位圖的生成和繪制速度可能無法跟上網(wǎng)頁的滾動速度。為了保證網(wǎng)頁滾動的流暢性,在該實際位圖的生成或繪制速度跟不上網(wǎng)頁的滾動速度時,通常會在瀏覽器窗口中繪制空白來替代該實際位圖,這種方法將使頁面可見區(qū)域出現(xiàn)白屏效果。當網(wǎng)頁的復雜度較高,以及終端的分辨率較高時,在網(wǎng)頁的滾動過程中頁面可見區(qū)域將經(jīng)常出現(xiàn)白屏效果。因此,這種方法雖然可以保證網(wǎng)頁滾動的流暢性,但對用戶而言顯然視覺效果較差。
[0004]為了避免出現(xiàn)白屏效果,瀏覽器也可以在網(wǎng)頁滾動過程中,每滾動一次就根據(jù)網(wǎng)頁滾動的距離同步生成該距離對應的頁面位圖,結合頁面可見區(qū)域中已生成的部分可重用的頁面位圖,可以得到頁面可見區(qū)域的實際位圖。這種情況下,網(wǎng)頁的滾動速度將受到該距離對應的頁面位圖的生成和繪制速度的影響,若該距離對應的頁面位圖的生成和繪制速度較慢,將使網(wǎng)頁的滾動出現(xiàn)卡頓的現(xiàn)象。
【發(fā)明內容】
[0005]有鑒于此,有必要提供一種網(wǎng)頁顯示方法及裝置,可以在保證網(wǎng)頁滾動流暢性的同時,保證呈現(xiàn)的視覺效果。
[0006]一種網(wǎng)頁顯示方法,包括以下步驟:當偵測到瀏覽器所顯示的網(wǎng)頁發(fā)生滾動事件時,確定該網(wǎng)頁的頁面可見區(qū)域;從緩存區(qū)中獲取屬于該頁面可見區(qū)域的實際位圖,并將所獲取的實際位圖繪制上屏;若所獲取的實際位圖未覆蓋所述頁面可見區(qū)域,則獲取該頁面可見區(qū)域中未被該實際位圖覆蓋的第一目標區(qū)域;生成該第一目標區(qū)域的縮略位圖,該縮略位圖相較于該第一目標區(qū)域的實際位圖具有較小的縮放系數(shù),當該縮略位圖生成完畢時,將所生成的縮略位圖繪制上屏;生成該第一目標區(qū)域的實際位圖,當該實際位圖生成完畢時,將所生成的實際位圖繪制上屏。
[0007]—種網(wǎng)頁顯示裝置,包括:確定模塊,用于當偵測到瀏覽器所顯示的網(wǎng)頁發(fā)生滾動事件時,確定該網(wǎng)頁的頁面可見區(qū)域;第一位圖獲取模塊,用于從緩存區(qū)中獲取屬于該頁面可見區(qū)域的實際位圖,并將所獲取的實際位圖繪制上屏;第一區(qū)域獲取模塊,用于若所獲取的實際位圖未覆蓋所述頁面可見區(qū)域,則獲取該頁面可見區(qū)域中未被該實際位圖覆蓋的第一目標區(qū)域;第一生成模塊,用于生成該第一目標區(qū)域的縮略位圖,該縮略位圖相較于該第一目標區(qū)域的實際位圖具有較小的縮放系數(shù),當該縮略位圖生成完畢時,將所生成的縮略位圖繪制上屏;第二生成模塊,用于生成該第一目標區(qū)域的實際位圖,當該實際位圖生成完畢時,將所生成的實際位圖繪制上屏。
[0008]相較于現(xiàn)有技術,本發(fā)明網(wǎng)頁顯示方法及裝置,在偵測到瀏覽器所顯示的網(wǎng)頁發(fā)生滾動事件時,確定該網(wǎng)頁的頁面可見區(qū)域,然后先從緩存區(qū)中獲取屬于該頁面可見區(qū)域的實際位圖繪制上屏,若所獲取的實際位圖未覆蓋所述頁面可見區(qū)域,則生成該頁面可見區(qū)域中未被該實際位圖覆蓋的第一目標區(qū)域的縮略位圖并將所生成的縮略位圖繪制上屏,該縮略位圖相較于該第一目標區(qū)域的實際位圖具有較小的縮放系數(shù),然后再生成該第一目標區(qū)域的實際位圖并將所生成的實際位圖繪制上屏,從而在保證網(wǎng)頁滾動流暢性的同時,通過該縮略位圖保證呈現(xiàn)的視覺效果。
[0009]為讓本發(fā)明的上述和其他目的、特征和優(yōu)點能更明顯易懂,下文特舉較佳實施例,并配合所附圖式,作詳細說明如下。
【附圖說明】
[0010]圖1為一種終端的結構框圖。
[0011]圖2為本發(fā)明第一實施例提供的網(wǎng)頁顯示方法的流程圖。
[0012]圖3為本發(fā)明第一實施例至第六實施例提供的網(wǎng)頁顯示方法的詳細流程圖。
[0013]圖4為第一目標區(qū)域的縮略位圖的示例圖。
[0014]圖5為放大后的第一目標區(qū)域的縮略位圖的示例圖。
[0015]圖6為第一目標區(qū)域的實際位圖的示例圖。
[0016]圖7為本發(fā)明第七實施例提供的網(wǎng)頁顯示裝置的框圖。
【具體實施方式】
[0017]為更進一步闡述本發(fā)明為實現(xiàn)預定發(fā)明目的所采取的技術手段及功效,以下結合附圖及較佳實施例,對依據(jù)本發(fā)明的【具體實施方式】、結構、特征及其功效,詳細說明如后。
[0018]圖1示出了一種終端的結構框圖。如圖1所示,終端I包括一個或多個(圖中僅示出一個)存儲器11、處理器12、存儲控制器13、外設接口 14、通信模塊15、輸入單元16及顯示單元17。這些組件通過一條或多條通訊總線/信號線相互通訊。
[0019]本領域普通技術人員可以理解,圖1所示的結構僅為示意,其并不對終端I的結構造成限定。例如,終端I還可包括比圖1所示更多或者更少的組件,或者具有與圖1所示不同的配置。圖1所示的各組件可以采用硬件、軟件或其組合實現(xiàn)。
[0020]存儲器11可用于存儲軟件程序以及模塊,如本發(fā)明實施例中的網(wǎng)頁顯示方法及裝置對應的程序指令/模塊,處理器12通過運行存儲在存儲器11內的軟件程序以及模塊,從而執(zhí)行各種功能應用以及數(shù)據(jù)處理,即實現(xiàn)上述的網(wǎng)頁顯示方法。
[0021]存儲器11可包括高速隨機存儲器,還可包括非易失性存儲器,如一個或者多個磁性存儲裝置、閃存、或者其他非易失性固態(tài)存儲器。在一些實例中,存儲器11可進一步包括相對于處理器12遠程設置的存儲器,這些遠程設置的存儲器可以通過網(wǎng)絡連接至終端I。上述網(wǎng)絡的實例包括但不限于互聯(lián)網(wǎng)、企業(yè)內部網(wǎng)、局域網(wǎng)、移動通信網(wǎng)及其組合。處理器12以及其他可能的組件對存儲器11的訪問可在存儲控制器13的控制下進行。
[0022]外設接口 14將各種輸入/輸出裝置耦合至處理器12以及存儲器11。處理器12運行存儲器11內的各種軟件、指令以及執(zhí)行終端I的各種功能以及進行數(shù)據(jù)處理。
[0023]通信模塊15用于與通信網(wǎng)絡或者其他設備進行通信。具體地,通信模塊15例如可以是網(wǎng)卡151或RF (Rad1 Frequency,射頻)模塊152。網(wǎng)卡151作為局域網(wǎng)中連接計算機和傳輸介質的接口,用于實現(xiàn)與局域網(wǎng)傳輸介質之間的物理連接與電信號匹配,從而建立局域網(wǎng)并連接到因特網(wǎng)(Internet),與各種網(wǎng)絡如局域網(wǎng)、城域網(wǎng)、廣域網(wǎng)進行通信。網(wǎng)卡151可包括各種現(xiàn)有的用于執(zhí)行上述功能的電路元件,例如處理器和存儲器(包括ROM和RAM)等。RF模塊152用于接收以及發(fā)送電磁波,實現(xiàn)電磁波與電信號的相互轉換,從而與通信網(wǎng)絡或者其他設備進行通信。RF模塊152可包括各種現(xiàn)有的用于執(zhí)行這些功能的電路元件,例如,天線、射頻收發(fā)器、數(shù)字信號處理器、加密/解密芯片、用戶身份模塊(SM)卡、存儲器等等。RF模塊152可與各種網(wǎng)絡如互聯(lián)網(wǎng)、企業(yè)內部網(wǎng)、無線網(wǎng)絡進行通信或者通過無線網(wǎng)絡與其他設備進行通信。上述的無線網(wǎng)絡可包括蜂窩式電話網(wǎng)、無線局域網(wǎng)或者城域網(wǎng)。上述的無線網(wǎng)絡可以使用各種通信標準、協(xié)議及技術,包括但并不限于全球移動通信系統(tǒng)(Global System for Mobile Communicat1n, GSM)、增強型移動通信技術(Enhanced Data GSM Environment, EDGE),寬帶碼分多址技術(wideband codedivis1n multiple access, W-CDMA),碼分多址技術(Code divis1n access, CDMA)、時分多址技術(time divis1n multiple access, TDMA),無線保真技術(Wireless, Fidelity,WiFi)(如美國電氣和電子工程師協(xié)會標準IEEE802.11a, IEEE802.lib, IEEE802.1lg和/或 IEEE802.1ln)、網(wǎng)絡電話(Voice over internet protocal, VoIP)、全球微波互聯(lián)接入(Worldwide Interoperability for Microwave Access,Wi_Max)、其他用于郵件、B卩時通信及短消息的協(xié)議,以及任何其他合適的通信協(xié)議,甚至可包括那些當前仍未被開發(fā)出來的協(xié)議。
[0024]輸入單元16可用于接收輸入的字符信息,以及產(chǎn)生與用戶設置以及功能控制有關的鍵盤、鼠標、操作桿、光學或者軌跡球信號輸入。具體地,輸入單元16可包括按鍵161以及觸控表面162。按鍵161例如可包括用于輸入字符的字符按鍵,以及用于觸發(fā)控制功能的控制按鍵??刂瓢存I的實例包括“返回主屏”按鍵、開機/關機按鍵、拍照鍵等等。觸控表面162可收集用戶在其上或附近的觸摸操作(比如用戶使用手指、觸筆等任何適合的物體或附件在觸控表面162上或在觸控表面162附近的操作),并根據(jù)預先設定的程序驅動相應的連接裝置??蛇x的,觸控表面162可包括觸摸檢測裝置和觸摸控制器兩個部分。其中,觸摸檢測裝置檢測用戶的觸摸方位,并檢測觸摸操作帶來的信號,將信號傳送給觸摸控制器;觸摸控制器從觸摸檢測裝置上接收觸摸信息,并將它轉換成觸點坐標,再送給處理器12,并能接收處理器12發(fā)來的命令并加以執(zhí)行。此外,可以采用電阻式、電容式、紅外線以及表面聲波等多種類型實現(xiàn)觸控表面162。除了觸控表面162,輸入單元16還可以包括其他輸入設備。上述的其他輸入設備包括但不限于物理鍵盤、軌跡球、鼠標、操作桿等中的一種或多種。
[0025]顯示單元17用于顯示由用戶輸入的信息、提供給用戶的信息以及終端I的各種圖形接口。這些圖形用戶接口可以由圖形、文本、圖標、視頻和其任意組合來構成。在一個實例中,顯示單元17包括一個顯示面板171。該顯示面板171例如可為一個液晶顯示面板(Liquid Crystal Display, LCD)、有機發(fā)光二極管