wxWidgets初学者导引(5)——用wxSmith进行可视化设计

wxWidgets初学者导引全目录   PDF版及附件下载

1 前言
2 下载、安装wxWidgets
3 wxWidgets应用程序初体验
4 wxWidgets学习资料及利用方法指导
5 用wxSmith进行可视化设计
附:学习材料清单

5 用wxSmith进行可视化设计

  按照第4章的要求看过了相关的书籍,应该具备了通过直接写代码的方式界面程序的能力。而在实际的工程开发中,做界面的工作常通过可视化的操作完成。wxSmith就是这样一个支持wxWidgets快速开发的一个工具,专门用来做界面。

  wxSmith已经是Code::Blocks的一个标准配置,在Code::Blocks菜单中可以看到这一项。

  这一章,我们将从做一个应用程序开始。应用程序的窗口中有两个按钮,按SayHello按钮,屏幕上会出现“Hello World”,按Quit按钮,程序将结束。

5.1 用wxSmith创建应用程序的外观

  创建一个空项目,名称为plain。选择菜单wxSmith -> Add wxFrame,将要建立的Frame命名为plainFrame。

  在左侧的Management窗口中,显示Resources页签,我们看到的界面如下图所示:

  

  窗口中由许多小点构成的部分,就是将来应用程序的界面部分,我们称之为“设计区”。

  在整个窗口的左下方,是“属性/事件”窗口,被称为“属性编辑区”在其中可以设置属性,以及加入响应“OnClick”之类事件的代码。点击靠左的显示和设置“属性”,而右边的显示和设置“事件”(现在动手试一下)。

  现在只看到整个Frame的属性和事件,我们做些修改。

  例如,将Default size属性后面的“√”取消掉,将随后的Width和Height分别设置为400和200。再将用来设置窗口标题栏的title属性改变为“Hello world”,如下图所示:

  

  点击设计区右方的show preview图标,可以看到当前设置好的窗口,可见所做设置起了作用。如下图:

  

  在设计区下方,有一排小按钮,用于向窗口中插入“控件”,如下图,用鼠标在其上滑过,可以看到其名称,如wxBitmapButton、wxPanel、wxStaticText、wxButton等。

  

  可见,wxSmith提供了相当丰富的控件。

  下面,向你的窗口中加入四个控件,分别是:1个wxPanel,1个wxStaticText,2个wxButton。加入时,在控件栏中点击控件,然后,到窗口中的合适位置再点一下,控件即被加入。调整其位置,使看起来如下图所示:

  

  逐个选择加入的控件,在“属性编辑区”观察并改变其中的部分属性:

  • 静态文本框:其Identifier属性是ID_STATICTEXT1,将其Label属性中的值删除。
  • 按钮1:其Identifier属性是ID_BUTTON1,将其Label属性中的值改为&SayHello。
  • 按钮2:其Identifier属性是ID_BUTTON2,将其Label属性中的值改为&Quit。

  再点击设计区右方的show preview图标,观察设计好的窗口,如下所示:

  

5.2 为控件加入事件处理程序

  应用程序中,需要为按钮设置OnClick事件,决定事件发生时要做的“动作”,也即要定义事件响应函数。

  做法是,选中Quit按钮,在“属性编辑区”点击靠右边的按钮设置“事件”。下图是初时的状态,--None--标示着现在还没有事件代码:

  

  点击右边的向下三角,选择“--Add new handler--”,系统自动定义了一个函数体为空的函数:

void PlainFrame::OnButton2Click(wxCommandEvent& event)
{
}

  现在需要做的,是加入退出程序需要的语句。加入后函数是:

void PlainFrame::OnButton2Click(wxCommandEvent& event)
{
    Close(true);
}

  同样的方法,为SayHello按钮加上事件的处理,函数为:

