第二章-VC绘图基础

1、第二章 Visual C+ 6.0绘图基础,基于MFC的图形编程,2.1 windows图形系统,2.1.1 概述 在Window环境中，图形设备接口（Graphical Device Interface, GDI）与设备驱动程序实现了设备无关性的图形。 GDI是Windows用来管理图形操作的一个与设备无关的模块，提供了许多有关图形操作的API函数。,2.1.2 设备环境类 为了实现设备无关性，Windows提供了设备环境DC（Device Context）又称设备上下文，也称设备描述表。 DC实际上是一种数据结构，是GDI的一部分。 用户在绘图之前，必须获取窗口区域的一个设备环境DC。接着

2、才能进行GDI函数的调用，执行适合于设备环境DC的命令。,2.1 windows图形系统,2.1.3 微软基类库MFC： 以C+形式封装的Windows API（Application Program Interface），包含了一百多个已经定义好的常用类。 类库中提供了设备环境类CDC，CDC封装了Windows的DC，其父类是CObject。 CDC的派生类有：CClientDC、CPaintDC、CMetafileDC和CWindowDC.,2.1 windows图形系统,2.1 windows图形系统,CWindowDC类与CPaintDC和CClientDC类的区别：,用CPaint

3、DC类和CClientDC类的对象绘制图形时，绘制区只能是客户区，而不能在非客户区，而CWindowsDC可以在非客户区进行图形绘制。 CWindowsDC一般在框架窗口类中（CMainFrame）引用，在视图窗口中引用CwindowsDC类时，由于视图类只能管理客户区，所以并不能在非客户区进行绘制。 在CWindowsDC绘图类下，坐标系是建立在整个屏幕上的，在像素坐标方式下，坐标原点在屏幕的左上角，而在CPaintDC和CClientDC绘图类下，坐标系是建立在客户区上的，在像素坐标方式下，坐标原点在客户区的左上角。,2.1 windows图形系统,CPaintDC类应用在OnPaint函

4、数中，以响应Windows的WM_PAINT消息。而CClientDC应用在非响应消息WM_PAINT的情况。 CPaintDC类响应WM_PAINT消息，自动完成绘制，这对维护图形的完整性有着重要的作用。 例如在一个窗口中，已经绘制了n条直线，这个窗口的完整性可能会被破坏（如被对话框覆盖），当破坏完整性的程序结束时，这个窗口就会接受到一个WM_PAINT消息，得到此消息后，激活消息处理函数（如OnPaint）进行窗口绘制。如果现在想在屏幕上再绘制一条直线，就要用到CClientDC类，这个类可以实时的将图形绘制在屏幕上。,2.1 windows图形系统,1. 启动VC+6.0, 从File菜

5、单中选择New选项, 并在对话框中，选择Projects标签，然后单击MFC AppWizard(exe)。在Location域中输入一个合适的路径名或单击Browse按钮来选择一个。在Project name中输入test作为项目名称。,2.2 MFC上机步骤,2.2 MFC上机步骤,单击OK按钮,打开MFC AppWizard-Step1对话框。这个对话框用于选择应用程序的基本结构，我们在单选框中选择Single document,表示选择单文档界面。,2.2 MFC上机步骤,单击Next按钮，打开MFC AppWizard-Step2 of 6对话框。该对话框用于选择数据库支持环境，本例

6、中我们选择None, 表示不需要任何数据库支持。,2.2 MFC上机步骤,单击Finish按钮，弹出New Project Information 对话框,2.2 MFC上机步骤,单击OK按钮，MFC AppWizard自动生成为程序生成所需的开始文件，并自动在项目工作区打开新项目,2.2 MFC上机步骤,从【ClassView】面板可以看出 CTestApp是应用的主函数类，用来处理消息。 MFC中的数据是存储在CTestDoc类文档中 结果的显示是在CTestView类中 文档类负责管理和维护数据本身 视图类负责处理用户鼠标和键盘的操作,2.2 MFC上机步骤,运行程序，选择Build 菜

