為什么要保證我們的軟件產品或應用程序中的文本、圖像和字體、布局等問題呢,因為我們用戶的終端顯示設備通常型號和設置各異,如最近出現的16×9,低于8”的等最新款式移動手提電腦,我們的應用程序和軟件產品通常會在這樣的終端變得面目全非,而這顯然給用戶的使用帶來了嚴重的問題,直接導致的問題如:操作易用性Usability、功能可接近性Accessibility、文本可讀性Readability 等,而這樣的問題并非不可逾越,要解決如何讓我們的應用程序在高分辨率的顯示下仍然保持正常可視,重點需要解決四個方面的問題文本和字體、圖像(圖形、圖標和鼠標指針)、版面設置和重繪等。
前言
所有的應用程序都可以工作在高分辨率下顯示嗎?答案當然是否定的。現在比較標準的計算機顯示器都已經可以支持顯示大概96像素點/英寸的分辨率了,而且越來越多的應用程序都可以運行在這種分辨率下,但是卻仍然面臨分辨率日益增長的帶來的危險。現在,我們可以輕松的買到一臺133-DPI顯示分辨率的筆記本電腦,甚至還有170DPI的,也許幾年以后200-DPI的顯示分辨率已經隨處可見了,著名的工業雜志DisplaySearch曾經預言在2002年底有40%的膝上電腦已經超過100-DPI的屏幕分辨率了,而且這個數字還在增長。
例圖 1.各種常見分辨率下字體外觀
例圖2. 改變分辨率帶來的影響
開發一個適應多分辨率的應用程序不是很簡單,尤其對于一個已經成形的應用程序和系統來說,動靜可能不小,但是它的好處是可以使我們不必再假設分辨率的各種情況,避免不能縮放帶來的質量下降(比如說位圖和位圖字體),而且開發支持高分辨率的應用程序有時候會覺得有些單調和乏味,但是如果我們的產品或應用程序是為了服務于特定人群的(比如說視力不好、和需要長時間工作的人以及視弱人群),那么我們的工作就會變得非常有必要(在高對比度下和使用擴展大字體的情況都和高分辨率有關)。
系統韻律
Windows平臺本身提供了幫助解決用戶系統高分辨率問題的解決途徑,我們可以通過一個小函數GetDeviceCaps()先獲得當前的顯示分辨率,然后通過GetSystemMetrics()這個系統韻律函數和讀取系統信息和參數的SystemParametersInfo()函數提供的方法來改變windows中的圖形以及控件元素、和字體的尺寸,從一個3d的邊框效果乃至到一個小圖標的尺寸,都可以隨心所欲的改變。
關鍵問題
在設計高分辨率的應用程序過程中,我們要特別注意四個重要的方面:文本和字體、圖像(圖形、圖標和鼠標指針),版面設置以及重繪。
文本和字體
這里有兩種字體:位圖(光柵)字體和TrueType字體,而我們要想實現高分辨率的應用程序就只能使用Truetype字體,因為位圖(光柵)字體只能在96-DPI的屏幕分辨率下正常,而且不能夠縮放,Windows已經支持TrueType字體很長時間了,所以找到一個很好的TrueType字體并且定義到我們的應用系統中并不是什么大的問題,另外一個原因只能使用Truetype字體,因為一些最新的技術,比如說GDI+,但是它只支持Truetype字體的操作。
SendMessage (hwnd, WM_SETFONT, (WPARAM) font, 0);
SelectObject (hdc, font);
當我們在窗口上創建字體的時候,可以使用像素指定字體尺寸,然后調整分辨率。
Memset (&lf, 0, sizeof (lf));
lf.lfHeight = SCALEY (13);
HFONT font = CreateFontIndirect (&lf);
或者可以使用Windows API提供的選擇文字通用對話框,允許使用更準確的像素點來指定字體尺寸,然后經過一些算法后轉化字體尺寸為像素,可以指定只使用TrueType字體來顯示。
Memset (&data, 0, sizeof (data));
data.lStructSize = sizeof (data);
data.hwndOwner = form;
data.Flags = CF_TTONLY | CF_SCREENFONTS;
ChooseFont (&data);
最好的方法常常是在各種高分辨率下指定一個尺寸和一個區域的尺寸并且使用字體尺寸作為度量比例尺來指定這個頁面中的其它元素,比如說,可以設定按鈕之間的間距為缺省字體的高度的多少,使用GetTextMetrics()這個函數可以重新設定一個字體的高度。
TEXTMETRIC metrics;
GetTextMetrics (hdc, &metrics);
Int height = metrics.tmHeight;
最好不要使用TEXTMETRIC提供的tmAveCharWidth 方法,因為它只可以處理英文字母,除此以外我們還可以使用GetTextExtent()的這個方法來確認所關心的字符串的尺寸,我們可以用GetTextExtentPoint32()繪制一個環繞字符串的矩形,示例如下:
GetTextExtentPoint32 (hdc, string, strlen (string), &size);
Int paddingX = SCALEX (8);
Int paddingY = SCALEX (8);
Rectangle (hdc, x - paddingX, y - paddingY, x + size.cx
+ paddingX, y + size.cy + paddingY);
TextOut (hdc, x, y, string, strlen (string));
最后,我們意識到盡管TrueType字體縮放精細,但是他們不是線性縮放,也就是說在DPI增加10%以后字符串的長度不能正確的增加10%,(使用GDI+就沒有這個問題),因為一些特定的字母只能在幾個尺寸上看起來不錯,而TrueType卻可以自動選擇一個近似的尺寸正確顯示,這是使用GetTextExtent這個函數的原因。
推薦設計
優秀海報設計精選集(8)海報設計2022-09-23
充滿自然光線!32平米精致裝修設計2022-08-14
親愛的圖書館 | VERSE雜誌版版式設計2022-07-11
生活,就該這麼愛!2022天海報設計2022-06-02
最新文章
國外優秀WEB網頁設計精選網頁設計2023-07-06
國外優秀WEB網頁設計精選網頁設計2023-05-30
Lacoste90周年網頁設計網頁設計2023-05-06
國外優秀WEB網頁設計精選網頁設計2023-01-07