第五讲 24点游戏界面设计.doc

第五讲 “24点游”戏界面设计静态文本一、创建一个基于Dialog的MFC（exe）应用程序，然后在Dialog界面上进行界面设计，界面的资源包括：菜单Menu、位图（扑克牌）BitMap、按钮Button、组合框ComboBox、列表框List、进度条Progress、编辑框TexField、静态文本Label. 如下图所示：菜单进度条位图组合框列表二、各控件的ID及对应绑定的变量按照表1及表2给出的值进行设置。表1 对话框控件属性表控件属性设置控件属性设置 按钮ID标题IDC_START发牌静态文本ID标题IDC_STATIC难度级别按钮ID标题IDC_INPUT输入算式静态文本ID标题IDC_STATIC耗时标识按钮ID标题IDC_CALC验算静态文本ID标题IDC_STATIC当前得分：按钮ID标题IDC_OK结束游戏静态文本ID标题IDC_DIVID历史纪录：编辑框ID类型（Style）IDC_EDIT1只读静态文本ID标题IDC_CUR_SCORE无组合框ID类型（Style）IDC_COMBO默认列表框控件ID类型(Style)IDC_LISTReport进度条ID 类型(Style)IDC_PROGRESS水平方向表2 需要添加的与控件绑定成员变量控件ID变量名变量类型IDC_EDIT1m_inputCEditIDC_EDIT1m_inputsCStringIDC_LISTm_listCListCtrlIDC_COMBOm_comboCComboBoxIDC_PROGRESSm_progressCProgressCtrl三、对话框上的菜单资源及ID见表3所示。表3 菜单资源表菜单标题子菜单项标题标识符ID游戏开始&S结束&EIDC_START IDCCANCEL帮助关于&Point24IDC_ABOUT四、几个重要控件的加载的步骤提示1、组合框IDC_COMBO界面设计：首先在界面上画出ComboBox控件，然后在右键菜单-属性里设置ID，在Data选项卡设置内容“高级”、“中级”、“低级”换行时用Ctrl+Enter ; 设置变量：右键菜单-Class Wizard中设置变量m_combo设置默认选定条目：最后在Dlg的OnInitDialog( )函数中加入代码： m_combo.SetCurSel(0);2、进度条IDC_PROGRESS界面设计：首先在界面上画出Progress控件，然后在右键菜单-属性里设置ID；设置变量：右键菜单-Class Wizard中设置变量m_progress设置定时器：菜单“查看”-建立类向导-Message Maps-Messages，选择WM_TIMER消息双击，添加消息映射函数OnTimer( ),单击EditCode按钮，在OnTimer ( )函数中添加代码，m_progress.StepIt( );/使进度条前进一个步长；初始化Dlg：最后在Dlg的OnInitDialog( )函数中加入代码： m_progress.SetRange(0,100);/设置进度条的范围 m_progress.SetStep(10);/设置进度条的步长 m_progress.SetPos(0);/设置进度条起始位置 SetTimer(1,1000,NULL);/启动计时器 3、列表框IDC_LIST1）、CListControl控件图1红圈所标示图12）、设置CListControl控件的属性在该控件上单击右键-属性-Generral选项卡中，设置ID号为IDC_LIST，如图2示图2在该控件上单击右键-属性-Styles选项卡中，设置”查看”方式为Report，如图3所示图33）、为控件绑定对应的变量m_list在该控件上单击右键-建立类向导-Member Variables-Control IDs选中IDC_LIST双击，如图4所示图44）、为控件设置属性和列名BOOL CP2Dlg:OnInitDialog() /设置列表框列属性LV_COLUMN lvColumn;lvColumn.mask = LVCF_FMT | LVCF_WIDTH | LVCF_TEXT | LVCF_SUBITEM;lvColumn.fmt = LVCFMT_CENTER;lvColumn.cx = 52;/设置列表框列标题lvColumn.iSubItem = 0;lvColumn.pszText = 题数;m_list.InsertColumn(0, &lvColumn);lvColumn.iSubItem = 1;lvColumn.pszText = 对错;m_list.InsertColumn(1, &lvColumn); return TRUE; / return TRUE unless you set the focus to a control5）、该控件已经添加完毕，可以编译运行，查看运行效果。4、扑克牌位图图像的加载主要步骤如下：1、 在资源视图中创建位图资源文件夹如图5示，在红色方框所示的资源文件夹上单击右键-Insert-图5弹出插入资源对话框，如图6所示，图7选择Bitmap，单击“N新建”按钮，在工程的资源选项卡会增加在Bitmap资源2、 向位图资源（Bitmap）文件夹导入已有扑克牌图片选中Bitmap文件夹单击右键- Import-选中已知Bmp图片(扑克牌)图8插入扑克牌后的Bitmap文件夹如图8中左边的红框所示。3、 在代码中显示已加载的位图在对话框类的OnPaint( )函数中实现位图显示的代码，红色字体为加载四张扑克牌位图图片的代码,其他代码是系统自动生成的。void CP2Dlg:OnPaint() CPaintDC pDC(this); / device context for paintingif (IsIconic()CPaintDC dc(this); / device context for paintingSendMessage(WM_ICONERASEBKGND, (WPARAM) dc.GetSafeHdc(), 0);/ Center icon in client rectangleint cxIcon = GetSystemMetrics(SM_CXICON);int cyIcon = GetSystemMetrics(SM_CYICON);CRect rect;GetClientRect(&rect);int x = (rect.Width() - cxIcon + 1) / 2;int y = (rect.Height() - cyIcon + 1) / 2;/ Draw the icondc.DrawIcon(x, y, m_hIcon);else CBitmap b1,b2,b3,b4,*OldBitmap; CDC dcMem; /第一张图片 b1.LoadBitmap(IDB_BITMAP2);dcMem.CreateCompatibleDC(&pDC); OldBitmap=dcMem.SelectObject(&b1); pDC.BitBlt(20,20,70,95,&dcMem,0,0,SRCCOPY);dcMem.SelectObject(OldBitmap); DeleteObject(&b1); /第二张图片 b2.LoadBitmap(IDB_BITMAP3); OldBitmap=dcMem.SelectObject(&b2); pDC.BitBlt(100,20,70,95,&dcMem,0,0,SRCCOPY);dcMem.SelectObject(OldBitmap); DeleteObject(&b2);/第三张图片 b3.LoadBitmap(IDB_BITMAP4); OldBitmap=dcMem.SelectObject(&b3); pDC.BitBlt(180,20,70,95,&dcMem,0,0,SRCCOPY);dcMem.SelectObject(OldBitmap); DeleteObject(&b3); /第四张图片b4.LoadBitmap(IDB_BITMAP5); OldBitmap=dcMem.SelectObject(&b4); pDC.BitBlt(260,20,70,95,&dcMem,0,0,SRCCOPY); dcMem.SelectObject(OldBitmap);DeleteObject(&b4); dcMem.DeleteDC();CDialog:OnPaint();5、设置对话框的背景颜色为绿色对话框