列举经典

不知不觉又到设计UI的时候了，由于UI的设计与用户的操作息息相关，于是我们得先看看用户希望怎么操作这个插件：

点击Ribbon上的Amazon Book按钮打开搜索图书的窗口；
输入搜索关键字，并点击搜索；
在搜索结果中选择想要引用的图书；
插入选中图书的超链接。
此外，我们还需要进一步细化搜索结果的那些数据将显示在搜索图书窗口里：

图书的封面；
图书的完整标题；
图书的作者列表。
有了上面这些准备，我们就可以设计搜索图书窗口了。首先，在项目里添加如下所示的窗口：

图   1 - Search Book Window

这个窗口是使用Component Factory的Krypton Toolkit控件包开发的，里面包含：

给用户输入书名的编辑框；
执行搜索的按钮（Go按钮）；
显示搜索结果的ListView控件；
显示选定图书的书名的Label控件；
显示选定图书的作者的Label控件；
插入选定图书的超链接的按钮（Link按钮）；
关闭窗口的按钮（Close按钮）。
一开始，用户没有在编辑框输入任何东西，而ListView控件也没有显示任何结果，Go按钮和Link按钮应该是屏蔽状态（disable）的。当用户在编辑框了输入了东西，Go按钮会被激活：

Code 1 - Enable/Disable Go Button

同理，Link按钮也会在用户选定某本图书后激活：

Code 2 - Enable/Disable Link Button

当用户点击Go按钮时，将执行下列操作：

通过BookSearch.Search方法获取搜索结果；
构建用于ListView显示图书封面的ImageList对象；
向ListView填充搜索结果。
对于第二步，我们需要ImageManager的帮忙：

Code 3 - ImageManager

有了它，Go按钮就可以完成它的任务了：

Code 4 - EventHandler for Click Event of Go Button

ListView是一个不错的东西，但它不能单独为每个项指定图标，这是我最讨厌的。另外，你也可以对图片进行本地缓存，并让ImageManager在获取图片的时候先查看本地缓存，没有的话再去Amazon.com那里要。

当用户选定某本图书时，我们需要把它的书名和作者显示在ListView下面的两个Label上，于是我把ListView的SelectedIndexChanged事件委托修改了一下：

Code 5 - EventHandler for SelectedIndexChanged Event of ListView

回到Ribbon的设计上，我们需要一个按钮来打开搜索图书窗口，为此，我在Ribbon上添加了一个SplitButton，之所以选择它而不是普通的Button，乃因我脑海里一个突如其来的想法，稍后将会为你剖析这个想法的来龙去脉。添加了SplitButton后的Ribbon如下图所示：

图   2 - Amazon Book SplitButton on Ribbon