posts - 14, comments - 4, trackbacks - 0, articles - 0

VC++下关于工具条的设计

Posted on 2006-07-06 19:03 will 阅读(2307) 评论(0)  编辑 收藏 引用 所属分类: 技术探索
在VC++下实现高彩色工具条

  引言

  一些Windows系统自带程序如资源管理器、Internet Explorer等程序的工具条看上去和其他一些程序的工具条不太一样,在颜色上要漂亮许多。其实这些程序的工具条上的图标均为256色,而普通应用程序 在工具栏上所显示图标的颜色通常只有16色,这就决定了后者在视觉上远没有前者美观。由于Windows随系统而带的程序也是由开发人员编写的应用程序, 这就说明通过程序编码可以实现256色甚至更多色彩的图标在工具栏上的显示。为此笔者经过摸索,通过MFC编程在应用程序中实现了高彩色工具条。现将实现 的主要方法介绍如下,以飨广大读者。

  基本设计思路

  在实现高彩色工具条之前,先研究一下普通16色的工具条的实现过程,并从中总结出改进方法。在VC的资源视图中工具条是一个资源名为 IDR_MAINFRAME的Toolbar型资源,并可通过在编辑按钮上的图标来完成工具条上图标的绘制。虽然在资源视图中工具条上各按钮的图标是相互 独立的,但在存储时并非像图标一样保存为ico格式文件而是以bmp位图格式保存在磁盘上的。该位图是一个由工具条上的按钮图标组成的长条型位图图像,中 间没有任何缝隙,在程序运行和在资源视图对工具条进行编辑时该图像首先装载到一个图像列表中,然后工具栏根据索引依次从图像列表中将图像显示到工具条的各 个按钮上。由于VC限制工具栏上的图标不能超出16色,因此不论是在资源视图直接编辑位图还是用复制粘贴等手段均无法获取超出256色的工具条(注:用复 制粘贴的方法虽然在编辑视图中可以暂时显示出256色的图标,但在程序运行时仍会退化成16色)。

  由于不能在资源视图中通过编辑Toolbar资源实现16色以上的图标,加之工具条在显示时有并不直接从Toolbar获取图标而是从图像列表中读 取,因此可以通过其他一些图像处理软件做好类似于工具条的bmp图像(仅颜色比普通工具条bmp图像丰富,其余完全一样),并以位图的形式加入到程序资 源。在使用时,先将其读取到图像列表,这样图像列表中用于显示到工具条上的图标的颜色就可以是256、24位、甚至32位色的了。由于工具条缺省时将直接 加载资源名为IDR_MAINFRAME的Toolbar型资源作为图标的来源,因此还必须通过SetImageList()函数将含有高彩色工具条位图 的图像列表指定为工具条的图标来源。

  真彩工具条的实现

  由于工具条的创建是在主框架类的OnCreate()函数中完成的,因此高彩色图像的装载和图像列表的替换工作必须也在此进行。在进行程序设计之前, 需要做好各种准备工作,比如高彩色工具条位图的绘制、高彩色位图加入到资源等。绘制工具条位图时,必须控制好图像的尺寸,如需要有N个边长为 M的图标,那么需要绘制的位图尺寸为长=N*M;宽=M。真彩位图在加入到工程之后就不能再在VC的资源视图中进行编辑了。由于这个彩色位图仅起到美化界 面的作用,因此具体对的事件响应等工作还要通过设置原有的Toolbar资源来完成。

  准备工作就绪后,先要把工具条位图装载到图像列表,这样才能被工具条做获取。在作这一步时,必须用::LoadImage()函数去加载工具条位图,并通过宏MAKEINTRESOURCE()来指定具体要加载哪一个资源位图:

HBITMAP hbm = (HBITMAP)::LoadImage(AfxGetInstanceHandle(),
MAKEINTRESOURCE(IDB_TOOLBAR), //加载IDB_TOOLBAR
IMAGE_BITMAP, //按位图格式
0,0, // cx,cy
LR_CREATEDIBSECTION | LR_LOADMAP3DCOLORS );

