改变对话框(窗口)的背景颜色是最简单的改变Windows应用程序外观的方法,根据Windows创建与管理机理,一般有两种方法。一种是处理WM_CTLCOLOR消息,首先创建所选背景颜色的刷子,然后调用SetBkColor()或SetDialogBkColor()以所创建的刷子来绘制窗口或对话框的背景。需要重画窗口或对话(或对话的子控件)时,Windows向对话发送消息WM_CTLCOLOR,应用程序处理WM_CTLCOLOR消息并返回一个用来绘画对话背景的刷子句柄。另外一种是响应Windows的WM_ERASEBKGND消息,Windows向窗口发送一个WM_ERASEBKGND消息通知该窗口擦除背景,可以使用VC++的ClassWizard重载该消息的缺省处理程序来擦除背景(实际是用刷子画),并返回TRUE以防止Windows擦除窗口。
2.改变窗口外形
通过使用新的SDK函数SetWindowRgn(),可以将绘画和鼠标消息限定在窗口的一个指定的区域,因此实际上是使窗口成为指定的不规则形状(区域形状)。“区域”是Windows GDI中一种强有力的机制,区域是设备上的一块空间,可以是任意形状,复杂的区域可以由各个小区域组合而成。Windows内含的区域创建函数有CreateRectRgn()、CreatePolyRgn()、CreatePolygonRgn()、CreateRoundRectRgn()和CreateEllipticRgn(),再通过CombineRgn()来组合区域,即可得到复杂形状的区域,获得复杂形状的窗口外形。
通过上面的方法虽然可以得到“异形”窗口,但感觉颜色单调,外形也不够“COOL”,能否获得更酷的“异形”对话框/窗口呢?回答是肯定的。下面就介绍利用位图和蒙板创建“异形”对话框/窗口的方法。
3.利用位图创建异形对话框窗口
利用位图创建异形对话框原理是根据象素的颜色来进行“扣像”处理,对所有非指定颜色象素区域进行区域组合。利用这一技术,实际上就是实现对话框/窗口的位图背景,并且对指定的颜色区域进行透明处理。下面就以透明位图为背景的对话框为例来说明:
首先用绘图软件如PhotoShop绘制编辑一幅拟做对话框背景用的图片,用BMP格式保存,假设存为Back.Bmp。需要说明的是,虽然Visual C++集成开发环境的资源编辑器只能编辑不超过16色的位图,但完全我们可以以真彩色方式存储,不必理会Visual C++的警告。
下一步是用Visual C++的AppWizard创建一个基于对话框的应用程序假定命名为Trans。用资源编辑器引入背景图片Back.Bmp,如果是高彩色,不必理会出现的警告信息,点击OK确认即可。为了明确,修改默认的资源ID标识IDB_BITMAP1为IDB_BACKBMP。然后修改对话框的Style为Popup,Border为None,如图1。
图1
向CTransDlg类添加区域处理功能模块void CTransDlg::SetupRegion(CDC *pDC /*对话框窗口DC*/, UINT BackBitmapID /*背景位图资源ID*/, UINT MaskBitmapID /*区域处理位图资源ID*/, COLORREF TransColor = 0x00000000 /*透明颜色值,默认为黑色*/)。到目前为止,我们暂时认为MaskBitmapID等同于BackBitmapID。其核心工作是根据MaskBitmapID指示位图的象素颜色进行区域组合。完整的代码如下:
void CTransDlg::SetupRegion(CDC *pDC /*对话框窗口DC*/,
UINT BackBitmapID /*背景位图资源ID*/,
UINT MaskBitmapID /*区域处理位图资源ID*/,
COLORREF TransColor /*透明颜色值*/)
{
CDC memDC
CBitmap cBitmap
CBitmap* pOldMemBmp = NULL
COLORREF cl
CRect cRect
UINT x, y
CRgn wndRgn, rgnTemp
//取得窗口大小
GetWindowRect(&cRect)
//背景位图资源ID
m_BackBitmapID = BackBitmapID
//装载位图
cBitmap.LoadBitmap(MaskBitmapID)
memDC.CreateCompatibleDC(pDC)
pOldMemBmp = memDC.SelectObject(&cBitmap)
//首先创建默认的完整区域为完整的窗口区域
wndRgn.CreateRectRgn(0, 0, cRect.Width(), cRect.Height())
//下面的两层循环为检查背景位图象素颜色,进行透明区域处理;
//当象素颜色为指定的透明值时,即将该点从区域中剪裁掉。
//其中用到的几个成员变量m_MaskLeftOff、m_MaskTopOff、
//m_MaskRightOff、m_MaskBottomOff、m_FrameWidth
//和m_CaptionHeight,其作用后面再作说明,此时可全部当作0来处理。
for(x= m_FrameWidth+m_MaskLeftOff
x <=cRect.Width() - m_FrameWidth-m_MaskRightOff x++){
for(y = m_CaptionHeight+m_MaskTopOff
y <=cRect.Height() - m_FrameWidth-m_MaskBottomOff y++){
//取得坐标处象素的颜色值
cl = memDC.GetPixel(x - m_FrameWidth-m_MaskLeftOff,
y - m_CaptionHeight-m_MaskTopOff)
if(col == TransColor)
{
//象素颜色为指定的透明色,创建透明“微区域”
rgnTemp.CreateRectRgn(x, y, x+1, y+1)
//“扣像”,从完整的区域中“扣除”透明的“微区域”
wndRgn.CombineRgn(&wndRgn, &rgnTemp, RGN_XOR)
//删除刚创建的透明“微区域”,释放系统资源
rgnTemp.DeleteObject()
}
}
}
if (pOldMemBmp) memDC.SelectObject(pOldMemBmp)
//用设定窗口为指定的区域
SetWindowRgn((HRGN)wndRgn, TRUE)
}
重置系统默认的背景擦除操作,即添加WM_ERASEBKGND消息处理过程,这一步可以借助ClassWizard来简化操作。
BOOL CTransDlg::OnEraseBkgnd(CDC* pDC)
{
// TODO: Add your message handler code here and/or call default
CRect rect
CDC memDC
CBitmap cBitmap
CBitmap* pOldMemBmp = NULL
GetWindowRect(&rect)
//装载背景位图
cBitmap.LoadBitmap(m_BackBitmapID)
memDC.CreateCompatibleDC(pDC)
pOldMemBmp = memDC.SelectObject(&cBitmap)
//将背景位图复制到窗口客户区
pDC->BitBlt(0, 0, rect.Width(), rect.Height(),
&memDC, 0, 0, SRCCOPY)
if (pOldMemBmp) memDC.SelectObject( pOldMemBmp )
//删除系统却省的OnEraseBkgnd功能
//return CDialog::OnEraseBkgnd(pDC)
return TRUE
}
接下来是在WM_PAINT的消息处理函数OnPaint()中添加代码。由于当背景位图比较大时,进行区域处理比较耗时,所以只在启动时进行一次处理。一种方法是OnInitDialog()处理,但这样会在从启动程序到窗口出现有相当的延迟,易引起程序尚未启动的误解。再一种方法就是在OnPaint()处理,但为了避免重复处理,可以加上一个判断标志。以下是OnPaint()的代码,正体为AppWizard生成,粗体为自己添加内容。
void CTransDlg::OnPaint()
{
if (IsIconic())
{
……
}
else
{
if(m_nFirstRun){ //首次运行标志
//修改鼠标光标为等待方式
BeginWaitCursor()
//设置背景区域
SetupRegion(GetWindowDC(),
IDB_BACKBMP,
IDB_BACKBMP,
0x00FFFFFF /*白色*/)
//恢复鼠标光标为正常模式
EndWaitCursor()
m_nFirstRun = 0
}
CDialog::OnPaint()
}
}
剩下的工作就是根据背景位图的大小来设置对话框窗口的大小和位置,这可以在OnInitDialog()中通过调用MoveWindow()来实现。再添加一些变量的声名和初始化,即可编译运行。图2为运行结果示例:
图2
4.进一步的讨论
前面实现了单一模式的异形对话框,但有些情况下又需要不同的样式,如有标题栏、边框等,或者只作局部的处理,这就是前面两个成员变量m_FrameWidth和m_CaptionHeight作用,通过在OnInitDialog()判断窗口样式,使m_FrameWidth和m_CaptionHeight取不同的值。这部分的代码为:
BOOL CTransBmpDlg::OnInitDialog()
{
……
// TODO: Add extra initialization here
m_nFirstRun = 1
//数据设置,窗口左上角坐标:m_Left=0,m_Top=0
//背景位图宽高:m_Width=535,m_Height=105
SetSize(0, 0, 535, 105)
//蒙板处理区域与窗口边框的距离
m_MaskLeftOff=m_MaskTopOff=m_MaskRightOff=m_MaskBottomOff=0
//窗口边框与标题栏象素值
m_FrameWidth = m_CaptionHeight = 0
//取得窗口样式
LONG style = ::GetWindowLong(this->m_hWnd, GWL_STYLE)
//如保留窗口风格样式,则根据不同的窗口边框类型
//选取不同的m_FrameWidth和m_CaptionHeight值,
//也可以根据处理位置的需要进行付值
if((style & WS_BORDER) == WS_BORDER)
m_FrameWidth = ::GetSystemMetrics(SM_CXBORDER)
if((style & WS_THICKFRAME) == WS_THICKFRAME)
m_FrameWidth = ::GetSystemMetrics(SM_CXFIXEDFRAME)
if((style & DS_MODALFRAME) == DS_MODALFRAME)
m_FrameWidth = ::GetSystemMetrics(SM_CXFIXEDFRAME)
if((style & WS_CAPTION) == WS_CAPTION){
m_FrameWidth = ::GetSystemMetrics(SM_CXFIXEDFRAME)
m_CaptionHeight = ::GetSystemMetrics(SM_CYSMCAPTION)
}
m_CaptionHeight += m_FrameWidth * 2
//重置窗口的位置和大小
MoveWindow(m_Left, m_Top,
m_Width + m_FrameWidth * 2,
m_Height + m_CaptionHeight, TRUE)
……
return TRUE // return TRUE unless you set the focus to a control
}
另外,为进一步增加灵活性,使窗口样式不仅仅受背景位图颜色的控制。通过指定SetupRegion()的MaskBitmapID 为一个我们称之为“蒙板”的双色位图(多色彩也可以,但一般没有必要),即可实现需要的操作。图4为在同一背景位图上,通过图3的蒙板位图实现的效果,并且增加了对话框窗体的边框和标题栏属性。
图3
图4
利用这种蒙板技术,可以创建出任意形状的窗口,而与背景位图无关。需要注意的是,对于对话框中的控件如按钮等,如处在或部分处在通明区域中,则通明区域中部分一并被剪裁掉,是否剪裁和剪裁位置与大小,利用蒙板可以很方便地进行控制。
需要特别指出的是,SetWindowRgn()所指定的区域是针对整个窗口的,而Bitblt()/ StretchBlt()的输出区域是针对于客户区,两者在定位上是不同的,编程中应加以注意并灵活应用,这也是前面之所以设置边框大小等变量的原因。
5.结束语
这种异形窗口的创建不仅适应于对话框,而且适应于所有的基于CWnd类的派生窗口。采用这一方法,你可以创建出任何只要你能够画出的窗体,实现只要可以画出,就可以做出的目标。
本文代码在Visual C++ 5.0、6.0下调试通过,运行正常,操作系统为Windows98SE。
CSS什么是样式表
CSS是Cascading Style Sheet 的缩写。译作「层叠样式表单」。是用于(增强)控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。
你可能对CSS这个名词比较陌生,实际上无论你用Internet Explorer还是
Netscape Navigator在网上冲浪,几乎随时都在与CSS打交道,在网上没有使用过CSS的网页可能不好找。不管你用什么工
具软件制作网页,都有在有意无意地使用CSS。用好CSS能使你的网页更加简炼,为什么同样内容的网页,有的人做出来有
几十KB,而高手做出来只有十几KB,CSS在其中的作用是不言而喻的。我把我在使用CSS中的一些小经验以及一些网友来信
提问的问题整理出来,供诸位参考。
1、CSS在网页制作中一般有三种方式的用法,那么具体在使用时该采用哪种用法?
当有多个网页要用到的CSS,采用外连CSS文件的方式,这样网页的代码大大减少,修改起来非常方便;只在单个网页
中使用的CSS,采用文档头部方式;只有在一个网页一、两个地方才用到的CSS,采用行内插入方式。
2、CSS的三种用法在一个网页中要以混用吗?
三种用法可以混用,且不会造成混乱。这就是它为什么称之为“层叠样式表”的原因,浏览器在显示网页时是这样处
理的:先检查有没有行内插入式CSS,有就执行了,针对本句的其它CSS就不去管它了;其次检查头部方式的CSS,有就执行
了;在前两者都没有的情况下再检查外连文件方式的CSS。因此可看出,三种CSS的执行优先级是:行内插入式、头部方
式、外连文件方式。
3、在Dreamweaver3中如何使外部文件式CSS?
在Dreamweaver3中使用外连文件式CSS并没有特殊要求,同样是用记事本创建一个*.css文件,在网页的<head>与
</head>之间加上一句这样的代码:<link rel="stylesheet" href="在这里填上你的CSS文件地址(相对路径+文件
名)" type="text/css">就行了。
4、如何用Dreamweaver3快速创建CSS外连式文件?
对于一个初接触CSS的网页设计人员来讲,要用记事之类的编辑器,去创建一个CSS外连式文件是相当困难的。由于
Dreamweaver3对CSS支持的很好,用它来帮助就轻松多了。具体可以这样操作:
1)先在纸上写好在网站的网页中可能要用到的格名称,然后在Dreamweaver3的编辑窗中调出CSS面板,一个一个地定
义,并在一个空白页上适当地写一点相关内容,边定义边试用,效果不满意,立即修改;
2)全部定义好后,再用记事本创建一个空的CSS外连式文件,把在<head>与</head>之间的那段定义好的CSS复制
到CSS文件中去,就大功告成了。整个过程就是点鼠标,方便吧?
5、在Dreamweaver3中采用行内插入式CSS要手动写代码吗?
不用!先用CSS面板定义好要用的CSS,然后,在要插入CSS的标记插入:style="",再把你刚才定义的CSS从<head>
后面拖到这个双引号中来,把花括号以外的部分删去就行了。
6、在方档头部方式和外连文件方式的CSS中都有“<!--”和“-->”,好象没什么用,不要可以吗?
这一对东东的作用是为了不引起低版本浏览器的错误。如果某个执行此页面的浏览器不支持CSS,它将忽略其中的内
容。虽然现在使用不支持CSS浏览器的人已很少了,由于互联网上几乎什么可能都会发生,所以还是留着为妙。
7、如何给一部分文字加背景色?
给文字加上不同颜色,在DW3中只要在属性面板上选取文字的颜色就行了,非常方便,但要给部分文字加不同的背景色
却没有相应的功能,我们可以先做一个定义背景色的CSS(如:bgstyle),在DW3中点几下鼠就完成了。如一个定义淡黄色
背景的CSS是这样的:
<style type="text/css">
<!--
.bgstyle { background: #FFFFCC}
-->
</style>
在要用时选取那段文字,再在CSS面板上点一下“bgstyle”就行了。
8、如何给部分文字加背景图像?
与加背景色操作类似,中是在背景在选择加载图象就是了,一个定义好的加背景图象的CSS例子的代码是这样的:
<style type="text/css">
<!--
.imgbgstyle { background-image: url(/logo.gif)}
-->
</style>
在要用时选取那段文字,再在CSS面板上点一下“imgbgstyle”就行了。
9、如何使页面的背景在文字“滚动”时背景图案静止不动?
要使背景图案不随文字“滚动”的CSS是这样的:
<style type="text/css">
<!--
BODY { background: purple url(/bg.jpg)
background-repeat:repeat-y
background-attachment:fixed
}
-->
</style>
10、如何定义字间距?
在DW3中CSS的属性定义对话框(style Definition for .style1)的“Block”上的“letter spaceing”属性定义的就
是字间距,它指的是每一个字符之间的额外间距,经长度为单位,正负值均可,当取负值时产生字符挤在一起的效果。下
面代码是一个定义好的字间距CSS例子:
<style type="text/css">
<!--
.style1 { letter-spacing: 3px}
-->
</style>
11、如何给文字加上划线、下划线、删除线和闪烁?
在DW3中CSS的属性定义对话框(style Definition for .style1)的“Type”上的“decoration”属性定义的就是这些
内容,要注意的是闪烁属性有些版本的浏览器不支持,少用为好。下面是一个定义好上述效果的CSS例子:
<style type="text/css">
<!--
.style1 { text-decoration: underline overline line-through blink}
-->
</style>
其中: “underline”是定义下划线;“overline ”是定义上划线;“ line-through”定义的是删除线;“blink”
定义的是文字闪烁。
12、如何使网页具有“首行缩进”功能?
由于DW3输入空格不方便,利用“首行缩进”将弥补这个不足。在DW3中CSS的属性定义对话框(style Definition
for .style1)的“Block”上的“text-indent”属性定义的就是“首行缩进”,所谓“首行”是指每段内容的第一行,也
就是直接按回车键就形成了一个新的段落。缩进最好以“em”(字符)为单位,比如:汉字编排要求每段开始缩进两个汉
字,设置好的CSS如下所示:
<style type="text/css">
<!--
.style1 { text-indent: 2em}
-->
</style>
在DW3要注意:在DW3中CSS的属性定义对话框(style Definition for .style1)的“Block”上的“text-indent”右
面的缩进单位选择框中“ems”指的就是“em”。
13、在用表格进行排版时,能使某一方向上的内容离开表格线一点吗?
可以!在DW3中CSS的属性定义对话框(style Definition for .style1)的“Box”上的“margin”定义的就是内容离
开边缘的距离,分别可定义四个方向:“top”“bottom”“left”“right”。下面就是定义在左边离开“10px”的CSS例
子代码:
<style type="text/css">
<!--
.style1 { margin: 0px 0px 0px 10px}
-->
</style>
14、能给某部分内容加边框吗?
用CSS可以给某部分内容加边框,在DW3中CSS的属性定义对话框(style Definition for .style1)的“Border”定义
的就是边框线,“top”“bottom”“left”“right”四边可分别定义线的粗细和颜色,这些定义好后不要忘记在下面的
“style”中定义线型,否则将看不边框线,因为默认的线型是“none”。下面是一个定义了上边框为:蓝色细线;左边框
为:绿色中粗线的CSS例子:
<style type="text/css">
<!--
.style1 { border: solidborder-width: thin 0px 0px mediumborder-color: #0000FF black black #00FF00}
-->
参考资料:http://zhidao.baidu.com/question/8267352.html
想学的话,可以看看这个
www.xhtmlhelp.net