顯示圖片的方法及裝置的製作方法

2023-05-28 20:37:46 2

專利名稱：顯示圖片的方法及裝置的製作方法
技術領域：
本發明涉及計算機技術領域，特別涉及一種顯示圖片的方法及裝置。
背景技術：
手機終端，尤其是低端的Java手機終端中應用程式可使用的內存非常有限，而圖片是消耗內存的主要因素。因此，在顯示圖片過程中，如何減少圖片在顯示過程中所佔用的內存，就顯得非常重要。現有技術在顯示圖片時，首先通過創建圖片對象獲取圖片標籤排版所需的寬高信息，並在獲取完寬高信息後釋放該圖片對象，並根據獲取到的寬高信息對標籤進行網頁排版，然後獲取圖片對象，在標籤所在的排版位置繪製圖片對象，完成對圖片的顯示。在實現本發明的過程中，發明人發現現有技術至少存在以下缺點:在獲取圖片的寬高信息時，現有技術使用創建圖片對象的方式會佔用大量內存，雖然獲取完寬高信息後釋放了圖片對象，但釋放後的內存並不會立刻被虛擬機回收，導致內存峰值較大，造成內存不足，從而影響顯示圖片的性能。

發明內容
為了在減少圖片佔用內存的同時，提升顯示圖片的性能，本發明實施例提供了一種顯示圖片的方法及裝置。所述技術方案如下:—方面，提供了一種顯示圖片的方法，所述方法包括:解析圖片原始數據的頭信息，從解析得到的頭信息中獲取所述圖片的寬高信息；根據所述圖片的寬高信息對所述圖片的標籤進行網頁排版；獲取所述圖片的圖片對象，並在所述標籤的排版位置繪製所述圖片對象。其中，如果所述圖片為首次繪製，則所述獲取所述圖片的圖片對象之前，還包括:根據所述圖片原始數據創建所述圖片的圖片對象。具體地，所述根據所述圖片原始數據創建所述圖片的圖片對象之後，還包括:存儲創建的所述圖片對象。進一步地，所述在所述標籤的排版位置繪製所述圖片對象之前，還包括:判斷所述標籤的排版位置是否在顯示區域；如果是，則執行在所述標籤的排版位置繪製所述圖片對象的步驟。優選地，在所述標籤的排版位置繪製所述圖片對象之後，還包括:判斷所述標籤的排版位置是否在顯示區域；如果否，則刪除存儲的所述圖片的圖片對象。另一方面，還提供了一種顯示圖片的裝置，所述裝置包括:第一獲取模塊，用於解析圖片原始數據的頭信息，從解析得到的頭信息中獲取所述圖片的寬高信息；排版模塊，用於根據所述圖片的寬高信息對所述圖片的標籤進行網頁排版；
第二獲取模塊，用於獲取所述圖片的圖片對象；繪製模塊，用於在所述標籤的排版位置繪製所述圖片對象。所述裝置還包括:創建模塊，具體用於如果所述圖片為首次繪製，則根據所述圖片原始數據創建所述圖片的圖片對象。所述裝置還包括:存儲模塊，用於存儲所述創建模塊創建的圖片對象。所述裝置還包括:第一判斷模塊，用於在所述繪製模塊繪製所述圖片對象之前，判斷所述標籤的排版位置是否在顯示區域；所述繪製模塊，用於在所述第一判斷模塊判斷所述標籤的排版位置在顯示區域之後，在所述標籤的排版位置繪製所述圖片對象。所述裝置還包括:第二判斷模塊，用於在所述繪製模塊繪製所述圖片對象之後，判斷所述標籤的排版位置是否在顯示區域；清除模塊，用於在所述第二判斷模塊判斷所述標籤的排版位置不在顯示區域之後，刪除存儲的所述圖片的圖片對象。本發明實施例提供的技術方案的有益效果是:通過解析圖片原始數據的頭信息來獲取圖片寬高信息，避免了通過創建圖片對象來獲取圖片寬高信息時佔用過多內存的問題，進而提升顯示圖片的性能；另外，在標籤排版位置不在顯示區域時，通過刪除已經創建的圖片對象，從而減少圖片對象佔用的內存，進一步提升顯示圖片的性能。


