炫出我的个性！QQ皮肤绘制全程实录(上)

图29

如此一来这三个按钮又都画好了。然后我们依次为这三个水晶球建立导出切片，并按其相应的按钮功能将切片取名为“最小化按钮”、“颜色编辑按钮”和“关闭按钮”，如图30。

图30

别忘了，这三个按钮在用于QQSkin的时候是可以有触发状态的，也就是说当鼠标指向这些按钮时，按钮的状态会有所变化，实际上也就是换了一种图像。因此我们把这三个按钮中的“—”、“+”和“X”符号同时选中后，将其描边色由白色改为#053585，作为这三个按钮在被激发时的状态，如图31。

图31

然后再为这三个按钮依次建立导出切片，以BMP格式保存在“蓝色畅想”文件夹中。为了便于辨认，我们把这三个按钮依次命名为“最小化按钮（触发状态）”、“颜色编辑按钮（触发状态）”和“关闭按钮（触发状态）”，如图32。

图32

用“矩形”工具在“拉幕式面板”图层里画一个124*367大小的矩形，圆角度为10，采用由#FDFEFF至#CEDEFF的线性填充，描边色为#344FB7。如图33。

图33

调整该矩形的位置，使其顶部距QQ主窗体顶部约有63像素，从而为以后信息栏按钮的绘制预留一定的位置。然后在该矩形上建立导出切片，取名为“面板背景”后记得保存为BMP格式。

为了使最终完成的QQSkin能够更好的进行垂直伸拉，我们把当前这个QQ主窗体再次建立切片，然后将切片由上而下地把高度拉低至264像素，如图34。然后再将该切片导出为BMP格式的图片，取名为“工具栏背景”。

图34

因为“蓝色畅想”这款QQSkin在色调上与“QQ2004” Skin的色调相似，所以我们依然可以在“腾讯QQ2004皮肤编辑器”中沿用“QQ2004”Skin的拉幕式模版。因此我们也就省去了在Fireworks里重新为“蓝色畅想”Skin绘制拉幕式按钮及垂直滚动条了。但在本例教程中，为了使大家能够较全面的看到“蓝色畅想”Skin的外形，才画蛇添足的画上拉幕式按钮及垂直滚动条，如图35。

图35

这样一来，“拉幕式面板”的绘制也就轻松完成了。