MSDN原文参考LINK:
http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnembedded/html/embedded04022002.asp
Windows CE .NET 提供为你的嵌入式设计定制用户界面的能力。如 POS terminals, ATM machines, or other 'fixed function' devices。也可以用Internet 浏览器和应用程序.以前版本的WINCE也可以定制用户界面,但带有明显的WINDOWS外观和感觉。现在WINCE 。NET改变了这个。
这里有一些选择,在为一个Windows CE .NET 设备定制界面时:
· 使用 Microsoft Internet Explorer 作为设备的shell. 这是一个非常弹性的选择。使用HTML(和DHTML)编制高度定制化的用户界面是快速的,简单的和弹性的。可以充分利用位图,动画,动态。 (此方法不理解如何用,请高手解答)
· 创建一个独立的应用程序来取代标准shell。在概念上,这个和使用IE是类似的。是一个很好的选择在一个功能单一的设备上,如点销售终端(point-of-sale terminal)上。目前大部份的WINCE应用设备都采用这个方法,优点是可以完全按照作者的界面思路来做自己的界面,只需要BSP有相关组件的支持,缺点是对于MS的通用应用程序界面无法修改,比如WORD和EXCEL.
· 在操作系统里改变某些用户界面组件的外观。可以通过改变位图和代码来实现。
Microsoft在Windows CE .NET中提供了2种皮肤: Windows 95 外观和Windows XP 外观. 这些分别为通用控件,windows控件,和非客户区提供windows外观。“皮肤”文件在下面文件夹处:
\WINCE420\PUBLIC\COMMON\OAK\DRIVERS\SKINNABLEUI.
我们可以看到这个路径中有四个文件夹,GWE/COMMCTRL(Windows 95界面,默认使用此界面),GWEXP/COMMCTRLXP(Windlows XP界面)
在skinnableui 文件夹下提供的代码可以改动(因为是在public树下),可以被你的设备所采用。
l 所以在我们应用程序中,采用了第二和第三点相结合的方法,通过第三种方法来弥补第二种方法的缺点。
如何选择我们所需要的界面:
1. 编译一个新的项目,默认为Windows 95界面。
2. 从catalog里选择Windows XP skin。在 Core O/S/Display Based Devices/Shell and User Interface/User Interface/Customizable UI/Windows XP-like sample skin. 加这个组件到平台里,或者设置the SYSGEN_XPSKIN 环境变量.
下面是两种界面的一个区别:
PIC 1. 使用WINDOWS95界面外观标准皮肤
PIC 2. 使用XP界面 XP风格皮肤
下面我们来举几个例子来告诉大家如何做一些界面的定制,有如下几个例子.
· 修改用户界面颜色。
· 系统TOOLBAR控件相关图片的修改.
· 修改应用程序各种控件.
· 修改系统对话框(比如弹出的警告,内存不足之类的对话框).
· Using Internet Explorer as the shell of our device. (这个例子我没用过,有兴趣可以试一下,在此也不翻,希望有人用过后把翻译好的和心得发上来,谢谢)
l 修改用户界面颜色(Changing the User Interface Colors)
这个问题困扰我很久了,在桌面的控制面板可以自己选择,但不知道怎么用代码去实现,后来不小心看到MSDN有专门讲这一功能的,只需要改注册表就可以了。如下:
如果选择了XP SKIN,则在控制面板的"显示"选项中是无法更改一些窗口的颜色的.不过,我们倒是可以通过更改$(_WINCEROOT)\PUBLIC\COMMON\OAK\FILES\common.reg文件中的XP颜色参数来达到更改窗口颜色的目的.
原XP样式的颜色参数如下:
[HKEY_LOCAL_MACHINE\SYSTEM\GWE]
"SysColor"=hex:\
00,00,00,00,\
3A,6E,A5,00,\
00,00,00,00,\
00,00,00,00,\
EF,EB,DE,00,\
FF,FF,FF,00,\
00,00,00,00,\
00,00,00,00,\
00,00,00,00,\
FF,FF,FF,00,\
C0,C0,C0,00,\
C0,C0,C0,00,\
80,80,80,00,\
31,69,C6,00,\
FF,FF,FF,00,\
EF,EB,DE,00,\
AD,AA,9C,00,\
80,80,80,00,\
00,00,00,00,\
00,00,00,00,\
FF,FF,FF,00,\
73,6D,63,00,\
FF,FF,FF,00,\
00,00,00,00,\
FF,FF,E1,00,\
EF,EB,DE,00,\
00,00,00,00
代表的意思是:
0 COLOR_SCROLLBAR Color of the gray area of a scroll bar.
1 COLOR_BACKGROUND Background color of the desktop window.
2 COLOR_ACTIVECAPTION Color of the title bar of an active window.
3 COLOR_INACTIVECAPTION Color of the title bar of an inactive window.
4 COLOR_MENU Background color of a menu.
5 COLOR_WINDOW Background color of a window.
6 COLOR_WINDOWFRAME Color of a window frame.
7 COLOR_MENUTEXT Color of the text in a menu.
8 COLOR_WINDOWTEXT Color of the text in a window.
9 COLOR_CAPTIONTEXT Color of the text in a title bar and of the size box and scroll bar arrow box.
10 COLOR_ACTIVEBORDER Color of the border of an active window.
11 COLOR_INACTIVEBORDER Color of the border of an inactive window.
12 COLOR_APPWORKSPACE Background color of multiple document interface (MDI) applications.
13 COLOR_HIGHLIGHT Color of an item selected in a control.
14 COLOR_HIGHLIGHTTEXT Color of the text of an item selected in a control.
15 COLOR_BTNFACE Color of the face of a button.
16 COLOR_BTNSHADOW Shadow color of buttons for edges that face away from the light source.
17 COLOR_GRAYTEXT Color of shaded text. This color is set to 0 if the current display driver does not support a solid gray color.
18 COLOR_BTNTEXT Color of the text for push buttons.
19 COLOR_INACTIVECAPTIONTEXT Color of the text in the title bar of an inactive window.
20 COLOR_BTNHIGHLIGHT Highlight color of buttons for edges that face the light source.
21 COLOR_3DDKSHADOW Color of the dark shadow for three-dimensional display elements.
22 COLOR_3DLIGHT Highlight color of three-dimensional display elements for edges that face the light source.
23 COLOR_INFOTEXT Color of the text for ToolTip controls.
24 COLOR_INFOBK Background color for ToolTip controls.
25 COLOR_STATIC Background color for static controls and dialog boxes. Supported in Windows CE 2.0 and later.
26 COLOR_STATICTEXT Color of the text for static controls. Supported in Windows CE 2.0 and later.
27 COLOR_GRADIENTACTIVECAPTION Color of the title bar of an active window that is filled with a color gradient.
28 COLOR_GRADIENTINACTIVECAPTION
这下改变的地方很多了吧,哈哈. 下面看第二个例子
改变TOOLBAR等相关图标(Modifying User Interface Bitmaps)
Another way to get a UI facelift is to alter some of the standard UI bitmaps.The bitmaps contain the toolbar button images used in standard Windows CE .NET applications, such as Microsoft® Windows Explorer. The toolbar bitmaps can be found in the following folder: \WINCE400\public\common\OAK\FILES.(这里意思比较简单,就不翻译了)
· Stdsm.bmp: Windows 95-like toolbar bitmaps.
· Stdsmxp.bmp: Windows XP-like toolbar bitmaps.
· Viewsm.bmp: Windows 95 'file' toolbar bitmaps.
· Viewsmxp.bmp: Windows XP 'file' toolbar bitmaps.
So how about the 'Close' button on an applications caption bar? Can we also modify how this looks? Yes, absolutely. Let's look at how to change the Windows XP look.
This isn't as simple as it first seems. There are two parts to the Close button. The first is the background bitmap, which can be found in C:\wince400\public\common\OAK\DRIVERS\SKINNABLEUI\GWEXP\GCACHEVIEWXP\RES—the file is Closebutton.bmp. This contains the button background in up, down, selected, and disabled form. So how does the white "X" get added to the button?
Right, lets roll up them sleeves and dig into some of the skinnableui source code… Perhaps the first stop on the tour of the code is the initialization function for the XP skin code. The code is wrapped into a class called CacheView_t. The initialization function is called Init( ). The CacheView_t::Init( ) function is located in SKINNABLEUI\GWEXP\GCACHEVIEWXP\gcacheviewxp.cpp. Let's take a look at some of the code. This is where the GDI object cache is setup.
// close button
HBITMAP hbmCloseButton = NULL;
hbmCloseButton = LoadBitmapW_I (hInstance, \
MAKEINTRESOURCE(GWES_CLOSEBUTTON));
ASSERT (hbmCloseButton);
g_cacheview.hdcCloseButton = Gdi::CreateCompatibleDC_I(NULL);
ASSERT(g_cacheview.hdcCloseButton);
Gdi::SelectObject_I(g_cacheview.hdcCloseButton, \
(HGDIOBJ)hbmCloseButton);
Here's what's happening: We're loading a bitmap resource "GWES_CLOSEBUTTON" and selecting this into a cached device context g_cacheview.hdcCloseButton, so that this is ready to use later. GWES_CLOSEBUTTON is defined in gcacheviewxp.res as follows:
GWES_CLOSEBUTTON BITMAP res\\CloseButton.bmp
The bitmap is getting loaded from SKINABLEUI\GWEXP\GCACHEVIEWXP\RES.
So, we've loaded the background bitmap. We now need to figure out where g_cacheview.hdcCloseButton is getting used. Since the caption bar is part of the non-client area, it's a safe bet that we will find the code we're looking for in the following folder: SKINNABLEUI\GWEXP\NCLIENTVIEWXP. Let's take a look at nclientviewxp.cpp.
Below is part of the DrawClose( ) function. We can clearly see the call to DrawCaptionButton( ) passing in the cached hdcCloseButton. (I've skipped some lines that aren't interesting for this part of the article.) We can then see the calls to SelectObject_I(hdc, hNewBrush), which selects a white brush into the device context. We then call DrawDiagonalLine( ) twice to place the cross onto the close button. This can, of course, be easily replaced with whatever background bitmap and foreground text/figure you want.
DrawCaptionButton(hdc, lprc, wControlState, g_cacheview.hdcCloseButton);
// … skip some lines…
hOldBrush = (HBRUSH)Gdi::SelectObject_I(hdc, hNewBrush);
DrawDiagonalLine(hdc, lprc, 1, 2, 0);
DrawDiagonalLine(hdc, lprc, -1, 2, 0);