7、单下的!Executive test.exe,2.2 MFC上机步骤,2.2.1. CDC类对象的使用方式： 在视图类的OnDraw成员函数中使用 在视图内绘图最常用的是使用OnDraw函数。该函数是Cview类中的一个虚函数，每次当视图需要重新绘制时，应用程序框架都会自动调用OnDraw函数。当用户改变了窗口尺寸，或者当窗口恢复了先前被遮盖的部分，或者当应用程序改变了窗口数据时，应用程序框架都会自动调用OnDraw函数。 void CTestView:OnDraw(CDC* pDC) CPixelDoc* pDoc = GetDocument(); ASSERT_VALID(pDoc); /

8、 TODO: add draw code for native data here pDC-Ellipse(30,30,100,100); ,2.2 CDC类的绘图成员函数,pDoc通过GetDocument()函数得到了指向文档类CTestDoc的指针。,pDC定义为CDC类的指针。使用pDC指针，可以对CDC类的成员函数进行操作。,ASSERT_VALID(pDoc)函数使pDoc指针有效。,2. 在视图窗口以外的窗口中使用 窗口类提供WM_PANT消息响应函数OnPaint,以便绘制或重绘，还必须使用CPaintDC 派生类对象。在使用OnPaint后，OnDraw失效。 void CT

9、estView:OnPaint() CPaintDC dc(this); / 定义了一个对象dc / TODO: Add your message handler code here dc.TextOut(0,0,在OnPaint函数中使用); dc.Ellipse(20,20,100,100); / Do not call CView:OnPaint() for painting messages ,2.2 CDC类的绘图成员函数,3. 在OnDraw与OnPaint以外的消息响应函数中使用 必须使用CClientDC派生类对象，如果函数在支持滚动的视窗中使用，还需调用CscrollView

