程序窗体换肤设计

程序窗体换肤设计

最早看到窗体炫酷皮肤的软件是千千静听，感到很惊艳。老想自己做一个。一番绞脑之后明白了。其实换肤也很简单，设置2到3个pad功能分区底板，以便于功能块的关闭和打开。另设置12个预设定皮肤源图p1(0－11)图片组，皮肤图片可用32*32icon图标图片或其他尺寸bmp图片，预先载入图片组控件。用VB的BitBlt…SRCCOPY贴图方法铺满窗体的功能块区域即可。图片组方法可以做成皮肤选项卡，换肤时跳出选项卡选图换肤。也可不用图片组方法，直接将12个小图片用画板软件拼接成图片条，同样用SRCCOPY方法铺满窗体的功能块区域。此方法要另外做皮肤选项卡。

pad1,pad2是picturebox 做画布绘制皮肤，上面添加
VB.DriveListBox Drive1
VB.ComboBox Combo1
VB.DirListBox Dir1
VB.FileListBox File1
VB.TextBox Text1
就成了打开文件窗口。
pad2可作为播放停止按钮控制板。

至于皮肤图片么，什么风格就你自己设计了。炫酷的，古典的，文雅的，淡色深色的，自己喜欢就好。但有一点要注意，选的小图片块连行连排贴起来要不露贴图痕迹为佳，这就要求你有艺术功底了。
本示例是用VB6 写的，可用VC 或其他语言改写。

附上范例：
主程序窗体Mplayer6 （多媒体播放器）
引用窗体 cdplay61 (CD播放器)
窗体源码详见我上传的资源文件：程序窗体界面换肤的实现（VB6源码）

以下是操作示例：
pad1，pad2是picturebox，是功能块底板， 做画布绘制皮肤
facenum 皮肤底图编码

Private Sub draw_form()
'**** 皮肤贴图和换肤操作
dW = picHBar.Width
For n = 0 To 232 '**** 绘制渐变色窗体上部标题条
picHBar.Line (0, n)-(dW, n), RGB(232 - n, 232 - n, 255 - n / 2)
Next
picHBar.Line (0, 0)-(1, 225), QBColor(15), B

facenum = labFnum.Caption
If labFnum.Caption = “” Then ’ **** 初始为空，则预设定为 2
facenum = 2
End If
If facenum = 4 Or facenum = 5 Or facenum = 9 Then
labFilename.ForeColor = QBColor(9) '**** 文字颜色与皮肤色协调
Else
labFilename.ForeColor = QBColor(14)
End If
'****** pad1 , pad2 为功能分区
dW = pad1.Width / 15
dH = pad1.Height / 15
dw1 = p1(facenum).Width / 15
dh1 = p1(facenum).Height / 15
pad1.DrawWidth = 1
For sh = 0 To dH Step dh1
For sw = 0 To dW Step dw1
BitBlt pad1.hdc, sw, sh, dw1, dh1, p1(facenum).hdc, 0, 0, SRCCOPY
Next
Next
pad1.DrawWidth = 3 '**** 绘制功能区域分仓框线
pad1.Line (-15, -15)-(dW * 15 + 15, dH * 15 + 15), QBColor(15), B
pad1.Line (-30, -30)-(dW * 15 - 15, dH * 15 - 15), QBColor(8), B

dW = pad2.Width / 15
dH = pad2.Height / 15
pad2.DrawWidth = 1
For sh = 0 To dH Step dh1
For sw = 0 To dW Step dw1
BitBlt pad2.hdc, sw, sh, dw1, dh1, p1(facenum).hdc, 0, 0, SRCCOPY
Next
Next
pad2.DrawWidth = 3 '**** 绘制功能区域分仓框线
pad2.Line (-15, -15)-(dW * 15 + 15, dH * 15 + 15), QBColor(15), B
pad2.Line (-30, -30)-(dW * 15 - 15, dH * 15 - 15), QBColor(8), B
'*****************************
pad1.Refresh
pad2.Refresh

'*********** 同时绘制其他部分皮肤 **********
BitBlt picNd.hdc, 0, 0, dw1, dh1, p1(facenum).hdc, 0, 0, SRCCOPY
picNd.Line (0, 45)-(840, 60), QBColor(9), BF
BitBlt ps1.hdc, 0, 0, dw1, dh1, p1(facenum).hdc, 0, 0, SRCCOPY
ps1.Line (0, 0)-(955, 150), QBColor(2), B

'** draw CD Player cover 同时绘制其他窗体皮肤
dW = cdplay61.pad1.Width / 15
dH = cdplay61.pad1.Height / 15
cdplay61.pad1.DrawWidth = 1
For sh = 0 To dH Step dh1
For sw = 0 To dW Step dw1
BitBlt cdplay61.pad1.hdc, sw, sh, dw1, dh1, p1(facenum).hdc, 0, 0, SRCCOPY
BitBlt cdplay61.pad2.hdc, sw, sh, dw1, dh1, p1(facenum).hdc, 0, 0, SRCCOPY
Next
Next
cdplay61.pad1.Line (-15, -15)-(dW * 15 + 15, dH * 15 + 15), QBColor(15), B
cdplay61.pad1.Line (-30, -30)-(dW * 15 - 15, dH * 15 - 15), QBColor(8), B
cdplay61.pad1.Refresh
cdplay61.pad2.Refresh
End Sub

Private Sub cmdFace_Click()
'**** 换肤按钮
'**** 此设置是连续循环换肤，满意即可。用户操作简单便捷
'**** 也可改为选项卡选择皮肤图片，用户操作太费时
facenum = facenum + 1
If facenum > 11 Then facenum = 0
labFnum.Caption = facenum
draw_form '**** 绘出皮肤

Select Case facenum '**** 显示皮肤名称
Case 0
labStatus.Caption = “经典风格”
Case 1
labStatus.Caption = “水到渠成”
Case 2
labStatus.Caption = “蓝天之梦”
Case 3
labStatus.Caption = “兰色妖姬”
Case 4
labStatus.Caption = “木已成舟”
Case 5
labStatus.Caption = “平原秋色”
Case 6
labStatus.Caption = “花样年华”
Case 7
labStatus.Caption = “金色年代”
Case 8
labStatus.Caption = “燃情岁月”
Case 9
labStatus.Caption = “金碧辉煌”
Case 10
labStatus.Caption = “古风典雅”
Case 11
labStatus.Caption = “摩登时代”
End Select

End Sub

Private Sub cmdFace_MouseMove(Button As Integer, Shift As Integer, X As Single, Y As Single)
labStatus.Caption = “换肤”

facenum = labFnum.Caption
Select Case facenum
Case 0
labStatus.Caption = “经典风格”
Case 1
labStatus.Caption = “水到渠成”
Case 2
labStatus.Caption = “蓝天之梦”
Case 3
labStatus.Caption = “兰色妖姬”
Case 4
labStatus.Caption = “木已成舟”
Case 5
labStatus.Caption = “平原秋色”
Case 6
labStatus.Caption = “花样年华”
Case 7
labStatus.Caption = “金色年代”
Case 8
labStatus.Caption = “燃情岁月”
Case 9
labStatus.Caption = “金碧辉煌”
Case 10
labStatus.Caption = “古风典雅”
Case 11
labStatus.Caption = “摩登时代”
End Select

End Sub

‘**** End ****