[ZETCODE]wxWidgets教程三：第一个窗体程序

本教程原文链接：http://zetcode.com/gui/wxwidgets/firstprograms/

翻译：瓶哥

日期：2013年11月27日星期三

邮箱：414236069@qq.com

主页：http://www.cnblogs.com/pingge/

若有翻译错误或者歧义请联系我！

在这一章，我们将会概括介绍如何创建wxWidgets程序。我们将会创建第一个简单的例子，展示如何显示一个图标。接下来我们将会用一个简单的例子说明如何响应事件。最后，我们将会看到这些小部件是如何与wxWidgets程序进行交互的。

一个简单的程序

首先我们创建一个非常简单的wxWidgets程序。

simple.h

#include <wx/wx.h>
 
class Simple : public wxFrame
{
public:
    Simple(const wxString & title);
};

simple.cpp

#include "simple.h"
 
Simple::Simple(const wxString & title)
      : wxFrame(NULL, wxID_ANY, title, wxDefaultPosition, wxSize(, ))
{
    Centre();
}

main.h

#include <wx/wx.h>
 
class MyApp : public wxApp
{
public:
    virtual bool OnInit();
};

main.cpp

#include "main.h"
#include "simple.h"
 
IMPLEMENT_APP(MyApp)
 
bool MyApp::OnInit()
{
    Simple * simple = new Simple(_T("Simple"));
    simple->Show(true);
 
    return true;
}

这个小例子在屏幕上显示了一个小窗口，并且这个窗口是居中显示的。

Centre();

这个方法使这个窗口居中显示在屏幕上（水平和垂直）。

IMPLEMENT_APP(MyApp)

The code thar implements the application is hidden behind the macro.这是一段代码的复制粘贴，我们通常不用去关心。

应用程序图标

在这个例子中，我们给我们的程序提供一个图标，这是一个在窗口的左上角显示一个小图标的标准方法。这个图标是作为一个xpm格式文件被包含进这个程序。

icon.h

#include <wx/wx.h>
 
class Icon : public wxFrame
{
public:
    Icon(const wxString & title);
};

icon.cpp

#include "icon.h"
#include "icon.xpm"
 
Icon::Icon(const wxString & title)
    : wxFrame(NULL, wxID_ANY, title, wxDefaultPosition, wxSize(, ))
{
    SetIcon(wxIcon(icon_xpm));
    Centre();
}

main.h

#include <wx/wx.h>
 
class MyApp : public wxApp
{
public:
    virtual bool OnInit();
};

main.cpp

#include "main.h"
#include "icon.h"
 
IMPLEMENT_APP(MyApp)
 
bool MyApp::OnInit()
{
    Icon * icon = new Icon(_T("Icon"));
    icon->Show(true);
 
    return true;
}

icon.xpm

/* XPM */
static const char * icon_xpm[] = {
/* columns rows colors chars-per-pixel */
"32 32 6 1",
"  c black",
". c navy",
"X c red",
"o c yellow",
"O c gray100",
"+ c None",
/* pixels */
"++++++++++++++++++++++++++++++++",
"++++++++++++++++++++++++++++++++",
"++++++++++++++++++++++++++++++++",
"++++++++++++++++++++++++++++++++",
"++++++++++++++++++++++++++++++++",
"++++++++              ++++++++++",
"++++++++ ............ ++++++++++",
"++++++++ ............ ++++++++++",
"++++++++ .OO......... ++++++++++",
"++++++++ .OO......... ++++++++++",
"++++++++ .OO......... ++++++++++",
"++++++++ .OO......              ",
"++++++++ .OO...... oooooooooooo ",
"         .OO...... oooooooooooo ",
" XXXXXXX .OO...... oOOooooooooo ",
" XXXXXXX .OO...... oOOooooooooo ",
" XOOXXXX ......... oOOooooooooo ",
" XOOXXXX ......... oOOooooooooo ",
" XOOXXXX           oOOooooooooo ",
" XOOXXXXXXXXX ++++ oOOooooooooo ",
" XOOXXXXXXXXX ++++ oOOooooooooo ",
" XOOXXXXXXXXX ++++ oOOooooooooo ",
" XOOXXXXXXXXX ++++ oooooooooooo ",
" XOOXXXXXXXXX ++++ oooooooooooo ",
" XXXXXXXXXXXX ++++              ",
" XXXXXXXXXXXX ++++++++++++++++++",
"              ++++++++++++++++++",
"++++++++++++++++++++++++++++++++",
"++++++++++++++++++++++++++++++++",
"++++++++++++++++++++++++++++++++",
"++++++++++++++++++++++++++++++++",
"++++++++++++++++++++++++++++++++"
};

