wxWidgets开发简单的计算器程序-《跟我学wxWidgets开发》系列教程

第四章简单计算器程序
 
从这一章起,我们开始正式进入通过实践程序来学习wxWidgets的使用开发。
本章我们学习的是一个简单的计算器程序,通过这个程序,我们可以掌握以下几个知识点:
⑴基于wxDialog的对话框程序开发
⑵wxSizer等窗口布局的方法
⑶控件遍历的方法
⑷事件的响应方法
⑸wxString基本处理方法
⑹wxString和double类型之间的转换
 
程序结果预览:
 

计算器程序运行图
 
代码我已经放到Google Code上了,项目地址是:http://code.google.com/p/wxcalculator/,你可以在项目的Downloads下找到整个工程的源代码。
 
4.1开发过程

下面我来具体的介绍一下这个系统的开发过程。
 
首先,我们做一个计算器,在脑海里的第一反应最杂的地方肯定是计算器的键盘了,所以首先考虑的就是如何实现计算器的键盘。对于这个项目,我想到有两种可行方案:

  • 手动方式通过界面设计工具拖放控件
  • 通过程序方式,动态添加控件

因为程序比较简单,键盘并不太复杂,然后为了让教程简单化,我最终采取了第一种方案。
决定了方案之后,那么我们开始动手:                                                              
4.1.1 工程建立
打开CodeBlocks,按照本教程3.2章节新建一个wxWidgets工程,工程类型依然选择wxDialog类型。
 
初始工程预览图(等待截图)
 
4.1.2 整体布局设计
在开始设计之前,我先普及一下wxWidgets程序界面的最基本层次布局知识:首先最底层的是窗体(wxDialog和wxFrame),然后是布局容器(wxSizer系列包括wxBoxSizer,wxGridSizer等),然后是各种控件,其中有一个类似窗体的容器(wxPanel),它可以放在wxSizer中,但它自身内部又需要wxSizer来容纳各种其他控件。另外,布局容器wxSizer下可以嵌套自己。总的来说,层次可以用下面的示意图说明:

对基本的布局层次有了了解之后,我们就开始从上而下的设计界面了。从上面的程序运行效果图里看到,我们这个计算器从大的布局来说,是分成了一个垂直排布的3个区块,所以一开始我们在wxDialog下加入wxBoxSizer,并将wxSizer的方向属性Orientation改为wxVERTICAL。然后我们在wxBoxSizer中依次加入wxBoxSizer、wxStaticBoxSizer、wxPanel。这样整个程序的大布局算完成了。
3.设计单元布局
接下来我们进行的是单元布局,即从上而下一个一个小布局地分开设计。
最上面,我们在wxBoxSizer中加入一个wxTextCtrl作为计算器显示屏。
中间部分,我们是为了一个小小的显示选项而设计的,加入3个wxRadioButton。
最下面,是设计中最为复杂的一部分——键盘设计。这个地方实际上既需要有均匀布局的1-9数字键位,又需要有不均匀的+、-、*、/、=功能键位,所以我们要用到3种布局容器:wxBoxSizer、wxGridBagSizer、wxGridSizer。最外层我们加入不规则的wxGridBagSizer,然后在wxGridBagSizer中加入一个wxGridSizer作为存放均匀布局键位的容器,其他地方刚用wxBoxSizer进行灵活补充。
作好整体布局后,我们只需在wxSizer中加入我们想加入的控件即可完成整个程序的界面布局了,至于wxSizer的一些对齐和间隔调整,我希望大家本着研究的精神,对照原程序代码,自己进行摸索吧!我相信只有这样自己多动手,大家才能收获得更多。
 
设计完成之后,我们可以在程序的构造函数下看到设计所产生的代码:
 
接下来,我们开始对整个程序流程进行设计:

最终,实现代码如下:

代码等待编辑



郑重声明:
除特别声明为转载内容外,本站所有内容均为作者原创,谢绝任何单位和个人不经许可的复制和转播!
对于确有转载需要的,请先与作者联系,在获得允许后烦请在转载时保留文章出处。
本文出自Lupin's Blog:http://www.cnzui.com/archives/974