10、:OnPrepareDC函数。 void CMainFrame:On32771() /菜单命令响应函数 / TODO: Add your command handler code here CClientDC dc(this); dc.TextOut(200,100,在菜单命令消息响应函数中使用); dc.Ellipse(100,200,200,300); ,2.2 CDC类的绘图成员函数,2.2.2 绘图函数 1.点 调用CDC类成员函数SetPixel 可以绘制一个点，调用GetPixel可以获取点的颜色。 COLORREF SetPixel(int x ,int y ,COLORREF

11、crColor); COLORREF SetPixel(POINT point ,COLORREF crColor); COLORREF GetPixel(int x ,int y ) const; COLORREF GetPixel(POINT point ,) const;,2.2 CDC类的绘图成员函数,32位的COLORREF类型值来确定图形颜色值，其结构为0 x00bbggrr， bb:代表蓝色值，范围从00到FF; gg:代表绿色值，范围从00到FF; rr:代表红色值，范围从00到FF; 还可以用RGB宏来完成相同的功能： RGB(short red ,short green,

12、short blue) red 代表红色值，范围从0到255； green代表绿色值，范围从0到255； blue代表蓝色值，范围从0到255；,2.2 CDC类的绘图成员函数,void CTestView:OnDraw(CDC* pDC) CPixelDoc* pDoc = GetDocument(); ASSERT_VALID(pDoc); for(int i=0;iSetPixel(1*i,50,RGB(0,0,255); for(int j=0;jSetPixel(2*j,100,(COLORREF)0 x0000ff00); for(int p=0;pSetPixel(5*p,250

13、,(COLORREF)0 x00ff00ff); ,2.2 CDC类的绘图成员函数,2. 直线 CPoint MoveTo(int x,int y); CPoint MoveTo(POINT point); BOOL LineTo(int x,int y); BOOL LineTo(POINT point); MoveTo移动坐标到当前点 LineTo从当前点到终点画一条直线,2.2 CDC类的绘图成员函数,void CTestView:OnDraw(CDC* pDC) CTestDoc* pDoc = GetDocument(); ASSERT_VALID(pDoc); / TODO: ad

14、d draw code for native data here pDC-MoveTo(30,30); pDC-LineTo(200,300); ,2.2 CDC类的绘图成员函数,3. 弧 BOOL Arc(int x1,int y1,int x2,int y2,int x3,int y3, int x4,int y4); BOOL Arc(LPCRECT lpRect,POINT ptStart,POINT ptEnd); BOOL ArcTo(int x1,int y1,int x2,int y2,int x3,int y3,int x4,int y4); BOOL ArcTo(LPCRE

15、CT lpRect,POINT ptStart,POINT ptEnd); x1,y1, x2,y2 : 边界矩形左上角和右下角坐标 x3,y3, x4,y4 :弧线起点和终点坐标 lpRect:指定边界矩形 ptStart:指定弧线起点 ptEnd:指定弧线终点,2.2 CDC类的绘图成员函数,void CTestView:OnDraw(CDC* pDC) CTestDoc* pDoc = GetDocument(); ASSERT_VALID(pDoc); / TODO: add draw code for native data here pDC-Arc(50,50,200,150,10

16、,30,500,200); ,2.2 CDC类的绘图成员函数,void CTestView:OnDraw(CDC* pDC) CTestDoc* pDoc = GetDocument(); ASSERT_VALID(pDoc); / TODO: add draw code for native data here CRect rect(45,25,85,150); CPoint pt1,pt2; pt1.x=5;pt1.y=5; pt2.x=250;pt2.y=30; pDC-ArcTo(rect,pt1,pt2); ,2.2 CDC类的绘图成员函数,4. 折线 BOOL Polyline(L

17、PPOINT lpPoints,int nCount) BOOL PolylineTo(const POINT *lpPoints,int nCount) lpPoints:指定折线的各个顶点坐标 nCount: 指定顶点的数目,2.2 CDC类的绘图成员函数,5. 矩形 BOOL Rectangle(int x1,int y1,int x2,int y2); BOOL Rectangle(LPCRECT lpRect); BOOL RoundRect(int x1,int y1,int x2,int y2,int x3,int y3); BOOL RoundRect(LPCRECT lpRe

18、ct,POINT point); RoundRect:绘制圆角矩形 x3,y3,point :矩形圆角椭圆的宽度和高度,2.2 CDC类的绘图成员函数,void CTestView:OnDraw(CDC* pDC) CTestDoc* pDoc = GetDocument(); ASSERT_VALID(pDoc); / TODO: add draw code for native data here pDC-Rectangle(20,20,100,60); pDC-RoundRect(150,20,200,150,20,15); ,2.2 CDC类的绘图成员函数,6. 椭圆 BOOL Ell

19、ipse(int x1,int y1,int x2,int y2); BOOL Ellipse(LPCRECT lpRect); 7. 扇形 BOOL Pie(int x1,int y1,int x2,int y2,int x3,int y3); BOOL Pie(LPCRECT lpRect,POINT ptStart,POINT ptEnd); 8. 多边形 BOOL Polygon(LPPOINT lpPoints,int nCount);,2.2 CDC类的绘图成员函数,void CTestView:OnDraw(CDC* pDC) CTestDoc* pDoc = GetDocume

20、nt(); ASSERT_VALID(pDoc); / TODO: add draw code for native data here pDC-Ellipse(20,70,140,150); CRect rect(250,150,300,100); CPoint pt1,pt2; pt1.x=250;pt1.y=20; pt2.x=300;pt2.y=100; pDC-Pie(rect,pt1,pt2); CPoint p1(340,20); CPoint p2(320,80); CPoint p3(350,120); CPoint p4(420,100); CPoint p5(400,20

21、); CPoint p5=p1,p2,p3,p4,p5; pDC-Polygon(p,5); ,2.3 绘图工具类,CBitmap类:用于管理、绘制位图资源的类。 CPen：用于管理线条绘制的类，通过Cpen类对象，可以设置绘图时的线型、线条宽度、颜色等属性。 CBrush：定义了画刷，通过Cbrush对象，可以设置绘制封闭图形的填充色、填充模式等属性。 Cpalette：该类用于管理应用程序的调色板，使应用程序的调色板与其他应用程序不干扰。 CRgn：该类定义了区域，区域是由一个或多个封闭几何体构成的一个范围，来进行填充、鼠标测试等工作。 Cfont：该类用于管理字体，设置绘制文本的字体大小

22、、字体样式等属性。,2.3.1 画笔与画刷 画笔是一种用来画线及绘制有形边框的工具，用户可以指定它的颜色及厚度，并且可以指定它画实线、点线或虚线。 画刷是用来填充封闭图形的。 通过调用SelectStockObject选择库存画笔或库存画刷。 1. Windows提供的个库存画笔： BLACK_PEN:黑色画笔 NULL_PEN:空画笔 WHITE_PEN:白色画笔,2.3 绘图工具类,2. Windows提供的个库存画刷： BLACK_BRUSH:黑色画刷 DKGRAY_BRUSH:深灰色画刷 GRAY_BRUSH:灰色画刷 HOLLOW_BRUSH:透明窗口画刷 LTGRAY_BRUSH:

23、浅灰色画刷 NULL_BRUSH:空画刷 WHITE_BRUSH:白色画刷子,2.3 绘图工具类,void CHelloView:OnDraw(CDC* pDC) CHelloDoc* pDoc = GetDocument(); ASSERT_VALID(pDoc); CRect rect1(20,20,320,220); CRect rect2(95,95,245,195); CPoint pt; pt.x=pt.y=10; CBrush *pBrush=(CBrush*) pDC-SelectStockObject(GRAY_BRUSH); pDC-RoundRect(rect1,pt);

24、 CPen *pPen=(CPen*) pDC-SelectStockObject(WHITE_PEN); pDC-RoundRect(rect2,pt); pDC-SelectObject(pPen);/恢复画笔 pDC-SelectObject(pBrush);/恢复画刷 ,3.自定义画笔 调用CPen 类成员函数CPen、CreatePen、CreatePenIndirect可以创建画笔。 CPen(int nPenStyle,int nWidth,COLORREF crColor); BOOL CreatePen(int nPenStyle,int nWidth,COLORREF cr

25、Color); BOOL CreatePenIndirect(LPLOGPEN lpLogPen);,2.3 绘图工具类,nPenStyle:设置画笔的样式。常用样式如下： PS_SOLID:实线画笔。 PS_DASH：虚线画笔，仅当线宽为1时有效。 PS_DOT：点线画笔，仅当线宽为1时有效。 PS_DASHDOT:点划线画笔，仅当线宽为1时有效。 PS_DASHDOTDOT:双点划线画笔，线宽为1时有效 PS_NULL: 空笔不划线。 nWidth :指定画笔宽度。,2.3 绘图工具类,lpLogPen:指向包含画笔信息的LOGPEN结构变量。 LOGPEN结构定义如下： typedef

26、struct tagLOGPEN UNIT lopnStyle; /设置画笔的样式 POINT lopnWidth; /设置画笔的宽度 COLORREF lopnColor; /设置画笔的颜色 LOGPEN;,2.3 绘图工具类,void CTestView:OnDraw(CDC* pDC) CTestDoc* pDoc = GetDocument(); ASSERT_VALID(pDoc); / TODO: add draw code for native data here CPen NewPen(PS_SOLID,5,RGB(0,0,255); CPen *pOldPen=pDC-Sel

27、ectObject( ,4. 自定义画刷 调用CBrush类成员函数CBrush、CreateSolidBush、CreateHatchBrush、CreatePatternBrush和CreateBrushIndirect 等可以创建画刷。 CBrush(COLORREF crColor); CBrush(int nIndex,COLORREF crColor); BOOL CreateSolidBrush(COLORREF crColor); BOOL CreateHatchBrush(int nIndex,COLORREF crColor); BOOL CreatePatternBrus

28、h(CBitmap *pBitmap); BOOL CreateBrushIndirect(const LOGBRUSH* lpLogBrush);,2.3 绘图工具类,nIndex:指定图案的模式。可供选择的模式如下： HS_BDIAGONAL:从左到右向下成45度的对角线。 HS_CROSS：水平线和垂直线相交的十字交叉线。 HS_DIAGCROSS：夹角为45度的斜十字交叉线。 HS_FDIAGONAL:从左到右向上成45度的对角线。 HS_HORIZONAL:水平阴影线。 HS_VERTICAL: 垂直阴影线。 pBitmap：指定位图对象 lpLogBrush：指向包含画刷信息的LO

29、GBRUSH结构变量,2.3 绘图工具类,void CTestView:OnDraw(CDC* pDC) CTestDoc* pDoc = GetDocument(); ASSERT_VALID(pDoc); / TODO: add draw code for native data here CBrush NewBrush1(RGB(0,255,0); CBrush *pOldBrush1=pDC-SelectObject( ,2.3 绘图工具类,2.3.2 填充函数 .绘制矩形边框 void FrameRect(LPCRECT lpRect,CBrush* pBrush); 2. 用画刷子

30、填充矩形区域 void FillRect(LPCRECT lpRect,CBrush* pBrush); .用指定颜色填充矩形区域 void FillSolidRect(LPCRECT lpRect,COLORREF clr); void FillSolidRect(int x int y,int cx,int cy,COLORREF clr); 4. 用当前颜色的相反色填充 void InvertRect(LPCRECT lpRect);,2.3 绘图工具类,void CTestView:OnDraw(CDC* pDC) CTestDoc* pDoc = GetDocument(); ASS

31、ERT_VALID(pDoc); CRect rect1(50,50,150,100); CRect rect2(160,50,260,100); CRect rect3(50,110,150,160); CRect rect4(160,110,260,160); CBrush brush1(RGB(0,0,255); CBrush brush2(RGB(255,0,0); pDC-FillRect(rect1, ,2.4 DC的调用和释放,在VC+程序中输出图形和文本时，如果不在OnDraw函数中输出，则需要设置输出对象的设备上下文，然后才能调用相应的CDC类的成员函数，最后还需要保证将设备

32、上下文释放给Windows，恢复原来的状态以备下次调用。 2.4.1 调用设备上下文 CDC* GetDC( ); 返回值：指定的客户区设备上下文指针。 2.4.2释放设备上下文 int ReleaseDC(CDC* pDC);,2.5 坐标系统,2.5.1 设备坐标与逻辑坐标 设备坐标也称为物理坐标，是指输出设备上的坐标。屏幕上的设备坐标原点在屏幕的左上角，X轴方向向右，Y轴方向向下，单位为1像素。 逻辑坐标是系统用作记录的坐标，坐标原点、X轴、Y轴方向是由其使用的坐标模式决定的。 逻辑坐标与设备坐标往往是不一致的。 在VC+6.0中，鼠标光标的坐标是屏幕坐标，而所有的GDI绘图函数都使用逻

33、辑坐标。,2.5 坐标系统,设备坐标与逻辑坐标的转换函数： void DPtoLP(LPPOINT lpPoints,int nCount=1) const void DPtoLP(LPRECT lpRect) const void DPtoLP(LPSIZE lpSize) const void LPtoDP(LPPOINT lpPoints,int nCount=1) const void LPtoDP(LPRECT lpRect) const void LPtoDP(LPSIZE lpSize) const lpPoints:指向POINT结构或CPoint对象的数组； nCount:数

34、组中的点数； lpRect:指定进行坐标转换的矩形区域； lpSize指向SIZE结构或CSize对象,2.5 坐标系统,2.5.2 映射模式 映射模式也称为坐标模式，用于定义图形方式、文本的单位和坐标增长方式。 1. 指定新的映射模式 virtual int SetMapMode(int nMapMode); 2. 获取的映射模式 int GetMapMode() const;,2.5 坐标系统,2.5 坐标系统,2.5 坐标系统,2.5.3 视区与逻辑窗口 视区是应用程序窗口的有效输出区域，使用设备坐标，为了在视区内能使用GDI输出函数，还要在视区上设置逻辑窗口。 设置视区 virtual

35、 Csize SetViewportExt(int cx,int cy); virtual Csize SetViewportExt(SIZE size); virtual CPoint SetViewportOrg(int x,int y); virtual CPoint SetViewportOrg(POINT point);,2. 设置逻辑窗口 virtual Csize SetWindowExt(int cx,int cy); virtual Csize SetWindowExt(SIZE size); CPoint SetWindowOrg(int x,int y); CPoint

36、SetWindowOrg(POINT point); cx,cy:指定视区或窗口的X轴和Y轴范围 size:指定视区或窗口的范围 x,y:指定视区或窗口的原点 point:指定视区或窗口的原点,2.5 坐标系统,2.5 坐标系统,#include void CTestView:OnDraw(CDC*pDC) CRect rect; GetClientRect(,2.5 坐标系统,for(int i=0;iLineTo(i,j); pDC-SelectObject(pOld); ,2.6 交互设计,2.6.1菜单设计 1. 在工作区的Resource View标签中，单击Menu项左边“+”，然后双击其子项IDR_MAINFRAME. 2. 双击右边空白菜单，在Caption文本框中输入菜单名称，设计主菜单。 3.双击主菜单下面出现的空白子菜单，输入菜单项标题和ID 4.添加消息处理函