在我们的程序中我们显示了一个小的wxWidgetsLogo图标。

SetIcon(wxIcon(icon_xpm));

显示图标是上面这行代码的做的工作。XPM(X PixMap)是一种以ASCII码表现的图像格式。

一个简单的按钮

在接下来的这个例子中，我们在框架上创建了一个按钮。我们将会看到，如何建立一个简单的事件处理程序。

button.h

#include <wx/wx.h>
 
class Button : public wxFrame
{
public:
    Button(const wxString & title);
 
    void OnQuit(wxCommandEvent & event);
};

button.cpp

#include "button.h"
 
Button::Button(const wxString & title)
      : wxFrame(NULL, wxID_ANY, title, wxDefaultPosition, wxSize(, ))
{
    wxPanel * panel = new wxPanel(this, wxID_ANY);
 
    wxButton * button = new wxButton(panel, wxID_EXIT, _T("Quit"), wxPoint(, ));
 
    Connect(wxID_EXIT, wxEVT_COMMAND_BUTTON_CLICKED, wxCommandEventHandler(Button::OnQuit));
 
    button->SetFocus(); // This sets the window to receive keyboard input
 
    Centre();
}
 
void Button::OnQuit(wxCommandEvent & WXUNUSED(event))
{
    Close(true);
}

main.h

#include <wx/wx.h>
 
class MyApp : public wxApp
{
public:
    virtual bool OnInit();
};

main.cpp

#include "main.h"
#include "button.h"
 
IMPLEMENT_APP(MyApp)
 
bool MyApp::OnInit()
{
    Button * button = new Button(_T("Button"));
    button->Show(true);
 
    return true;
}

wxPanel * panel = new wxPanel(this, wxID_ANY);

首先我们创建一个wxPanel组件，这将被放置到一个wxFrame组件中。

wxButton * button = new wxButton(panel, wxID_EXIT, _T("Quit"), wxPoint(20, 20));

我们建立了一个wxButton组件，它被放置在panel上，我们使用wxWidgets预定义的id：wxID_EXIT绑定这个按钮，按钮上面的标签文字是"Quit"，按钮被放置的坐标为(20, 20)，坐标系的起点是左上角。

Connect(wxID_EXIT, wxEVT_COMMAND_BUTTON_CLICKED, wxCommandEventHandler(Button::OnQuit));

如果我们点击这个按钮，一个wxEVT_COMMAND_BUTTON_CLICKED事件就会被触发，我们把这个事件和OnQuit()方法捆绑在一起，所以当我们点击按钮时，OnQuit()方法就会被调用。

Button->SetFocus();

我们把键盘的焦点设置到这个按钮上，所以如果我们按下回车键就相当于按钮被按下了。

Close(true);

在OnQuit()方法中，我们调用了Close()方法，这将会终结我们的应用程序。

组件之间的通信

知道各个组件之间如何互相通信很重要，请看下面这个例子。

panels.h

#include <wx/wx.h>
#include <wx/panel.h>
 
class LeftPanel : public wxPanel
{
public:
    LeftPanel(wxPanel * parent);
 
    void OnPlus(wxCommandEvent & event);
    void OnMinus(wxCommandEvent & event);
 
    wxButton * m_plus;
    wxButton * m_minus;
    wxPanel * m_parent;
    int count;
};
 
class RightPanel : public wxPanel
{
public:
    RightPanel(wxPanel * parent);
 