void PlainFrame::OnButton1Click(wxCommandEvent& event)
{
    if(StaticText1->GetLabel().Contains(wxT("world")))
        StaticText1->SetLabel(StaticText1->GetLabel() + wxT(" again"));
    else
        StaticText1->SetLabel(wxT("Hello world"));
}

  在整个应用程序的开发工作即将结束之际,我们可以完整观察一下已经开发出的程序。

  

  在Code::Blocks左侧的Management窗口中,选择Projects页签,打开项目的Sources,即源程序部分的PlainFrame.cpp,以及Headers部分的PlainFrame.h,可以看到的程序的全貌,如上图所示。

  原来,前面利用wxSmith的所有设计,其结果都转变为了在前几章在看的代码。

  wxSmith利用可视化的界面,是在为我们自动生成程序!

  这时候编译程序,如果有错误,参考3.1.2小节的处理方式,修改程序或配置环境。

  最后,应该只有一个错误:undefined reference to `[email protected]‘。

  注意到此时的程序,只是定义了窗口类,还缺少整个程序的主控部分。仿照在《wxWidgets tutorial》中见过的无数例子,在项目中加入下面的两个文件:

main.h

#include <wx/wx.h>

class MyApp : public wxApp
{
  public:
    virtual bool OnInit();
};

main.cpp

#include "main.h"
#include "PlainFrame.h"

IMPLEMENT_APP(MyApp)

bool MyApp::OnInit()
{
    PlainFrame *plainFrame = new PlainFrame(NULL);
    plainFrame->Show(true);

    return true;
}

  此时,可以让让运行程序了。下面是程序运行期间的一个截图:

  

5.3 写代码与拖控件

  用wxSmith可以帮助程序员用可见的方式快速地做出应用程序的界面。一个问题是:p 这种“自动化”的手段,是不是让第4章辛苦看书手写代码所花的功夫白费了?

  这个观点有些道理。有些业内人士描述他们的工作,就是拖控件。这种话,C++程序员说得少一些。用的开发工具越高级,越要这样说。

  拖控件,也有水平高低,不必妄自菲薄。而确实,系统开发能力和水平,更多是在拖控件的背后。

  第4章辛苦看书手写代码,是掌握wxWidgets构架的必要,是探知其根源的途径。优秀程序员要上得了厅堂(直接写代码),也下得了厨房(拖控件),哪样方便哪样来。以至于,拖控件解决不了的,就直接写代码完成。

  能拖控件的人多,能写代码的人相对少。看第5章,不必等到第4章的功夫完全具备再说,而读完、练完了第5章,第4章一定要回头再好好看。

有了写代码能力的支撑,拖得一手好控件也有了保证。前面的Hello world只是一个开端,还有很多复杂的,也是构成良好交互功能的控件等着你拖好、用好。

5.4 深入wxSmith学习的建议

  在http://wiki.codeblocks.org/index.php?title=WxSmith_tutorials 中提供了9个教程,英文版的。跟着做下去,会明白更多。用中学英语,很划算的一件事情。

  附件中的“WxSmith_tutorials.pdf”文档是这9个教程早期的一个版本,可以离线读这个教程。

  可以自拟些小题目开发一下,逐渐就能过渡到开发项目。

  抛砖引玉,给几个小题目:

  (1)设计GUI程序,计算a+b=?,参考界面如下,在前两个文本框中输入a和b,点击“计算”按钮后,在第3个文本框中出a+b的结果。

  

  (2)用三个文本框输入一元二次方程的三个系数,解出方程的根。可以定义一个一元二次方程类来解决有关的计算问题。

  (3)不再写了,计算器、记事本、画图板,适合的题目,多的是了。学会拟小题目,这也是课外自主学习能找到的感觉。

================= 迂者 贺利坚 CSDN博客专栏=================
|== IT学子成长指导专栏 专栏文章的分类目录(不定期更新) ==|
|== C++ 课堂在线专栏  贺利坚课程教学链接(分课程年级) ==|
|== 我写的书——《逆袭大学——传给IT学子的正能量》    ==|
===== 为IT菜鸟起飞铺跑道,和学生一起享受快乐和激情的大学 =====

wxWidgets初学者导引(5)——用wxSmith进行可视化设计

时间: 2024-12-29 11:39:02

wxWidgets初学者导引(5)——用wxSmith进行可视化设计的相关文章

wxWidgets初学者导引(1)——前言

wxWidgets初学者导引全目录   PDF版及附件下载 1 前言2 下载.安装wxWidgets3 wxWidgets应用程序初体验4 wxWidgets学习资料及利用方法指导5 用wxSmith进行可视化设计附:学习材料清单 1 前言 1.1 关于"导引" 大学中的"C++程序设计"课程,以掌握基本的C++语法,并运用其解决一般的计算问题为目的.学生在学习中编出的程序,在"长相"上,与实际的产品不太一样.我的学生感慨,为何我编程序总是要面对

wxWidgets初学者导引(3)——wxWidgets应用程序初体验

wxWidgets初学者导引全目录   PDF版及附件下载 1 前言2 下载.安装wxWidgets3 wxWidgets应用程序初体验4 wxWidgets学习资料及利用方法指导5 用wxSmith进行可视化设计附:学习材料清单 3 wxWidgets应用程序初体验 本文中所有的体验,在Code::Blocks中进行. 为了在Code::Blocks中编译运行C++写的wxWidgets程序,需要再做些设置. 首先,需要在环境变量里添加一个wxWidgets根目录环境变量.设置方法类似于2.3

wxWidgets初学者导引(4)——wxWidgets学习资料及利用方法指导

wxWidgets初学者导引全目录   PDF版及附件下载 1 前言2 下载.安装wxWidgets3 wxWidgets应用程序初体验4 wxWidgets学习资料及利用方法指导5 用wxSmith进行可视化设计附:学习材料清单 4 wxWidgets学习资料及利用方法指导 初学者常苦于找不到参考资料.实际上,是找不到,不是没有.真正有用的资料,常常也就在手边,只是不知道.有能力熟练地使用一切能用得着的资料,这是水平提高的指标之一.这种能力,同样,也是在实践中获得,而不是有谁为你讲一堂课就能得

wxWidgets初学者导引(2)——下载、安装wxWidgets

生活中的单例 中国(China),位于东亚,是一个以华夏文明为主体.中华文化为基础,以汉族为主要民族的统一多民族国家,通用汉语.中国疆域内的各个民族统称为中华民族,龙是中华民族的象征.古老的中国凭借自身的发展依旧美丽的屹立于东方民族之林,闪耀着她动人的光彩,世界上只有一个中国,任何部分都是祖国不可分割的一部分,今天我们的设计模式就从伟大的祖国开始说起---单例模式. 详解单例模式 单例模式是什么?跟我们的祖国有着怎样的关系呢?首先我们来看一下单例,从"单例"字面意思上理解为-一个类只有

eclipseMARS2.0使用可视化设计界面——配置window builder

1.查看eclipse版本 不同版本的eclipse对应不同的版本window builder,如果不知道版本的话可以通过,点击HELP——>about eclipse来查看自己eclipse的版本 2.在官网上找到对应版本的window builder window builder下载网址:http://www.eclipse.org/windowbuilder/download.php,进入该链接页面如下图 点击对应版本的link,得到相应的网址,复制这个网址 3.进入eclipse,点击h

干货 | 可视化设计:地图四部曲之迁徙图

再过一个月的时间,2017年春运将会浩浩荡荡的开始,作为一名分析师你肯定很想看看用什么样的可视化图形来动态展示人员的流动情况.那么,我们今天就来看看用OpenFEA如何设计迁徙图. 1.什么是迁徙图 迁徙图,是对收集的用户定位数据,采用基于地理位置的大数据分析后,用"地图+单向迁移线路图"的可视化呈现方式,来动态显示人员的流向情况.具有动态.即时.直观地展现数据流向的轨迹与特征. 2.设计过程 第一步.登录 在浏览器中输入OpenFEA官网地址(http://www.openfea.c

大数据可视化设计在信息安全领域的案例分析

大数据可视化是个热门话题,在信息安全领域,也由于很多企业希望将大数据转化为信息可视化呈现的各种形式,以便获得更深的洞察力.更好的决策力以及更强的自动化处理能力,数据可视化已经成为网络安全技术的一个重要趋势. 一.什么是网络安全可视化 攻击从哪里开始?目的是哪里?哪些地方遭受的攻击最频繁--通过大数据网络安全可视化图,我们可以在几秒钟内回答这些问题,这就是可视化带给我们的效率.大数据网络安全的可视化不仅能让我们更容易地感知网络数据信息,快速识别风险,还能对事件进行分类,甚至对攻击趋势做出预测.可是

第二次作业 WinForm可视化设计 随机图片显示器

要求: 目标3的功能简介:有若干张图片(自己确定,不少于5张,命名方法自定),窗体有3个控件(PictureBox,按钮,label):按下"随机显示"按钮,则随机显示一张图片,并给出该图片显示的次数在右边的label中:同时在"关闭"窗体时,把每张图片目前已经显示的次数写入到指定文件中,方便下次程序运行时使用. 大家可以再增加功能,比如图片名称为"学号姓名",显示姓名在图片上方(增加一个label):--:越来越接近玩"猜猜看&quo

UI学习笔记---第十三天可视化设计 XIB, StoryBoard

一.XIB Xib是一种苹果提供的快速构建界面的编程方式,主要是为了简化MVC中的V的构建 Xib提供可视化的编辑界面,能大大提升页面布局效率 Xib常用操作 为控件关联事件 为空间指定delegate 为控件关联实例变量或者属性 二.StoryBoard的使用 StoryBoard的注意事项 在AppDelegate的-application: didFinishLaunchingWithOptions: 的方法中不要再用代码初始化一个window 将创建好的StoryBoard在应用程序配置