漂亮用户界面设计.docVIP

漂亮用户界面设计（一） 作者：李永红 任何软件系统都有一个相互交互的信息平台，为客户提供一个良好的用户界面对客户来讲是一种享受，也是一个优秀软件设计师的职责所在，如何设计漂亮的用户界面需要掌握PhotoShop、VC＋＋编程等技术。 用PhotoShop绘制用户界面 用PhotoShop绘制用户界面，主要利用PhotoShop中渐变叠加、图形设计分层、添加效果、钢笔等工具。 在PhotoShop中用钢笔勾出图形界面外观轮廓 新建图层，同时按下“Ctrl”+”Enter”键 双击图层，建立图层效果 按住”Ctrl”，同时用鼠标左键单击图层载入选区，利用选取重合获得标题选区 新建选区，并对该图层添加效果 输入文字 选择合适的图标，随后将图形存储为位图 程序设计 利用AppWizard建立一个基于对话框的工程文件 在对话框初始代码中调用位图 m_skin.m_hObject=LoadImage(NULL,Skin/hello_skin.bmp,IMAGE_BITMAP,0,0,LR_LOADFROMFILE); CClientDC dc(this); if(m_memDc.m_hDC == NULL) m_memDc.CreateCompatibleDC(dc); CRgn m_WRgn1,m_WRgn2 ; CRect r1,r2; m_WRgn1.CreateRoundRectRgn(43,31,771,369,65,65); m_WRgn2.CreateRectRgn(43,31,770,100); m_WRgn1.CombineRgn(m_WRgn1,m_WRgn2,RGN_OR); SetWindowRgn(HRGN(m_WRgn1),TRUE); 在OnPaint函数中绘制整个界面 CPaintDC dc(this); // device context for painting BITMAP bmap; m_skin.GetObject(sizeof(BITMAP),bmap); m_memDc.SelectObject(m_skin); dc.BitBlt(0,0,bmap.bmWidth,bmap.bmHeight,m_memDc,0,0,SRCCOPY); CDialog::OnPaint(); 程序最终运行结果 漂亮用户界面设计（二） 利用PhotoShop绘制出两幅图形界面，一副为正常情况下的界面，一副为按下时候的界面 程序设计 利用AppWizard建立一个基于Dialog的工程 将两幅位图导入到工程文件中 在OnInitDialog()中初始化位图和背景刷 bmpmaindlg.LoadBitmap(IDB_SKIN); m_Brush.CreatePatternBrush(bmpmaindlg); 定义每个按钮所在的矩形坐标 rc[0].SetRect(151,288,300,356); //ok rc[1].SetRect(435,287,587,353); //cancel rc[2].SetRect(588,1,642,26); //min rc[3].SetRect(647,1,697,26); //max rc[4].SetRect(703,1,747,26); //close 在OnCtlColor（）中将返回的画刷改为我们建立的画刷，调整窗口大小，将窗口显示为相应的位图。 下面重点处理OnMouseMove()，实现画面相应位置的切换，并记录按钮的功能选项 int No=0; CWindowDC WindowDC(this); CDC memDC; CBitmap *pOldBitmap,bmpLoad; memDC.CreateCompatibleDC(WindowDC); for(No=0;No5;No++) { if(rc[No].PtInRect(point)) { CurrentSel=No; break; } } if(No==5) { if(CurrentSel!=-1) { bmpLoad.LoadBitmap(IDB_SKIN); pOldBitmap=memDC.SelectObject(bmpLoad); WindowDC.BitBlt(rc[CurrentSel].left,rc[CurrentSel].top,rc[CurrentSel].right-rc[CurrentSel].left,rc[CurrentSel].bottom-rc[CurrentSel].top, memDC,r