LoadImage返回一个位图句柄HBITMAP,但在MFC下使用CBitmaps会更加方便,可创建一个
CBitmap对象并用Attach()成员函数将它与位图句柄联系起来:

CBitmap bm;
bm.Attach(hbm);

  MFC加载工具栏位图时使用了一个内部函数AfxLoadSysColorBitmap()将缺省颜色设定为16色,因此为了显示16色以上的图像,必须在调用图像列表类CImageList的Create()函数创建图像列表时对图像清单做进一步的处理:

m_ilToolBar.Create(32,32,ILC_COLOR8, 4, 4);
m_ilToolBar.Add(&bm,(CBitmap*)NULL);

  这里用ILC_COLOR8标明了创建的图像列表是256色的,在VC的commctrl.h中对其有定义,并且还提供有其他几种颜色位深度的预定义:

#define ILC_COLOR4 0x0004 //16色
#define ILC_COLOR8 0x0008 //256色
#define ILC_COLOR16 0x0010 //16位色
#define ILC_COLOR24 0x0018 //24位色
#define ILC_COLOR32 0x0020 //32位色

  如果使用的工具条位图只有256色(对于多数程序这样已经足够),则显然没有必要再使用更高级别的位深度定义。最后一步,也是最关键的一步,必须通过 SetImageList()函数指定工具条m_wndToolBar的图标来源不再是原来缺省的图像列表而是含有高彩色位图的图像列表 m_ilToolBar:

m_wndToolBar.GetToolBarCtrl().SetImageList(&m_ilToolBar);

  到此为止就可以通过MFC在自己编写的程序中实现类似于IE等软件的漂亮的工具条了。下图就是笔者用上述方法得到的程序界面:



  小结

  本文通过对作为工具条图标来源的图像列表的替换,实现了在普通MFC应用程序中具备了以往只有Windows系统自带程序才具备的高彩色工具条。较好 地美化了程序的界面。本文程序在Windows 98下,由Microsoft Visual C++ 6.0编译通过。


用VC制作非常酷的工具条

  自微软推出Windows 95后,一大批全新的控件使我们的应用程序更加美观,使用也更加方便。其中一个显著的变化就是工具条不再是一个突出的3D小方框,而是变成了平面的状态,但 是只要把鼠标移动到上面,它就会自动地浮出来,大大方便了用户。

  笔者经过一段时间摸索,终于找到了制作这种工具条的方法。原来Windows 95封装了许多常用的控件,大都被放在Comctrl32.dll中,其中Toolbar控件是用于制作工具条的。下面 简要介绍一下如何在VC5.0中添加一个Toolbar。

  众所周知,所有的控件都是某一类型的窗口,所以制作Toolbar也要从制作窗口开始。由于MFC的Toolbar类并不支持新的功能,所以我们只好用SDK方法,通过API调用来完成整个过程 ,该过程与制作一个传统的工具条类似。

  Toolbar是属于comctrl32.dll的扩展功能,所以要先调用InitCommonControlsEx()的函 数。该函数有一个重要的参数决定了对Toolbar的支持,它的主要作用是注册Toolbar窗口,以 便在以后的程序中制作这种窗口,而普通的工具条则要调用InitCommandControls()。需要注意的是这两个函数的写法。

INITCOMMONCONTROLSEX icex;
DWORD dwStyle;
icex.dwSize = sizeof(INITCOMMONCONTROLSEX);

//注意下面这两个参数决定了是否注册Toolbar

icex.dwICC=ICC_COOL_CLASSES|ICC_BAR_ CLASSES;
InitCommonControlsEx(&icex);



  然后就可以调用CreateWindowEx这个函数来建立Toolbar窗口:

HWND hwndTB = CreateWindowEx(
WS_EX_TOOLWINDOW, //扩展工具条风格
TOOLBARCLASSNAME, //Toolbar类名
NULL,
WS_CHILD|WS_VISIBLE|TBSTYLE_FLAT, //窗口风格
0,0,0,0, //大小
AfxGetApp()->GetMainWnd(), //父窗口名
NULL,
AfxGetInstanceHandle(), //实例
NULL);



  判断一下窗口句柄,如果不为空,就表示窗口建立成功。此时的Toolbar不过是一个空空的窗口,我们可以根据需要向里面添加按钮。向Toolbar 中添加按钮是通过向它发送消息来 实现的,以下过程与制作传统的工具条基本一致。首先,建立一个ImageList控件,然后通过定义按钮的数据结构来确定每个按钮的类型。
// 建立一个Imagelist 控件,

HWND himl;
//MYICON_CX,MYICON_CY是每个按钮的大小
himl= ImageList_Create(MYICON_CX,MYICON_CY,ILC_COLOR4,0,4);

//加入事先作好的工具条位图IDB_BITMAP2
ImageList_Add( himl,
LoadBitmap(AfxGetInstanceHandle(),MAKEINTRESOURCE(IDB_BITMAP2)),NULL);

//通过消息把位图加入到Toolbar中
SendMessage(hwndTB, TB_SETIMAGELIST, 0, (LPARAM)himl);

  下面加入5个普通的按钮:

TBBUTTON tbArray[5]; //按钮的数据结构
for(i=0;i<5;i++)
{
tbArray[i].iBitmap = i; //第i个位图
tbArray[i].idCommand = IDM_BUTTONSTART+i;
//命令ID
tbArray[i].fsState = TBSTATE_ENABLED;
tbArray[i].fsStyle = TBSTYLE_BUTTON;
//按钮风格
tbArray[i].dwData = 0;
tbArray[i].iString = i; //显示的字符串
}

//设置按钮结构的大小

::SendMessage(hwndTB,TB_BUTTONSTRUCTSIZE, sizeof(TBBUTTON), 0);
//添加按钮到Toolbar中
::SendMessage(hwndTB,TB_ADDBUTTONS,(UINT)5, (LPARAM)tbArray);



  至此,一个很酷的工具条基本上制作完成,最后再调用函数ShowWindow()即可: ShowWindow(hwndTB, SW_SHOWMAXIMIZED);

  当点击按钮时,Toolbar就把消息传送到父窗口中,由父窗口响应消息。Toolbar中按钮的ID包含在消息函数的wParam参数中,可以设置 它来调度不同的模块。这时可以重载父窗口的O nCommand()函数,根据wParam参数判断点击了哪个按钮。假定父窗口是主窗口框架,代码如下:

BOOL CMainFrame::OnCommand(WPARAM wParam,LPARAM lParam)
{
switch(wParam)
{
case IDM_BUTTONSTART+0:
AfxMessageBox(“你点中了第一个按钮!!", MB_ICONINFORMATION);
break;
case IDM_BUTTONSTART+1:
AfxMessageBox(“你点中了第二个按钮!!",MB_ICONINFORMATION);
break;
case IDM_BUTTONSTART+2:
AfxMessageBox(“你点中了第三个按钮!!", MB_ICONINFORMATION);
break;
}
return CMainFrame::OnCommand(wParam,lParam);
}

Visual C++ 版本6中工具条的新特色

Dave Schmi


  微软在www.microsoft.com/visualc已经推出Visual C++6.0预览版几个月了。正式版预计到今年年底发布。同时,预览版显示出版本6将包含大量的改进和提高,包括支持Internet控件,例如扁平工具 条等。虽然改进的控件包与Internet无关,但它首先出现在Internet Explorer中,因此它就被取做这个名字了。事实上,官方发布的预览版的标题是“针对Internet Explorer 4.0的Visual C++ 5.0技术预览”。

  在以前关于MFC工具条类的讨论专题中,我曾答应提供一个在版本6中工具条的外观演示。有一个很好的消息,那就是你现在用CToolBar所作的所有 工作在新的版本中都是有效的,包括那些在以前的栏目中所描述的一些扩展功能。因此,你将很容易修改现存的程序以获得象Internet Explorer和Visual Studio中那样“酷”的界面。此外,并没有什么坏消息。

工具条的新特色

  早在版本4中,CToolBar就已被MFC库完全实现了。一旦公用控件动态链接库(命名为comctl32.dll)变得无所不在了, CToolBar就成了如今已包含在操作系统中的工具条控件的代名词了。然而,CToolBar并没有揭示公用工具条控件的所有能力。如今,通过 CreateEx()函数,它成功了。

  公用控件动态链接库现在包含了至少三类风格:最初的、在Internet Explorer3.0中加入的以及在Internet Explorer 4.0中加入的。虽然这些版本理论上是向下兼容的,但某些专业人员曾写出一些不能在后来版本中正常运行的应用程序,这可能是这些程序采用了一些没有公开的 功能,而这些功能并没有被包含在所有的版本中。

  Visual C++程序员没有这样的经历,因为在Visual C++4.0或5.0中comctl32.dll并不是一个可以再分发的组件,它在安装Internet Explorer时被更新,因此MFC程序员无法依靠最新版本的某些功能来用于他们的程序。这就是CToolBar仅仅具有最初的DLL的有限功能的原 因。CToolBar能够实现最新的特色意味着微软将在Visual C++6.0中包含最新的DLL并将其作为一个可以再分发的组件。

  绝大多数新特色将由在调用CreateEx()和其它CToolBar成员函数时指定的新的风格标志来确定。下面是commctrl.h的一部分,它定义了TBSTYLE类标识符:


#define TBSTYLE_BUTTON 0x0000
#define TBSTYLE_SEP 0x0001
#define TBSTYLE_CHECK 0x0002
#define TBSTYLE_GROUP 0x0004
#define TBSTYLE_CHECKGROU TBSTYLE_GROUP | TBSTYLE_CHECK)
#if (_WIN32_IE $#@62;= 0x0300)
  #define TBSTYLE_DROPDOWN 0x0008
#endif
#if (_WIN32_IE $#@62;= 0x0400)
  #define TBSTYLE_AUTOSIZE 0x0010
  #define TBSTYLE_NOPREFIX 0x0020
#endif

#define TBSTYLE_TOOLTIPS 0x0100
#define TBSTYLE_WRAPABLE 0x0200
#define TBSTYLE_ALTDRAG 0x0400
#if (_WIN32_IE $#@62;= 0x0300)
  #define TBSTYLE_FLAT 0x0800
  #define TBSTYLE_LIST 0x1000
  #define TBSTYLE_CUSTOMERASE 0x2000
#endif
#if (_WIN32_IE $#@62;= 0x0400)
  #define TBSTYLE_REGISTERDROP 0x4000
  #define TBSTYLE_TRANSPARENT 0x8000
  #define TBSTYLE_EX_DRAWDDARROWS 0x00000001
#endif



  你会注意到其中的一些采用了条件编译,依赖于_WIN32_IE的值,它缺省指的是Internet Explorer 4.0(即取值为0x0400)。对于Internet Explorer 3.0(即取值为0x0300)以前的版本,大多数的TBSTYLE标识符指的是按钮或是一组按钮。Internet Explorer3.0引入了扁平钮、文本标签、下拉列表和自定义绘制。Internet Explorer 4.0增强了下拉列表和自定义绘制功能,并且增加了支持OLE拖动目标到一个工具条。

扁平钮和把手

  在过去的18个月中我常常被问及该如何获得象Internet Explorer和Visual Studio中的工具条一样不使用浮雕按钮而是用扁平钮并且带有便于移动和定位的把手那样酷的界面。这些特色并不被MFC所支持,因此最简单获取的方法就 是购买一个扩展库。而对于Visual C++ 6.0来说却无须多此一举,因为它使得CToolBar类实现了对扁平钮、把手和其它新的视觉效果的支持。

  在预览版中,AppWizard并不会自动包括这些新特色,但它们却很容易被加入。表1显示了AppWizard创建的主框架窗口的OnCreate ()函数,表2显示了需要做哪些修改以获得具有扁平钮和把手的工具条。图1显示了表1创建出的工具条,而图2显示出了表2实现的工具条。


表 1: CMainFrame::OnCreate as generated by AppWizard
int CMainFrame::OnCreate(LPCREATESTRUCT lpCreateStruct)
{
if(CMDIFrameWnd::OnCreate(lpCreateStruct) == -1)
  return -1;

if(!m_wndToolBar.Create(this)||!m_wndToolBar.LoadToolBar(IDR_MAINFRAME))
  {
   TRACE0("Failed to create toolbar\n");
   return -1; // fail to create
  }

if(!m_wndStatusBar.Create(this) ||
  !m_wndStatusBar.SetIndicators(indicators,sizeof(indicators)))
  图1
表2: Adding flat buttons and the gripper
int CMainFrame::OnCreate(LPCREATESTRUCT lpCreateStruct)
{
if(CMDIFrameWnd::OnCreate(lpCreateStruct) == -1)
  return -1;

if(!m_wndToolBar.CreateEx(this)||!m_wndToolBar.LoadToolBar(IDR_MAINFRAME))
  {
   TRACE0("Failed to create toolbar\n");
   return -1; // fail to create
  }

if(!m_wndStatusBar.Create(this)||!m_wndStatusBar.SetIndicators(indicators,sizeof(indicators)/sizeof(UINT)))
{
TRACE0("Failed to create status bar\n");
return -1; // fail to create
}

// TODO: Remove this if you dont want tool tips or a resizeable toolbar
m_wndToolBar.SetBarStyle(m_wndToolBar.GetBarStyle() |
CBRS_GRIPPER | CBRS_BORDER_3D | CBRS_TOOLTIPS | CBRS_FLYBY | CBRS_SIZE_DYNAMIC);

// TODO: Delete these three lines if you dont want the toolbar to
// be dockable
m_wndToolBar.EnableDocking(CBRS_ALIGN_ANY);
EnableDocking(CBRS_ALIGN_ANY);
DockControlBar(&m_wndToolBar);

return 0;
}
图2

  为了作出扁平按钮我必须使用CreateEx()来代替Create()。这个新的函数在afxext.h中声明:

BOOL CreateEx
(
CWnd* pParentWnd, // parent window
DWORD dwCtrlStyle = TBSTYLE_FLAT, // extended style
DWORD dwStyle = // style
WS_CHILD | WS_VISIBLE | CBRS_ALIGN_TOP,
CRect rcBorders = CRect(0,0,0,0), // border rectangle
UINT nID = AFX_IDW_TOOLBAR // identifier
);


  因为扩展风格缺省指的就是TBSTYLE_FLAT,因此我要得到扁平按钮就只需要简单地将AppWizard形成的代码中的Create()改为 CreateEx()即可。我将在后面实现其它的扩展风格。为了获得把手,我必须在调用SetBarStyle()函数时包含CBRS_GRIPPER标 志,参看表2。这是CControlBar类的一个新风格,而CToolBar类是从它继承而来的。请注意到我也加入了CBRS_BORDER_3D标 志,这是为了修正一个未知的绘制问题,该问题将会在工具条的边缘绘制一些多余的点。这也许意味着预览版确实有这个问题,因为一旦我将3D标志加入就立即解 决了并且也似乎没有影响到别的什么。

  上面所作的两个简单的改变是使得一个已存程序获得酷界面的最省力的方法。在一个程序具有了扁平钮和把手的同时,它也不会发生不应有的其它改变。

只有注册用户登录后才能发表评论。
网站导航: 博客园   IT新闻   BlogJava   知识库   博问   管理