自己动手制作一款简洁实用的图片浏览器

来源：作者：出处：巧巧读书 2006-11-28 进入讨论组

访问 http://www.qqread.com/vc/h282828.html 软件DIY，说白了就是利用现有的类库、组件，快速构造出自己的程序
出来。就象你找来各种电脑配件，然后把它们装配成整机一样；但也有不
一样的地方，电脑配件即使是旧的二手配件，怎么说也得花一点钱，而软件

的类库、组件，你有时侯可以免费得到。
我想要DIY的，是一款简洁实用的图片浏览器。众所周知，ACDSee是最流行
的图片浏览器，确实很不错。但作为一名程序员，我想，要是我也能制作出
一款简洁实用的图片浏览器，可以在我开发的软件中有图片浏览功能，那该多好。

而我确实DIY出了这么一个图片浏览器，她简洁实用，小巧玲珑，取名为：
SimpleBrowse。现将制作过程介绍如下，与大家分享，并期望能起到抛砖引玉的作用。
第一步：定规格
1.样子要象ACDSee一样，左边是目录树，右边是文件列表，显示图片文件的缩图。
2.缩图要好看，浏览速度要快，能浏览的图片格式要多。
3.简洁实用，制作难度不要太大。
4.在Win98，WinNT下都能用。
第二步：选材料
由于界面主要分为两大部分，即左边的目录树和右边的文件列表，故材料也就主

要是这两大件。
1.左边目录树
从http://www.codejockeys.com/kstowell/上，我们可以得到一个免费的MFC扩
展类库CJ60Lib.dll，这个类库包含有许多用于界面设计的类，其中有一个
CShellTree类，可以显示和Windows Explorer左边目录树一样的效果，正好符
合我想要的，选定了它。
2.右边文件列表
这是关键的部分，它要求能创建、显示、管理图片文件的缩图，要求能浏览多
种格式的图片文件，要求有较精美的缩图显示效果和较快的浏览速度，要求易

于使用难度不大。泰来影像科技有限公司在图像处理应用软件开发方面有较深
的造诣，推出了一个MFC扩展类库thl.dll，其中有一个CThumbListCtrl类，正
是用来创建、显示图片缩图用的，选定了它，从http://www.thalia.com.cn/上获取之。
---- 第三步：生成程序框架
---- 象开发其他程序一样，用VC++6.0 AppWizard生成程序框架。
---- 1.选菜单项File->New，到Projects面板，选取MFC AppWizard(exe)，
Project name为SimpleBrowse。OK确定后，进入一个向导中，共有6步。

---- 2.Step 1，选single document，其它不动，用缺省值。
---- 3.Step 2 of 6，不动，用缺省值。
---- 4.Step 3 of 6，不动，用缺省值。
---- 5.Step 4 of 6，选Internet Explorer ReBars，其它不动，用缺省值。
---- 6.Step 5 of 6，选Windows Explorer，其它不动，用缺省值。
---- 7.Step 6 of 6，不动，用缺省值。Finish确定后，即生成程序框架。
---- 第四步：使用类库、组件
---- 1.左边的目录树对应的类是CLeftView，修改之。
class CLeftView : public CView/*CTreeView*/

...
// Attributes
public:
CShellTree m_TreeCtrl;// use shell tree control
...
// Generated message map functions
protected:
//{{AFX_MSG(CLeftView)
afx_msg int OnCreate(LPCREATESTRUCT lpCreateStruct);
afx_msg void OnSize(UINT nType, int cx, int cy);
afx_msg void OnItemexpanding(NMHDR* pNMHDR, LRESULT* pResult);
afx_msg void OnSelchanged(NMHDR* pNMHDR, LRESULT* pResult);
//}}AFX_MSG
DECLARE_MESSAGE_MAP()
...
};
---- (1)将其父类由CTreeView改为CView，原因后述。

---- (2)加入CShellTree类的成员变量m_TreeCtrl，目录树的具体内容就是由它实现的。
---- (3)增加消息响应函数OnCreate()，在其中把m_TreeCtrl创建起来。
---- (4)增加消息响应函数OnSize()，使m_TreeCtrl总是占满CLeftView的区域。
---- (5)增加消息响应函数OnItemexpanding()，在此响应展开目录的操作。
如果CLeftView的父类是CTreeView的话，将不能得到希望的结果，这就是(1)中把
父类改为CView的原因。
---- (6)增加消息响应函数OnSelchanged()，在此响应点击目录的操作。

---- 具体修改请看源文件leftview.h和leftview.cpp，都很简单。
---- 2.右边的文件列表对应的类是CSimpleBrowseView，修改之。
class CSimpleBrowseView : public CView/*CListView*/
...
// Attributes
public:
CThumbListCtrl m_ThumbListCtrl;
// use thumb list control
// Operations
public:
void FormatList(CString csPath);
// Overrides
// ClassWizard generated virtual function overrides
//{{AFX_VIRTUAL(CSimpleBrowseView)
protected:
virtual void OnInitialUpdate();

// called first time after construct
//}}AFX_VIRTUAL
...
// Generated message map functions
protected:
//{{AFX_MSG(CSimpleBrowseView)
afx_msg int OnCreate(LPCREATESTRUCT lpCreateStruct);
afx_msg void OnSize(UINT nType, int cx, int cy);
//}}AFX_MSG
DECLARE_MESSAGE_MAP()
...
};
---- (1)将其父类由CListView改为CView，原因和上面的类似。
---- (2)加入CThumbListCtrl类的成员变量m_ThumbListCtrl，文件列表的具体
内容就是由它实现的。
---- (3)增加消息响应函数OnCreate()，在其中把m_ThumbListCtrl创建起来，

并初始化为缩图显示风格。
---- (4)增加消息响应函数OnSize()，使m_ThumbListCtrl总是占满
CSimpleBrowseView的区域。
---- (5)在OnInitialUpdate()中创建文件列表的栏目，调用
CThumbListCtrl::BuildColumns()。
---- (6)增加函数FormatList()，它被CLeftView::OnSelchanged()调用，它则
转而调用CThumbListCtrl::BrowseFolder()。点击左边的目录树，右边的文件列
表跟着改变，就是通过这一个函数来实现的。
---- 具体修改请看源文件simplebrowseview.h和simplebrowseview.cpp，都很简单。

---- 3.其它事项
---- CShellTree和CThumbListCtrl都是在MFC扩展类库中实现的，要使用它们，
必须：在编译阶段要有相应的.h文件，在连接阶段要有相应的.lib文件，在运
行阶段要有相应的.dll文件。因此还要做一些配置：在leftview.h中加入
#include "ShellTree.h"，在simplebrowseview.h中加入#include "ThumbListCtrl.h"；
选菜单项Project->Settings，转到Link面板，在Object/library modules中加
入CJ60Lib.lib和thl.lib；将CJ60Lib.dll，thl.dll和simplebrowse.exe放在同

一目录下，注意thl.dll又使用到其它dll如Convert20.dll，JPEG.dll，TIFF60.dll等，
也要放在同一目录下。
---- 第五步：编译、运行
---- Rebuild All，Execute SimpleBrowse.exe，一款简洁实用的图片浏览器浮出水面...
---- 大功告成！
---- （注意：一开始，我编译的是SimpleBrowse的Debug版本，发现不能正确运行，
后来改为编译Release版本，就能正确运行了。可能是因为CJ60Lib.lib和thl.lib
是Release版本的MFC扩展类库，需要配套的缘故。）