為了更清楚地說明本發明實施例中的技術方案，下面將對實施例描述中所需要使用的附圖作簡單地介紹，顯而易見地，下面描述中的附圖僅僅是本發明的一些實施例，對於本領域普通技術人員來講，在不付出創造性勞動的前提下，還可以根據這些附圖獲得其他的附圖。圖1是本發明實施例一提供的一種顯示圖片的方法流程圖；圖2是本發明實施例二提供的一種顯示圖片的方法流程圖；圖3是本發明實施例三提供的一種顯示圖片的裝置結構示意圖；圖4是本發明實施例三提供的另一種顯示圖片的裝置結構示意圖；圖5是本發明實施例三提供的又一種顯示圖片的裝置結構示意圖；圖6是本發明實施例三提供的再一種顯示圖片的裝置結構示意圖；圖7是本發明實施例三提供的再一種顯示圖片的裝置結構示意圖。
具體實施例方式為使本發明的目的、技術方案和優點更加清楚，下面將結合附圖對本發明實施方式作進一步地詳細描述。
實施例一參見圖1，本實施例提供了一種顯示圖片的方法，該方法流程具體如下:101:解析圖片原始數據的頭信息，從解析得到的頭信息中獲取圖片的寬高信息。102:根據圖片的寬高信息對圖片的標籤進行網頁排版。103:獲取圖片的圖片對象，並在標籤的排版位置繪製圖片對象。其中，如果圖片為首次繪製，則獲取圖片的圖片對象之前，還包括:根據圖片原始數據創建圖片的圖片對象。具體地，根據圖片原始數據創建圖片的圖片對象之後，還包括:存儲創建的圖片對象。進一步地，在標籤的排版位置繪製圖片對象之前，還包括:判斷標籤的排版位置是否在顯示區域；如果是，則執行在標籤的排版位置繪製圖片對象的步驟。優選地，在標籤的排版位置繪製圖片對象之後，還包括:判斷標籤的排版位置是否在顯示區域； 如果否，則刪除存儲的圖片的圖片對象。本實施例提供的方法，通過解析圖片原始數據的頭信息來獲取圖片寬高信息，避免了通過創建圖片對象來獲取圖片寬高信息時佔用過多內存的問題，進而提升顯示圖片的性能；另外，在標籤排版位置不在顯示區域時，通過刪除已經創建的圖片對象，從而減少圖片對象佔用的內存，進一步提升顯示圖片的性能。為了更加詳細的闡述本實施例提供的方法，下面，結合上述內容，通過下面的實施例二的內容對本實施例提供的方法進行具體描述，詳見如下實施例:實施例二參見圖2，本實施例提供了一種顯示圖片的方法，為了便於說明，以顯示圖片的裝置為瀏覽器為例，對本實施例提供的方法進行舉例說明。該方法流程具體如下:201:判斷網頁中是否設置了圖片的寬高信息，如果是，執行203 ;否則執行202。瀏覽器輸入網址時，先獲取網頁的框架，對網頁中的元素(圖片和文字等)進行排版，然後再對具體的元素進行繪製。其中，圖片的數據量比較大，為了能快速完成網頁排版，我們通常用圖片的標籤替代圖片進行排版。而在對標籤進行排版時，需要為圖片預留足夠的空間來繪製圖片。因此，瀏覽器在網頁排版的過程中，需要判斷網頁中是否設置了圖片的寬高信息，如果是，執行步驟203 ;如果否，則執行步驟202。具體地，瀏覽器判斷網頁中是否設置了圖片的寬高的方法有很多種，例如，可以在網頁中添加標誌位，標誌位用於標識網頁中是否設置了圖片的寬高信息，例如，將標誌位設置為空，用於標識網頁中沒有設置寬高信息，將標誌位設置為非空，用於標識網頁中設置了寬高信息，或者將標誌位的值設置為0，用於標識網頁中沒有設置寬高信息，將標誌位的值設置為1，用於標識網頁中設置了寬高信息，或是採用其他方式來通過標誌位標識網頁中是否設置了圖片的寬高信息，本實施例不對標誌位標識網頁中是否設置了圖片的寬高信息的方式進行限定。202:解析圖片原始數據的頭信息，獲取寬高信息，並根據寬高信息對圖片的標籤進行網頁排版，執行步驟204。
步驟201判斷出網頁中沒有設置圖片的寬高信息，瀏覽器需要向伺服器發起圖片原始數據請求，並接收伺服器返回的圖片原始數據。其中，圖片原始數據包括頭信息和數據信息。頭信息用來存放圖片寬高等基本信息，數據信息則用來存放該圖片的位圖數據壓縮之後的信息。本步驟中瀏覽器僅需獲取圖片的寬高信息以完成網頁排版，因此，瀏覽器僅需解析圖片原始數據的頭信息，獲取寬高信息。瀏覽器獲取到該圖片的寬高信息後，即可將圖片的標籤按照圖片的寬高實際大小完成對網頁的排版。203:獲取寬高信息，根據寬高信息對標籤進行網頁排版。由於步驟201判斷出網頁中設置了圖片的寬高信息，瀏覽器直接從網頁中獲取該圖片的寬高信息即可。瀏覽器獲取到該圖片的寬高信息後，即可將圖片的標籤按照圖片的寬高實際大小完成對網頁的排版，具體排版方式可通過現有的排版方式實現，此處不再贅述。204:判斷標籤的排版位置是否在顯示區域內，如果是，執行205 ;否則執行208。具體地，判斷標籤的排版位置是否在顯示區域內的方法有很多種，例如，瀏覽器在對網頁排版的過程中，還生成一個位置文件，用來存放各個標籤的中心點的二維位置坐標。瀏覽器通過比較標籤的位置坐標與顯示區域的坐標判斷標籤是否在顯示區域內。以顯示區域的左上角、右上角、左下角和右下角的坐標分別為(Xci, Yci)、(Xci, Yn)、(X1^Yci)和(Xn，Yn)，圖片的中心點坐標為(X，Y)為例，若比較結果為X0 < X土width/2 <父 或Y0 < Y±height/2父11或者￥±1^^8吐/2 Yn時，則判斷標籤在顯示區域外，即執行步驟208。其中，width和height分別為標籤的寬度和高度。本實施例不對瀏覽器判斷標籤的排版位置是否在顯示區域的方式進行限定。205:判斷圖片是否創建了圖片對象，如果是，執行207 ;否則執行206。為了避免在切換頁面焦點和頁面滾動顯示過程中多次創建圖片對象，瀏覽器對在顯示區域內的圖片創建圖片對象，並存儲在緩存中，保證了重複調用圖片時頁面的繪製效率。其中，圖片對象存儲了圖片解壓後的原始位圖數據以及圖片的一些基本信息。瀏覽器在判斷出標籤的排版位置在顯示區域內之後，還要對圖片是否創建了圖片對象進行判斷，如果圖片已經創建了圖片對象，並存儲在緩存中，則瀏覽器直接繪製緩存中的圖片對象即可，即執行步驟207 ;如果圖片是首次繪製，沒有創建圖片對象，則瀏覽器執行步驟206。具體地，瀏覽器判斷圖片是否創建了圖片對象，可以通過判斷緩存中是否有圖片對象的方式來實現。而瀏覽器判斷緩存中是否有圖片對象的方法有很多種，例如，圖片對象的頭信息還包括圖片的標識信息。瀏覽器在判斷圖片是否有圖片對象時，將該圖片頭信息中的標識信息與緩存中所有圖片對象的頭信息中的標識信息進行比較，若相等，則該圖片在緩存中存有圖片對象；否則該圖片在緩 存中無圖片對象。本實施例不對瀏覽器判斷緩存中是否有該圖片的圖片對象的方式進行限定。206:創建並存儲圖片的圖片對象，並獲取該創建的圖片對象，在標籤的排版位置繪製該圖片對象，流程結束。瀏覽器判斷出圖片的標籤在顯示區域內，且緩存中沒有該圖片的圖片對象，則瀏覽器根據標籤向伺服器發起圖片數據請求，根據伺服器返回的圖片原始數據創建圖片對象，並存儲該圖片對象，以避免在切換頁面焦點和頁面滾動顯示過程中多次創建圖片對象。最後，瀏覽器獲取該創建的圖片對象，在標籤的排版位置繪製該圖片對象。207:獲取存儲的圖片對象，在標籤的排版位置繪製該圖片對象，流程結束。瀏覽器判斷出圖片的標籤在顯示區域內，且緩存中有該圖片的圖片對象，則瀏覽器直接從緩存中獲取該圖片對象，並在標籤的排版位置繪製該圖片對象，而無需再執行創建圖片對象的步驟，從而提高繪製效率。208:判斷圖片是否創建了圖片對象，如果是，執行209 ;否則流程結束。為了最大程度地減少圖片所佔內存，瀏覽器在判斷出標籤的排版位置在顯示區域外之後，還要判斷該圖片是否創建了圖片對象，如果是執行步驟209 ;如果否，流程結束。具體地，瀏覽器判斷圖片是否創建了圖片對象，可以通過判斷緩存中是否有圖片對象的方式來實現。而瀏覽器判斷緩存中是否有圖片對象的方法有很多種，例如，圖片對象的頭信息還包括圖 片的標識信息。瀏覽器在判斷圖片是否有圖片對象時，將該圖片頭信息中的標識信息與緩存中所有圖片對象的頭信息中的標識信息進行比較，若相等，則該圖片在緩存中存有圖片對象；否則該圖片在緩存中無圖片對象。本實施例不對瀏覽器判斷緩存中是否有該圖片的圖片對象的方式進行限定。209:清除存儲的圖片對象。對於標籤的排版位置在顯示區域外的圖片，瀏覽器釋放該圖片的圖片對象，節省不必要的內存佔用，提高瀏覽器運行速度。本實施例提供的方法，通過解析圖片原始數據的頭信息來獲取圖片寬高信息，避免了通過創建圖片對象來獲取圖片寬高信息時佔用過多內存的問題，進而提升顯示圖片的性能；另外，在標籤排版位置不在顯示區域時，通過刪除已經創建的圖片對象，從而減少圖片對象佔用的內存，進一步提升顯示圖片的性能。實施例三參見圖3，本實施例提供了一種顯示圖片的裝置，該裝置用於執行上述實施例一和實施例二所提供的圖片顯示的方法，該裝置包括:第一獲取模塊301，用於解析圖片原始數據的頭信息，從解析得到的頭信息中獲取圖片的寬聞 目息；排版模塊302，用於根據圖片的寬高信息對圖片的標籤進行網頁排版；第二獲取模塊303，用於獲取圖片的圖片對象；繪製模塊304，用於在標籤的排版位置繪製圖片對象。其中，第一獲取模塊301獲取圖片的寬高信息的具體方式可參見上述實施例二中步驟202的相關描述，此處暫不贅述。針對首次繪製圖片的情況，參見圖4，該裝置還包括:創建模塊305，具體用於如果圖片為首次繪製，則根據圖片原始數據創建圖片的圖片對象。在首次繪製圖片之後，針對已經為該圖片創建了圖片對象的情況，為了避免重繪該圖片時，重複執行創建圖片對象的過程，參見圖5，該裝置還包括:存儲模塊306，用於存儲創建模塊305創建的圖片對象。如上，通過存儲模塊306存儲創建模塊305創建的圖片對象，從而再下次繪製該圖片對象所對應的圖片時，可由第二獲取模塊303直接獲取存儲模塊306存儲的圖片對象，而無需再次進行創建圖片對象的過程，從而可以提高繪製效率。參見圖6，裝置還包括:第一判斷模塊307，用於在繪製模塊304繪製圖片對象之前，判斷標籤的排版位置是否在顯示區域；繪製模塊304，用於在第一判斷模塊307判斷標籤的排版位置在顯示區域之後，在標籤的排版位置繪製圖片對象。參見圖7，裝置還包括:第二判斷模塊308，用於在繪製模塊304繪製圖片對象之後，判斷標籤的排版位置是否在顯示區域；清除模塊309，用於在第二判斷模塊308判斷標籤的排版位置不在顯示區域之後，刪除存儲的圖片的圖片對象。本實施例提供的裝置，通過解析圖片原始數據的頭信息來獲取圖片寬高信息，避免了通過創建圖片對象來獲取圖片寬高信息時佔用過多內存的問題，進而提升顯示圖片的性能；另外，在標籤排版位置不在顯示區域時，通過刪除已經創建的圖片對象，從而減少圖片對象佔用的內存，進一步提升顯示圖片的性能。需要說明的是:上述實施例提供的顯示圖片的裝置在顯示圖片時，僅以上述各功能模塊的劃分進行舉例說明，實際應用中，可以根據需要而將上述功能分配由不同的功能模塊完成，即將裝置的內部結構劃分成不同的功能模塊，以完成以上描述的全部或者部分功能。另外，上述實施例提供的顯示圖片的裝置與顯示圖片的方法實施例屬於同一構思，其具體實現過程詳見方法實施例，這裡不再贅述。上述本發明實施例序號僅僅為了描述，不代表實施例的優劣。本發明實施例中的全部或部分步驟，可以利用軟體實現，相應的軟體程序可以存儲在可讀取的存儲介質中，如光碟或硬碟等。以上所述僅為本發明的較佳實施例，並不用以限制本發明，凡在本發明的精神和原則之內，所作的任何修改、等同替換、改進等，均應包含在本發明的保護範圍之內。
權利要求
1.一種顯示圖片的方法，其特徵在於，所述方法包括: 解析圖片原始數據的頭信息，從解析得到的頭信息中獲取所述圖片的寬高信息； 根據所述圖片的寬高信息對所述圖片的標籤進行網頁排版； 獲取所述圖片的圖片對象，並在所述標籤的排版位置繪製所述圖片對象。
2.根據權利要求1所述的方法，其特徵在於，如果所述圖片為首次繪製，則所述獲取所述圖片的圖片對象之前，還包括: 根據所述圖片原始數據創建所述圖片的圖片對象。
3.根據權利要求2所述的方法，其特徵在於，所述根據所述圖片原始數據創建所述圖片的圖片對象之後，還包括: 存儲創建的所述圖片對象。
4.根據權利要求1至3中任一權利要求所述的方法，其特徵在於，所述在所述標籤的排版位置繪製所述圖片對象之前，還包括: 判斷所述標籤的排版位置是否在顯示區域； 如果是，則執行在所述標籤的排版位置繪製所述圖片對象的步驟。
5.根據權利要求3所述的方法，其特徵在於，所述在所述標籤的排版位置繪製所述圖片對象之後，還包括: 判斷所述標籤的排版位置是否在顯示區域； 如果否，則刪除存儲的所述圖片的圖片對象。
6.一種顯示圖片的裝置，其特徵在於，所述裝置包括: 第一獲取模塊，用於解析圖片原始數據的頭信息，從解析得到的頭信息中獲取所述圖片的寬高信息； 排版模塊，用於根據所述圖片的寬高信息對所述圖片的標籤進行網頁排版； 第二獲取模塊，用於獲取所述圖片的圖片對象； 繪製模塊，用於在所述標籤的排版位置繪製所述圖片對象。
7.根據權利要求6所述的裝置，其特徵在於，所述裝置還包括: 創建模塊，具體用於如果所述圖片為首次繪製，則根據所述圖片原始數據創建所述圖片的圖片對象。
8.根據權利要求7所述的裝置，其特徵在於，所述裝置還包括: 存儲模塊，用於存儲所述創建模塊創建的圖片對象。
9.根據權利要求6至8中任一權利要求所述的裝置，其特徵在於，所述裝置還包括: 第一判斷模塊，用於在所述繪製模塊繪製所述圖片對象之前，判斷所述標籤的排版位置是否在顯示區域； 所述繪製模塊，用於在所述第一判斷模塊判斷所述標籤的排版位置在顯示區域之後，在所述標籤的排版位置繪製所述圖片對象。
10.根據權利要求8所述的裝置，其特徵在於，所述裝置還包括: 第二判斷模塊，用於在所述繪製模塊繪製所述圖片對象之後，判斷所述標籤的排版位置是否在顯示區域； 清除模塊，用於在所述第二判斷模塊判斷所述標籤的排版位置不在顯示區域之後，刪除存儲的所述圖片的圖片對象。
全文摘要
本發明公開了一種顯示圖片的方法及裝置，屬於計算機技術領域。所述方法包括解析圖片原始數據的頭信息，從解析得到的頭信息中獲取所述圖片的寬高信息；根據所述圖片的寬高信息對所述圖片的標籤進行網頁排版；獲取所述圖片的圖片對象，並在所述標籤的排版位置繪製所述圖片對象。所述裝置包括第一獲取模塊、排版模塊、第二獲取模塊和繪製模塊。本發明通過解析圖片原始數據的頭信息來獲取圖片寬高信息，避免了通過創建圖片對象來獲取圖片寬高信息時佔用過多內存的問題，進而提升顯示圖片的性能；另外，在標籤排版位置不在顯示區域時，通過刪除已經創建的圖片對象，從而減少圖片對象佔用的內存，進一步提升顯示圖片的性能。
文檔編號G06T11/60GK103208128SQ20121001282
公開日2013年7月17日 申請日期2012年1月16日 優先權日2012年1月16日
發明者劉彥良, 李雪峰 申請人:騰訊科技(深圳)有限公司