    void OnSetText(wxCommandEvent & event);
 
    wxStaticText * m_text;
};
 
const int ID_PLUS = ;
const int ID_MINUS =  ;

panels.cpp

#include <wx/stattext.h>
#include "communicate.h"
 
LeftPanel::LeftPanel(wxPanel * parent)
         : wxPanel(parent, wxID_ANY, wxPoint(-, -), wxSize(-, -), wxBORDER_SUNKEN)
{
    count = ;
    m_parent = parent;
    m_plus = new wxButton(this, ID_PLUS, _T("+"), wxPoint(, ));
 
    m_minus = new wxButton(this, ID_MINUS, _T("-"), wxPoint(, ));
 
    Connect(ID_PLUS, wxEVT_COMMAND_BUTTON_CLICKED, wxCommandEventHandler(LeftPanel::OnPlus));
 
    Connect(ID_MINUS, wxEVT_COMMAND_BUTTON_CLICKED, wxCommandEventHandler(LeftPanel::OnMinus));
}
 
void LeftPanel::OnPlus(wxCommandEvent & WXUNUSED(event))
{
    count++;
 
    Communicate * comm = (Communicate *)(m_parent->GetParent());
 
    comm->m_rp->m_text->SetLabel(wxString::Format(_T("%d"), count));
}
 
void LeftPanel::OnMinus(wxCommandEvent & WXUNUSED(event))
{
    count--;
 
    Communicate * comm = (Communicate *)(m_parent->GetParent());
 
    comm->m_rp->m_text->SetLabel(wxString::Format(_T("%d"), count));
}
 
RightPanel::RightPanel(wxPanel * parent)
          : wxPanel(parent, wxID_ANY, wxDefaultPosition, wxSize(, ), wxBORDER_SUNKEN)
{
    m_text = new wxStaticText(this, -, _T(""), wxPoint(, ));
}

communicate.h

#include "panels.h"
#include <wx/wxprec.h>
 
class Communicate : public wxFrame
{
public:
    Communicate(const wxString & title);
 
    LeftPanel * m_lp;
    RightPanel * m_rp;
    wxPanel * m_parent;
};

communicate.cpp

#include "communicate.h"
 
Communicate::Communicate(const wxString & title)
           : wxFrame(NULL, wxID_ANY, title, wxDefaultPosition, wxSize(, ))
{
    m_parent = new wxPanel(this, wxID_ANY);
 
    wxBoxSizer * hbox = new wxBoxSizer(wxHORIZONTAL);
 
    m_lp = new LeftPanel(m_parent);
    m_rp = new RightPanel(m_parent);
 
    hbox->Add(m_lp, , wxEXPAND | wxALL, );
    hbox->Add(m_rp, , wxEXPAND | wxALL, );
 
    m_parent->SetSizer(hbox);
 
    this->Centre();
}

main.h

#include <wx/wx.h>
 
class MyApp : public wxApp
{
public:
    virtual bool OnInit();
};

main.cpp

#include "main.h"
#include "communicate.h"
 
IMPLEMENT_APP(MyApp)
 
bool MyApp::OnInit()
{
    Communicate * communicate = new Communicate(_T("Communicate"));
    communicate->Show(true);
 
    return true;
}

在我们的例子中，我们有两个panel，一个左边一个右边，左边的有两个按钮，右边的有一个静态文本控件。按钮改变显示在右panel中的数字。问题是，我们是如何获得静态文本控件的指针的？

m_parent = parent;

在LeftPanel里我们存储了父组件的地址，这是一个wxPanel组件。

Communicate * comm = (Communicate *)m_parent->GetParent();

Comm->m_rp->m_text->SetLabel(wxString::Format(_T("%d"), count));

这两行是这个例子中最重要的两行，它展示了如何操纵那个放在右panel中的静态文本控件。首先我们取得了左panel和右panel的父窗口指针，这个父窗口组件有一个指向右panel的指针，并且右panel有一个指向静态文本控件的指针。

在这部分的wxWidgets教程中，我们创建了一些简单的程序。