結(jié)構(gòu)化的平板電視OSD界面設(shè)計(jì)
日益華麗的平板電視OSD開(kāi)發(fā)占據(jù)了固件工程師大量的時(shí)間,采用結(jié)構(gòu)化的OSD設(shè)計(jì)可以縮短開(kāi)發(fā)時(shí)間,提高代碼質(zhì)量。本文在介紹OSD的實(shí)現(xiàn)方法、OSD類(lèi)型、OSD的UI基本元素及定義基礎(chǔ)上,詳細(xì)分析了使用結(jié)構(gòu)化的OSD UI處理機(jī)制實(shí)現(xiàn)OSD開(kāi)發(fā)的方法和思路。
圖1:字符型OSD。 |
隨著具有各種豐富功能的平板電視不斷上市,日益華麗的OSD界面設(shè)計(jì)占據(jù)了固件開(kāi)發(fā)工程師大量的開(kāi)發(fā)時(shí)間。不少的固件工程師不斷地重復(fù)著同樣的工作:為每一個(gè)機(jī)種編寫(xiě)著同樣的OSD文字、圖形及人機(jī)交互的界面(UI)互動(dòng)代碼。在UI及OSD較復(fù)雜的系統(tǒng)里,該部分的代碼量高達(dá)30-60%,同時(shí),調(diào)試不健壯的UI代碼也將占用大量的系統(tǒng)調(diào)試時(shí)間。
平板電視的UI主要具有建立在機(jī)器上的按鍵和紅外遙控器等輸入以及OSD、蜂鳴器等輸出,OSD的主要作用是提供一個(gè)直觀的圖形界面,幫助用戶(hù)完成各種對(duì)機(jī)器的控制和信息獲知等任務(wù)。圖1、2呈現(xiàn)了用戶(hù)可能經(jīng)??吹降腛SD外觀。隨著系統(tǒng)處理能力的提高,現(xiàn)在的OSD甚至可以提供內(nèi)建游戲、記事本和萬(wàn)年歷等各種附件功能。本文主要討論的是OSD固件的設(shè)計(jì)及與之相關(guān)的UI控制,并試圖提供一個(gè)關(guān)于平板電視中UI的定義和解決方案,縮短固件工程師在UI OSD界面構(gòu)造上的時(shí)間。本文中的概念及方案同樣適用于其它具有點(diǎn)陣顯示控制任務(wù)的場(chǎng)合。
OSD的主要實(shí)現(xiàn)方法和類(lèi)型
目前有兩種主要的OSD實(shí)現(xiàn)方法:外部OSD發(fā)生器與視頻處理器間的疊加合成;視頻處理器內(nèi)部支持OSD,直接在視頻緩存內(nèi)部疊加OSD信息。
外部OSD發(fā)生器與視頻處理器間的疊加合成的實(shí)現(xiàn)原理是:由一個(gè)MCU內(nèi)建的字符發(fā)生器及顯示緩存,利用快速消隱(Fast-Blank)信號(hào)切換電視的畫(huà)面和OSD顯示內(nèi)容,使OSD的字符等內(nèi)容疊加在最終的顯示畫(huà)面上,在OSD和顯示畫(huà)面疊加處理過(guò)程中,通過(guò)調(diào)整兩者之間的比例可以實(shí)現(xiàn)OSD的半透明(Blending)效果。同時(shí),對(duì)OSD信號(hào)中的紅綠藍(lán)信號(hào)進(jìn)行重新編碼,可以得到不同的OSD顏色效果。
另外一種實(shí)現(xiàn)方法是視頻處理器內(nèi)部支持OSD,直接在視頻緩存內(nèi)部疊加OSD信息。這一類(lèi)視頻處理通常具有外部存儲(chǔ)器或內(nèi)部少量的行緩存,同時(shí)具有OSD發(fā)生器,OSD的合成和控制直接在視頻緩存內(nèi)完成,同樣具有上述的半透明和顏色控制功能。
OSD具有字符型(Font-Based)和位圖型(Bit-Map)兩種類(lèi)型。
字符型OSD(圖1屬于字符型):為了節(jié)約顯示緩存,早期及低成本的解決方案中使用字符型OSD發(fā)生器,其原理是將OSD中顯示內(nèi)容按照特定的格式(1218、1216等)進(jìn)行分割成塊,例如數(shù)字0-9、字母a-z、常用的亮度、對(duì)比度符號(hào)等,并把這些內(nèi)容固化在ROM或Flash中,在顯示緩存中僅存放對(duì)應(yīng)的索引號(hào),這樣的“字典”結(jié)構(gòu)可以大幅度減少顯示緩存的需求。
同時(shí),為了提供對(duì)每個(gè)字符的顏色等屬性的控制,通常還具有一個(gè)與顯示緩存一樣大小的屬性緩存,其屬性(前景顏色、背景顏色、閃爍等)對(duì)整個(gè)字符中的每個(gè)像素有效。為了彌補(bǔ)這種方式不能為每個(gè)像素指定顏色的缺點(diǎn),OSD發(fā)生器的設(shè)計(jì)者提供了采用多個(gè)顯示緩存合并的方式呈現(xiàn)多色字符的方案。其原理是每個(gè)顯示緩存確定一種顏色方案,當(dāng)兩個(gè)甚至更多個(gè)顯示緩存合并以后就可以“拼湊”出超過(guò)兩種顏色的多色字符。
圖2:位圖型OSD。 |
字符型OSD優(yōu)點(diǎn)是可以使用OSD內(nèi)部較少的顯示緩存,并且MCU只需要指定顯示內(nèi)容的索引即可顯示對(duì)應(yīng)OSD信息,可以在比較低速的MCU上實(shí)現(xiàn)。但正是由于上述的顯示信息和顏色編碼方式不夠直觀,會(huì)給字符型OSD的固件開(kāi)發(fā)帶來(lái)一些麻煩。通常液晶顯示器、低成本的平板電視和CRT傳統(tǒng)電視上均使用這一類(lèi)OSD,目前仍占據(jù)著市場(chǎng)主流地位。
相較字符型OSD,位圖OSD(圖2屬于位圖型)的處理原理較直觀和簡(jiǎn)單:通過(guò)對(duì)最終顯示內(nèi)容上特定區(qū)域的每個(gè)像素點(diǎn)進(jìn)行改變,直接將OSD信息疊加到最終的顯示畫(huà)面上,其按像素進(jìn)行控制的方式可以保證具有多色及足夠的表現(xiàn)能力。位圖OSD發(fā)生器通常內(nèi)建在視頻處理器內(nèi)部,并共享使用其主顯示緩存。也有獨(dú)立在視頻處理器之外的專(zhuān)業(yè)OSD位圖發(fā)生器,如美信的MAX4455,通常這一類(lèi)芯片需要外部SDRAM作為顯示緩存。
位圖OSD的顯示效果理論上可以做到非常完美的程度,可以提供類(lèi)似Windows中具有立體感的各種物件,如具有陰影的按鈕、顏色豐富的圖形和文字等,其缺點(diǎn)是必須具有足夠的OSD顯示緩存,以及按像素進(jìn)行處理而對(duì)MCU帶來(lái)的速度要求。通常在大尺寸的高端平板電視和專(zhuān)業(yè)顯示器上會(huì)使用這一類(lèi)OSD。隨著技術(shù)的不斷發(fā)展和存儲(chǔ)器的成本的不斷下降,未來(lái)的OSD應(yīng)該都是位圖型的。
OSD的UI基本元素及定義
顯示OSD的目的是需要向用戶(hù)表達(dá)信息,那么哪些信息需要表達(dá)呢?通常包括提示、警告信息、控制參數(shù)的數(shù)值顯示等。盡管無(wú)論其顯示形狀是什么,其本質(zhì)都是一些字符或像素點(diǎn)的組合,但是對(duì)于這些信息的分類(lèi)和屬性定義有助于固件開(kāi)發(fā)人員的統(tǒng)一編碼和代碼處理。本文嘗試分類(lèi),分析這些元素并在下面給出統(tǒng)一的固件處理方法。
1. OSD基本概念
UI語(yǔ)言:指OSD內(nèi)容中的文字部分使用的語(yǔ)言類(lèi)型。
UI模式:指OSD內(nèi)容適用的環(huán)境,例如不同的信號(hào)源(電視、DVD、PC)帶來(lái)的模式變化,其作用主要區(qū)分不同的環(huán)境下OSD的不同表現(xiàn)。
UI場(chǎng)景:特定語(yǔ)言模式下及較多信息頁(yè)面情況下,當(dāng)前OSD適用的特定頁(yè)面。
UI事件:用戶(hù)利用輸入設(shè)備向UI系統(tǒng)提供的操作命令。
UI動(dòng)作表:指在特定UI場(chǎng)景中,對(duì)于UI輸入的命令進(jìn)行對(duì)應(yīng)處理的索引表。
OSD畫(huà)布:指整個(gè)OSD呈現(xiàn)的區(qū)域,通常為一個(gè)矩形區(qū)域。
OSD位置:通常指在OSD畫(huà)布中,相較左上角原點(diǎn)的相對(duì)位置。
OSD物件:呈現(xiàn)在畫(huà)布上,表達(dá)特定信息,具有特定屬性的像素組合。
2. OSD包含的基本元素
OSD信息中主要包括以下一些基本元素(可能本文的提法未必準(zhǔn)確,希望讀者可以體會(huì)到其意思):區(qū)域、標(biāo)簽、圖標(biāo)、文字、進(jìn)度條、動(dòng)畫(huà)、數(shù)字、可選圖標(biāo)、導(dǎo)航信息等。下面分別給出這些元素的定義、作用、屬性和響應(yīng)事件。
a. 區(qū)域
定義:在OSD畫(huà)布中,以特定的屬性(顏色、閃爍、大小等)標(biāo)示出的矩形或任意形狀的區(qū)域。
作用:對(duì)OSD內(nèi)容進(jìn)行分類(lèi)或標(biāo)示,例如標(biāo)題區(qū)域,內(nèi)容區(qū)域等。
屬性:位置、顏色、閃爍特性等。
響應(yīng)事件:作為固定的信息內(nèi)容,通常對(duì)UI輸入的控制無(wú)響應(yīng)。
b. 標(biāo)簽(Label)
定義:固定不變的文字信息,可以是一行或多行。
作用:對(duì)OSD內(nèi)容進(jìn)行必要的文字說(shuō)明。
圖3:字符型OSD結(jié)構(gòu)。 |
屬性:位置、顏色、閃爍特性、語(yǔ)言類(lèi)別、大小寫(xiě)、對(duì)齊方式等。
響應(yīng)事件:作為固定的信息內(nèi)容,通常對(duì)UI輸入的控制無(wú)響應(yīng)。
c. 圖標(biāo)(Icon)
定義:以特定的字符或像素組合構(gòu)成形狀,以表達(dá)可識(shí)別的信息。
作用:對(duì)OSD內(nèi)容進(jìn)行形象的提示,如播放、禁止等特定符號(hào)。
屬性:位置、顏色、閃爍特性等。
響應(yīng)事件:作為固定的信息內(nèi)容,通常對(duì)UI輸入的控制無(wú)響應(yīng)。
d. 文字(Text)
定義:相較標(biāo)簽,其同樣為文字信息,但是可以隨用戶(hù)的操作而改變。
作用:以隨選擇而改變的文字內(nèi)容,提供關(guān)于用戶(hù)選擇的文字提示。
屬性:位置、顏色、語(yǔ)言類(lèi)別、大小寫(xiě)、對(duì)齊方式等。
響應(yīng)事件:用戶(hù)的選擇,通常為上一個(gè)或下一個(gè)選擇。
e. 進(jìn)度條(Bar)
定義:矩形條狀的物件,隨其數(shù)值的不同而改變相關(guān)特性,未來(lái)也許會(huì)有其它形狀的此類(lèi)物件,如油量表狀等,但它們都具有同樣的屬性。
作用:以形象的圖形界面,給出關(guān)于某項(xiàng)數(shù)值的圖形說(shuō)明。
屬性:位置、顏色、上下限、當(dāng)前值、類(lèi)型、大小、是否顯示數(shù)值等。
響應(yīng)事件:數(shù)值的改變。
f. 動(dòng)畫(huà)(Movie)
定義:隨時(shí)間而改變的圖標(biāo)組合。
作用:以活動(dòng)的圖形使OSD界面更生動(dòng),提高信息的表達(dá)效果。
屬性:位置、顏色、具有的圖標(biāo)數(shù)目、變化速度等。
響應(yīng)事件:作為固定的信息內(nèi)容,通常對(duì)UI輸入的控制無(wú)響應(yīng)。
g. 數(shù)字
定義:隨有關(guān)參數(shù)或用戶(hù)選擇改變而改變的數(shù)字組合,可以為十進(jìn)制或其它進(jìn)制,亦可以是百分比或其它數(shù)值形式。
作用:直觀地給出關(guān)于某項(xiàng)參數(shù)的數(shù)值量化指示,通常與進(jìn)度條聯(lián)合使用,以達(dá)到直觀與形象的雙重效果。
屬性:位置、顏色、上下限、當(dāng)前值、進(jìn)制選擇等。
響應(yīng)事件:對(duì)應(yīng)參數(shù)的數(shù)值的改變。
h. 可選圖標(biāo)(Option)
定義:隨有關(guān)參數(shù)或用戶(hù)選擇改變而改變的圖標(biāo)組合。
作用:用戶(hù)選擇的圖形化表達(dá),例如選擇、未選擇、開(kāi)啟、關(guān)閉等信息的圖形化表達(dá)。
屬性:位置、顏色、閃爍、選擇數(shù)目等。
響應(yīng)事件:對(duì)應(yīng)參數(shù)的選擇改變。
i. 導(dǎo)航信息
定義:呈現(xiàn)在OSD畫(huà)布上,對(duì)當(dāng)前UI場(chǎng)景中的用戶(hù)操作進(jìn)行提示的信息。
作用:指引用戶(hù)操作相關(guān)按鍵,進(jìn)行OSD內(nèi)容操作。通常具有可用按鍵的指示以及必要的文字說(shuō)明,通常作為OSD提示信息的完善和人機(jī)界面友好化的措施。
屬性:位置、顏色、閃爍等。
響應(yīng)事件:UI場(chǎng)景、按鍵的改變。
需要說(shuō)明的是,上述的物件并不能涵蓋現(xiàn)在和將來(lái)所有的OSD中可能出現(xiàn)的內(nèi)容,但卻是OSD的基本的和主要的內(nèi)容,通過(guò)對(duì)它們進(jìn)行分類(lèi)和進(jìn)行統(tǒng)一的處理,可以幫我們完成通常意義上的OSD的80-90%的工作。
使用基于對(duì)象的方法處理OSD UI
傳統(tǒng)的處理手法是將特定場(chǎng)景下的OSD物件逐一用代碼“畫(huà)”出來(lái),在遇到特定的UI事件時(shí),再利用一堆if else判斷出特定場(chǎng)景和操作對(duì)象,并做相應(yīng)的OSD處理。在OSD較簡(jiǎn)單的情況下,其不失為一個(gè)可行的方法。但在遇到OSD場(chǎng)景和模式較多的情況下,這個(gè)if else的結(jié)構(gòu)會(huì)變得很大,而且更為重要的是極易出錯(cuò)以及維護(hù)成本提高。
隨著OSD越來(lái)越復(fù)雜以及代碼工作量的不斷提高,人們意識(shí)到我們需要花費(fèi)太多時(shí)間在這些“表面文章”上,而真正重要的應(yīng)用層和設(shè)備驅(qū)動(dòng)層的開(kāi)發(fā)時(shí)間會(huì)受到影響,進(jìn)而影響新產(chǎn)品的開(kāi)發(fā)進(jìn)度。固件工程師也不愿不斷重復(fù)編寫(xiě)同樣代碼來(lái)滿足不斷改變客戶(hù)的特定OSD需要。
筆者早期也曾遭遇同樣的困擾,面對(duì)部門(mén)里工程師毫無(wú)效率地做著同樣的事情,感覺(jué)到開(kāi)發(fā)一個(gè)統(tǒng)一的OSD UI平臺(tái)的重要性?,F(xiàn)在對(duì)于上述OSD UI進(jìn)行的分析,可以讓我們開(kāi)發(fā)出獨(dú)立于特定數(shù)字視頻處理器平臺(tái)和OSD發(fā)生機(jī)制的硬件環(huán)境的獨(dú)立統(tǒng)一開(kāi)發(fā)工具。
事實(shí)上,平板顯示芯片方案的重要提供者如Genesis、Pixelworks等為了加速其產(chǎn)品的開(kāi)發(fā)和應(yīng)用速度,已經(jīng)提供了具有這樣功能的基于Windows的固件開(kāi)發(fā)工具。本文試圖探討這一類(lèi)工具的運(yùn)作原理,或許讀者基于本文可以開(kāi)發(fā)出自己所需要的工具,當(dāng)然其應(yīng)用具有更廣泛的代表性。
筆者在最近的液晶電視開(kāi)發(fā)案例中使用了這樣一個(gè)結(jié)構(gòu):
typedef struct
{
byte mode;//UI場(chǎng)景適用的模式
byte lan; // UI語(yǔ)言
byte scene; // UI場(chǎng)景
byte last; // UI上個(gè)場(chǎng)景
byte next; // UI下個(gè)場(chǎng)景
byte sel; //UI 當(dāng)前場(chǎng)景對(duì)物件的選擇
byte sel_total; //UI當(dāng)前場(chǎng)景中選擇項(xiàng)的總數(shù)
byte *info; // UI的物件指針
byte pos_v; // 物件垂直方向位置
byte pos_h; // 物件水平方向的位置
byte col_f; // 物件的前景顏色
byte col_b; // 物件的背景顏色
byte att; // 物件的其它顯示屬性
ACT_Struct (*act)[]; // 該物件的響應(yīng)動(dòng)作表指針
byte *note; // 導(dǎo)航說(shuō)明信息
}UI_Struct;
圖4:Pixelworks的GUI Builder OSD |
這樣的結(jié)構(gòu)是為了描述一個(gè)OSD物件的基本屬性及規(guī)定其對(duì)于動(dòng)作的相應(yīng)表現(xiàn)。利用這樣的結(jié)構(gòu)將場(chǎng)景中的每個(gè)物件描述清楚,則一個(gè)特定UI場(chǎng)景的OSD內(nèi)容就可以被確定,而同時(shí)被確定的還有其上一個(gè)場(chǎng)景、下一個(gè)場(chǎng)景及動(dòng)作響應(yīng)特性等所有UI特性。這樣的信息構(gòu)成一個(gè)數(shù)組,由一個(gè)統(tǒng)一的“解釋平臺(tái)”對(duì)其進(jìn)行翻譯和描述,從而將整個(gè)UI構(gòu)造完成。
這有點(diǎn)類(lèi)似解釋語(yǔ)言,而我們所需要做的就是編寫(xiě)這些“腳本”,對(duì)物件進(jìn)行OSD“繪制”的工作由“解釋”平臺(tái)去調(diào)用外部的OSD發(fā)生器的驅(qū)動(dòng)代碼來(lái)完成。當(dāng)需要改變OSD發(fā)生器或基于不同平面顯示控制器平臺(tái)時(shí),只需要更新少量OSD部分驅(qū)動(dòng)代碼,從而實(shí)現(xiàn)UI系統(tǒng)“平臺(tái)無(wú)關(guān)化”。
我們需要構(gòu)造相關(guān)物件的數(shù)據(jù)結(jié)構(gòu),以便“解釋”平臺(tái)識(shí)別物件類(lèi)型并進(jìn)行正確的繪制。例如下面的結(jié)構(gòu)完成了一個(gè)語(yǔ)言選項(xiàng)(文字物件)的描述:
void UI_ChangeLan()
{
UI_Lan=VAL_Lan;
ReDraw();
}
code byte *STR_LAN_CHN[]=
{
“中文”,
“英文”,
“法文”,
“西班牙文”,
};
code word TXT_LAN_CHN[]=
{
//文字物件的標(biāo)志 對(duì)應(yīng)的文字資源 對(duì)應(yīng)的變量 具有的可選項(xiàng)目總數(shù) 當(dāng)該物件被改變時(shí)的執(zhí)行動(dòng)作
RES_TXT,STR_LAN_CHN,VAL_LAN,sizeof(STR_LAN_CHN)/sizeof(byte *),UI_ChangeLan
};
第一個(gè)數(shù)據(jù)RES_TXT向“解釋”平臺(tái)表明這個(gè)物件是文字,具有文字的數(shù)據(jù)結(jié)構(gòu)?!敖忉尅逼脚_(tái)依據(jù)這一點(diǎn),按照事先約定的結(jié)構(gòu)讀取后繼數(shù)據(jù),第二個(gè)數(shù)據(jù)表明其文字內(nèi)容的來(lái)源是STR_LAN_CHN,第三個(gè)數(shù)據(jù)表明需要根據(jù)哪個(gè)變量來(lái)決定獲取文字資源中第幾個(gè)數(shù)據(jù),而第四個(gè)數(shù)據(jù)表明,該物件具有多少個(gè)可供選擇的文字內(nèi)容,最后一個(gè)數(shù)據(jù)規(guī)定了當(dāng)該物件發(fā)生改變時(shí)需要做什么。這樣,“解釋”平臺(tái)獲得了足夠的信息去“繪制”這樣一個(gè)語(yǔ)言選項(xiàng),并可以在發(fā)生改變時(shí)去自動(dòng)執(zhí)行UI_ChangeLan()這個(gè)函數(shù),幫助程序員去完成語(yǔ)言改變所需要進(jìn)行的操作。
事實(shí)上,所有這些結(jié)構(gòu)完全可以進(jìn)行定制,只要與“解釋”平臺(tái)保持一致就可以了。
利用這樣一個(gè)OSD驅(qū)動(dòng)結(jié)構(gòu),一旦“解釋”平臺(tái)構(gòu)建完成,OSD開(kāi)發(fā)人員需要做的就變成利用平臺(tái)支持的各種物件積木,進(jìn)行擺放、堆積來(lái)構(gòu)造OSD圖形表現(xiàn),而不必要重復(fù)編寫(xiě)實(shí)現(xiàn)代碼和關(guān)心與特定硬件平臺(tái)相關(guān)的驅(qū)動(dòng)代碼細(xì)節(jié)。
更進(jìn)一步,甚至連這些積木的擺放和設(shè)計(jì),我們可以設(shè)計(jì)一個(gè)直觀的Windows應(yīng)用程序來(lái)完成諸如圖形-->字符元件生成器、OSD圖形界面設(shè)計(jì),以及最終的資源文件和UI資料數(shù)組的生成,并與底層的“解釋”平臺(tái)進(jìn)行聯(lián)接編譯,得到最后的MCU代碼。
這樣的OSD界面開(kāi)發(fā)環(huán)境會(huì)擺脫抽象、枯燥和低效率,變得直觀、有趣,甚至可以由客戶(hù)自己設(shè)計(jì)相關(guān)的OSD的界面,而完全不需要編程經(jīng)驗(yàn)和對(duì)OSD底層驅(qū)動(dòng)的了解。
需要指出的是,相較傳統(tǒng)的if else,結(jié)構(gòu)化的OSD UI處理機(jī)制會(huì)帶來(lái)最終程序體積的增加和運(yùn)行速度的變慢,但是這些缺點(diǎn)在MCU內(nèi)部程序空間不斷增加和支持的時(shí)鐘頻率不斷提高的情況下是微不足道的。所以,如果讀者面對(duì)的案例是對(duì)MCU處理速度和程序存儲(chǔ)器受限的情況下,可能并不適用這樣的方案。以筆者開(kāi)發(fā)的液晶電視項(xiàng)目為例,在支持所有電視功能、圖文、麗音及游戲、日歷等附加功能的情況下,基于MCS51的多任務(wù)系統(tǒng)的總程序小于32KB,而基于Myson MTV230的OSD+MCU處理器的運(yùn)行速度非???,并不會(huì)感到任何延遲。而通常支持位圖OSD的開(kāi)發(fā)環(huán)境使用的是X86或更快速的ARM等處理器,并具有大于2MB的程序存儲(chǔ)空間。
本文小結(jié)
當(dāng)固件開(kāi)發(fā)工程師面對(duì)越來(lái)越復(fù)雜的應(yīng)用時(shí),面向?qū)ο?、結(jié)構(gòu)化的編程方式會(huì)變得越來(lái)越重要,其直接的好處是編程效率的提高和維護(hù)成本的下降,同時(shí)對(duì)于程序的健壯性也有幫助。本文提供的方法的優(yōu)越性已經(jīng)在實(shí)際的開(kāi)發(fā)案例中得到檢驗(yàn),這樣完成同樣的OSD界面,筆者可以縮短到原來(lái)的1/4的時(shí)間,并提高了代碼的質(zhì)量。
評(píng)論