專利名稱：嵌入式瀏覽器中實現(xiàn)跑馬燈效果的方法
技術(shù)領(lǐng)域：
本發(fā)明涉及內(nèi)容顯示領(lǐng)域。
背景技術(shù)：
跑馬燈效果，也稱滾動字幕效果。實際上可滾動的內(nèi)容除了字幕外，包括圖片、表 格等很多種。實現(xiàn)跑馬燈效果有幾種方法，而HTML(超文本標(biāo)記語言)中的marquee(會 移動的文字)標(biāo)簽，是其中最便捷的方式。目前，marquee標(biāo)簽被廣泛應(yīng)用于IPTV(網(wǎng)絡(luò)電 視)領(lǐng)域的EPG(電子節(jié)目指南)制作當(dāng)中，是主流的制作技術(shù)之一。該marquee標(biāo)簽包含眾多屬性，主要有滾動方向(direction)包括向左/向右/向上/向下(left/right/up/down)；滾動速度(scrollamount)實際上是設(shè)定滾動字幕滾動一次的距離；iM^TlA (bihavior) ^ scroll/slide/alternate, scroll^ 滾動至另一端；slide表示只滾動一次，由一端滾動至另一端；alternate表示在兩端反復(fù) 來回滾動；循環(huán)(loop)包括infinite/num。infinite = _1，都表示無限次滾動；num等于 幾，就表示循環(huán)幾次；延時(scrolldelay)設(shè)定兩次滾動之間的延遲時間；背景色(bgcolor)設(shè)定滾動內(nèi)容的背景顏色；高度(height)設(shè)定滾動內(nèi)容的高度；寬度(width)設(shè)定滾動內(nèi)容的寬度；空白(hspace/vspace)設(shè)定滾動內(nèi)容左右邊框和上下邊框的寬度。marquee標(biāo)簽嵌入在HTML語言中使用，用法如下<html><body>〈marquee width =” 300” height =” 100” direction =”left”>歡迎大家來到四川</marquee></body></html>通過以上代碼將會形成一個寬度為300，高度為100的矩形區(qū)域(marquee窗口 )， “歡迎大家來到四川”幾個字將會在這個marquee窗口從右至左的不斷循環(huán)滾動。在該marquee窗口中實現(xiàn)內(nèi)容滾動現(xiàn)有兩種方式，一種是將滾動內(nèi)容的顯示位置 信息在固定的矩形區(qū)域中遞增或遞減來實現(xiàn)滾動效果，但此方法僅適用于單純的文字，無 法實現(xiàn)一段HTML代碼段的滾動效果，因為HTML代碼段不是直接可供顯示的內(nèi)容，需要先經(jīng) 過瀏覽器結(jié)合其上下文進行HTML/CSS等解析，才能形成滾動的顯示內(nèi)容；另一種是將滾動內(nèi)容的最終顯示數(shù)據(jù)形成位圖，動態(tài)更改位圖的顯示位置來形成滾動效果，此方法下，一旦滾動內(nèi)容長度較長，則會造成CPU占用過大，程序響應(yīng)速度緩慢的問題。
發(fā)明內(nèi)容
本發(fā)明所要解決的技術(shù)問題是，提供一種在嵌入式瀏覽器中，CPU占用資源小且能夠承載多種滾動內(nèi)容形式的跑馬燈效果的實現(xiàn)方法。本發(fā)明為所要解決的技術(shù)問題所采用的技術(shù)方案是，嵌入式瀏覽器中實現(xiàn)跑馬燈 效果的方法，包括以下步驟a、在主頁面中設(shè)置由圖形引擎通過窗口控件生成的子窗口，子窗口的尺寸和 marquee窗口的尺寸相同；b、將待滾動內(nèi)容作為子窗口的內(nèi)置頁面的一部分，該內(nèi)置頁面對應(yīng)一個marquee 標(biāo)簽，設(shè)置內(nèi)置頁面中該marquee標(biāo)簽的滾動方向、滾動形式、滾動速度；C、沿滾動方向在待滾動內(nèi)容的兩端分別添加一個與子窗口高度相同、寬度相同的 空白區(qū)域；所述空白區(qū)域由滾動目標(biāo)端空白區(qū)域、滾動起始端空白區(qū)域組成；待滾動內(nèi)容 與滾動目標(biāo)端空白區(qū)域、滾動起始端空白區(qū)域共同構(gòu)成子窗口的內(nèi)置頁面；d、將滾動起始端空白區(qū)域作為子窗口的起始顯示部分；e、設(shè)置定時器，定時向子窗口發(fā)送滾動消息，使得子窗口的內(nèi)置頁面的內(nèi)容向設(shè) 定的滾動方向滾動； f、對進入子窗口的內(nèi)置頁面部分進行解析、顯示。采用由圖形引擎通過窗口控件生成的子窗口作為marquee窗口，將待滾動的內(nèi)容 作為子窗口的內(nèi)置頁面，除能正常顯示文字、圖片等內(nèi)容外，還可對HTML代碼段進行CSS解 析，從而實現(xiàn)對HTML代碼段的顯示。無需待滾動內(nèi)容的長度多大，子窗口僅對其可視區(qū)域 的內(nèi)置頁面部分(進入該子窗口的內(nèi)置頁面部分)進行解析、顯示，避免出現(xiàn)因待滾動內(nèi)容 長度過大而造成占用CPU資源過大，程序響應(yīng)緩慢的問題。具體的，當(dāng)滾動方向設(shè)為向左，則在待滾動內(nèi)容的左右兩端分別添加一個與子窗 口高度相同、寬度相同的空白區(qū)域，待滾動內(nèi)容的右端空白區(qū)域作為滾動目標(biāo)端空白區(qū)域、 待滾動內(nèi)容的左端空白區(qū)域作為滾動起始端空白區(qū)域；當(dāng)滾動方向設(shè)為向右，則在待滾動內(nèi)容的左右兩端分別添加一個與子窗口高度相 同、寬度相同的空白區(qū)域，待滾動內(nèi)容的左端空白區(qū)域作為滾動目標(biāo)端空白區(qū)域、待滾動內(nèi) 容的右端空白區(qū)域作為滾動起始端空白區(qū)域；當(dāng)滾動方向設(shè)為向上，則在待滾動內(nèi)容的上下兩端分別添加一個與子窗口高度相 同、寬度相同的空白區(qū)域，待滾動內(nèi)容的下端空白區(qū)域作為滾動目標(biāo)端空白區(qū)域、待滾動內(nèi) 容的上端空白區(qū)域作為滾動起始端空白區(qū)域；當(dāng)滾動方向設(shè)為向下，則在待滾動內(nèi)容的上下兩端分別添加一個與子窗口高度相 同、寬度相同的空白區(qū)域，待滾動內(nèi)容的上端空白區(qū)域作為滾動目標(biāo)端空白區(qū)域、待滾動內(nèi) 容的下端空白區(qū)域作為滾動起始端空白區(qū)域。具體的，步驟b中對marquee標(biāo)簽的設(shè)置還包括文本顏色、背景顏色、循環(huán)、延時、
高度、寬度、空白。進一步的，當(dāng)顯示2組以上的待滾動內(nèi)容，每組待滾動內(nèi)容對應(yīng)創(chuàng)建一個子窗口，為每一個子窗口分配一個marquee標(biāo)簽。等待所有子窗口中需顯示帶滾動內(nèi)容的都準(zhǔn)備好 了以后，統(tǒng)一刷新。本發(fā)明的有益效果是，不受待滾動內(nèi)容類別的限制，支持常見的內(nèi)容滾動效果，不 過多占用CPU資源，保證嵌入式瀏覽器的工作性能。
圖1為滾動方向為向左時， 且置頁面僅有1個marquee標(biāo)簽時，滾動開始時的初始 狀態(tài)示意圖，圖中粗線框表示為子窗口 ；圖2為滾動方向為向左時，且置頁面僅有1個marquee標(biāo)簽時，滾動進行時的狀態(tài) 示意圖，圖中粗線框表示為子窗口 ；圖3為滾動方向為向左時，且置頁面僅有1個marquee標(biāo)簽時，一次滾動完成時的 狀態(tài)示意圖，圖中粗線框表示為子窗口 ；圖4滾動方向為向上時，內(nèi)置頁面僅有1個marquee標(biāo)簽時的示意圖。
具體實施例方式將marquee窗口作為主頁面的子窗口參與排版，在圖形引擎中建立窗口控件，將 待動內(nèi)容形成一個內(nèi)置頁面，呈現(xiàn)在該子窗口控件中，注冊回調(diào)函數(shù)，并通過定時器，定時 向marquee窗口發(fā)送滾動消息，實現(xiàn)自動滾屏。生成內(nèi)置頁面的方式，使得滾動內(nèi)容不受限制，可以是文字、表格、圖片，也可以是 任何一段代碼所呈現(xiàn)出來的效果。內(nèi)容自動滾動的實現(xiàn)將待滾動內(nèi)容形成一個內(nèi)置頁面呈現(xiàn)在marquee窗口中。記錄marquee窗口建立 時分配的句柄，設(shè)定定時器，定時向該窗口句柄發(fā)送滾動消息。為應(yīng)對同一頁面內(nèi)存在多個marquee的情況，marquee窗口的句柄保存在該窗口 構(gòu)件相對應(yīng)的數(shù)據(jù)結(jié)構(gòu)中。子窗口的生成和管理據(jù)滾動方向不同，內(nèi)置頁面的生成也不同，主要表現(xiàn)在待滾動內(nèi)容兩端的空白區(qū) 域上。以滾動方向為水平向左為例，則以marquee窗口的高度為高度，以marquee窗口的寬 度為寬度，形成左右端兩個空白區(qū)域，拼接在待滾動內(nèi)容左右。子窗口滾動前呈現(xiàn)的初始狀 態(tài)，即為左端空白區(qū)域，如圖1所示；當(dāng)子窗口收到滾動消息，內(nèi)置頁面開始滾動時，待滾動 內(nèi)容從子窗口右側(cè)進入，向左滾動，即形成預(yù)期的滾動效果，如圖2所示；當(dāng)滾動到末尾的 時候，呈現(xiàn)給用戶的依然是空白區(qū)域，具體是右端空白區(qū)域，如圖3所示，此次滾動結(jié)束。如 有循環(huán)，再將內(nèi)置頁面重新定位到最初的左端空白區(qū)域位置，重新開始一輪滾動，以實現(xiàn)循 環(huán)滾動的效果。當(dāng)marquee標(biāo)簽的滾動方向為水平方向時，若滾動內(nèi)容為文字，則要求該段文字 在內(nèi)置頁面中排列為一行，而不受到頁面寬度的限制。當(dāng)滾動方向為豎直方向時，若滾動內(nèi) 容為文字，則要求該段文字在內(nèi)置頁面中排列為一列，而不受到頁面長度的限制。如圖4所 示，當(dāng)滾動方向為向上時，則以marquee窗口的高度為高度，以marquee窗口的寬度為寬度， 形成上下端兩個空白區(qū)域，拼接在待滾動內(nèi)容左右。子窗口滾動前呈現(xiàn)的初始狀態(tài)，即為上端空白區(qū)域，滾動實現(xiàn)類似水平向左的實現(xiàn)方式。對于多個marquee標(biāo)簽的情況，每一個內(nèi)置頁面文件的命名采用隨機生成的方 式。各marquee窗口之間互不干擾，各自擁有各自的屬性。marquee標(biāo)簽中img(圖形)標(biāo)簽的實現(xiàn)如在marquee標(biāo)簽中定義了 <img>則涉及到圖片src的處理。若圖片的src采用相對路徑表示，瀏覽器就需要在形成內(nèi)置頁面之前就此路徑轉(zhuǎn)換為固定路徑以保證圖片能 夠正確獲得。在Html_tag_close_marquee中添加了相應(yīng)的處理代碼。如果圖片路徑不是 以，，http，，開頭則表示其為相對路徑。如果是以” / ”開頭，則表示此路徑是基于EPG服務(wù)器 的根路徑定義的；否則表示此路徑是基于當(dāng)前頁面所在的服務(wù)器路徑定義的。內(nèi)置頁面的管理主頁面中可能會同時存在多個marquee標(biāo)簽。每個marquee標(biāo)簽對應(yīng)一個內(nèi)置頁 面。調(diào)用ch_marquee_rand_name函數(shù)生成隨機名稱的內(nèi)置頁面，并和各個marquee標(biāo)簽形 成一一對應(yīng)關(guān)系。這些內(nèi)置頁面都會生成在固定路徑(比如/tmp)。在主頁面退出的時候， 需要清理本頁面內(nèi)所有marquee標(biāo)簽相關(guān)的資源，也包括相應(yīng)的內(nèi)置頁面。多個marquee同時顯示的優(yōu)化多個marquee窗口同時顯示，其滾動的時間點不統(tǒng)一，則瀏覽器刷新的時間點也 不同。當(dāng)兩個marquee窗口刷新的時間差很小時，會形成閃爍。此時，使用如下方法進行處 理等待頁面中所有的marquee標(biāo)簽都準(zhǔn)備好后才開始繪圖顯示。應(yīng)該等待多個marquee 窗口的顯示數(shù)據(jù)都準(zhǔn)備好了以后，統(tǒng)一刷新一次。在一個頁面退出的時候，構(gòu)件會逐個消除 釋放，當(dāng)前頁面相關(guān)的marquee窗口的內(nèi)置頁面文件，也將會被釋放，以達(dá)到對內(nèi)置頁面的 有效管理。marquee寬度/高度的計算算法marquee標(biāo)簽在使用時，可以明確定義其寬度和高度，也可不做定義。在不做定義 的情況下，需要瀏覽器來計算其寬度和高度。在瀏覽器解析模塊中，marquee窗口建立之初， 若網(wǎng)頁代碼中沒有定義其寬度、高度，可建立一個寬度和高度都為1的窗口。在程序運行 至排版模塊時，計算并繼承其父元素(此處的父元素，指頁面代碼中，marquee標(biāo)簽外層的 HTML標(biāo)簽元素)的寬度和高度，根據(jù)最新的數(shù)據(jù)調(diào)整其窗口大小。在最終確定了 marquee窗 口大小之后，即可創(chuàng)建其對應(yīng)的內(nèi)置頁面，并設(shè)定定時器，注冊其回調(diào)函數(shù)。而更改marquee 構(gòu)件的窗口大小，則是GUI程序負(fù)責(zé)的事情，有專門的函數(shù)可以完成此功能。對marquee標(biāo)簽中各屬性的支持滾動速度有兩種方法可以實現(xiàn)速度屬性1)可通過調(diào)整定時器的間隔時間來調(diào) 整速度。間隔時間越小，滾動速度越快。2)可通過調(diào)整滾動的步長參數(shù)來調(diào)整。滾動方式頁面滾動至兩側(cè)終點的時刻都可根據(jù)計算判斷。若滾動方式為 scroll，當(dāng)頁面尾端滾動至一側(cè)終點，即將窗口可視區(qū)域初始化至開始位置，之后繼續(xù)向該 窗口發(fā)送同一方向的滾動消息；若滾動方式為alternate，當(dāng)頁面前端滾動至一側(cè)終點，就 向該窗口發(fā)送相反方向的滾動消息。循環(huán)統(tǒng)計頁面滾動至兩側(cè)終點的次數(shù)，即可限制marquee的滾動次數(shù)，次數(shù)達(dá)到 要求后可注銷回調(diào)函數(shù)，消除定時器。
延時在回調(diào)函數(shù)中，添加sle印函數(shù)。背景色當(dāng)定義了背景色時，可將內(nèi)置頁面的body的背景色定義為相同顏色；當(dāng) 沒定義背景色時，創(chuàng)建窗口的時候，創(chuàng)建一個透明窗口?？瞻讓?nèi)置頁面元素添加padding (元素內(nèi)邊距)屬 性。在排版模塊中，padding 屬性添加在元素寬度中得以實現(xiàn)。
權(quán)利要求
嵌入式瀏覽器中實現(xiàn)跑馬燈效果的方法，其特征在于，包括以下步驟a、在主頁面中設(shè)置由圖形引擎通過窗口控件生成的子窗口，子窗口的尺寸和marquee窗口的尺寸相同；b、將待滾動內(nèi)容作為子窗口的內(nèi)置頁面的一部分，該內(nèi)置頁面對應(yīng)一個marquee標(biāo)簽，設(shè)置內(nèi)置頁面中該marquee標(biāo)簽的滾動方向、滾動形式、滾動速度；c、沿滾動方向在待滾動內(nèi)容的兩端分別添加一個與子窗口高度相同、寬度相同的空白區(qū)域；所述空白區(qū)域由滾動目標(biāo)端空白區(qū)域、滾動起始端空白區(qū)域組成；待滾動內(nèi)容與滾動目標(biāo)端空白區(qū)域、滾動起始端空白區(qū)域共同構(gòu)成子窗口的內(nèi)置頁面；d、將滾動起始端空白區(qū)域作為子窗口的起始顯示部分；e、設(shè)置定時器，定時向子窗口發(fā)送滾動消息，使得子窗口的內(nèi)置頁面的內(nèi)容向設(shè)定的滾動方向滾動；f、對進入子窗口的內(nèi)置頁面部分進行解析、顯示。
2.如權(quán)利要求1所述嵌入式瀏覽器中實現(xiàn)跑馬燈效果的方法，其特征在于，當(dāng)滾動方 向設(shè)為向左，則在待滾動內(nèi)容的左右兩端分別添加一個與子窗口高度相同、寬度相同的空 白區(qū)域，待滾動內(nèi)容的右端空白區(qū)域作為滾動目標(biāo)端空白區(qū)域、待滾動內(nèi)容的左端空白區(qū) 域作為滾動起始端空白區(qū)域；當(dāng)滾動方向設(shè)為向右，則在待滾動內(nèi)容的左右兩端分別添加一個與子窗口高度相同、 寬度相同的空白區(qū)域，待滾動內(nèi)容的左端空白區(qū)域作為滾動目標(biāo)端空白區(qū)域、待滾動內(nèi)容 的右端空白區(qū)域作為滾動起始端空白區(qū)域；當(dāng)滾動方向設(shè)為向上，則在待滾動內(nèi)容的上下兩端分別添加一個與子窗口高度相同、 寬度相同的空白區(qū)域，待滾動內(nèi)容的下端空白區(qū)域作為滾動目標(biāo)端空白區(qū)域、待滾動內(nèi)容 的上端空白區(qū)域作為滾動起始端空白區(qū)域；當(dāng)滾動方向設(shè)為向下，則在待滾動內(nèi)容的上下兩端分別添加一個與子窗口高度相同、 寬度相同的空白區(qū)域，待滾動內(nèi)容的上端空白區(qū)域作為滾動目標(biāo)端空白區(qū)域、待滾動內(nèi)容 的下端空白區(qū)域作為滾動起始端空白區(qū)域。
3.如權(quán)利要求1或2所述嵌入式瀏覽器中實現(xiàn)跑馬燈效果的方法，其特征在于，步驟b 中對marquee標(biāo)簽的設(shè)置還包括文本顏色、背景顏色、循環(huán)、延時、高度、寬度、空白。
4.如權(quán)利要求3所述嵌入式瀏覽器中實現(xiàn)跑馬燈效果的方法，其特征在于，當(dāng)主頁面 退出的時候，清理當(dāng)前主頁面內(nèi)所有marquee標(biāo)簽及其對應(yīng)的內(nèi)置頁面。
全文摘要
本發(fā)明提供一種在嵌入式瀏覽器中，CPU占用資源小且能夠承載多種滾動內(nèi)容形式的跑馬燈效果的實現(xiàn)方法。嵌入式瀏覽器中實現(xiàn)跑馬燈效果的方法，采用由圖形引擎通過窗口控件生成的子窗口作為marquee窗口，將待滾動的內(nèi)容作為子窗口的內(nèi)置頁面，除能正常顯示文字、圖片等內(nèi)容外，還可對HTML代碼段進行CSS解析，從而實現(xiàn)對HTML代碼段的顯示。無需待滾動內(nèi)容的長度多大，子窗口僅對其可視區(qū)域的內(nèi)置頁面部分(進入該子窗口的內(nèi)置頁面部分)進行解析、顯示，避免出現(xiàn)因待滾動內(nèi)容長度過大而造成占用CPU資源過大，程序響應(yīng)緩慢的問題。
文檔編號G06F17/30GK101819594SQ20101015371
公開日2010年9月1日 申請日期2010年4月23日 優(yōu)先權(quán)日2010年4月23日
發(fā)明者邵巍 申請人:四川長虹電器股份有限公司