wxDesigner Tutorial

Introduction

Start wxDesigner at the $ prompt by typing wxDesigner, and select the Project Wizard option from the File menu.

In the wizard dialog box, select a directory to store the program code, and the name of the program you're creating. For this example, we'll be using the default language, C++. To simplify the code to a level similar to the original Hello, World example, make sure that only the following frame settings are enabled:

• wxMenuBar skeleton
• Use WDR resource for wxMenuBar
• wxStatusBar skeleton
• OnQuit handler
• OnAbout handler

then click the OK button.

If you examine the elements in the tree on the left of the window, you'll see your program's menu entries and source code. As you add dialogs, toolbars, and other GUI features in wxDesigner, they'll show up in the tree. You can also query the properties of existing GUI elements, as shown below:

Double-clicking the file listed under the C++ sources branch of the tree shows some of the program code:

To test out the program code, select the Write C++ source option from the File menu. Use the default settings on the dialog that comes up for normal programs, and make sure to select the Save WDR file, as well. option at the bottom. Then click the OK button to write the source files.

Automatically-Generated Program Code

wxDesigner writes out four source code files: hw_wxDesigner.cpp, hw_wxDesigner.h, hw_wxDesigner_wdr.cpp, and hw_wxDesigner_wdr.h. The last of those two files should never be edited by hand, since wxDesigner will regenerate them every time you make changes to your GUI.

File hw_wxDesigner.cpp:

    /////////////////////////////////////////////////////////////////////////////
    // Name:        hw_wxDesigner.cpp
    // Author:      XX
    // Created:     XX/XX/XX
    // Copyright:
    /////////////////////////////////////////////////////////////////////////////

    #ifdef __GNUG__
        #pragma implementation "hw_wxDesigner.cpp"
    #endif

    // For compilers that support precompilation
    #include "wx/wxprec.h"

    #ifdef __BORLANDC__
        #pragma hdrstop
    #endif

    // Include private headers
    #include "hw_wxDesigner.h"

    // WDR: class implementations

    //------------------------------------------------------------------------------
    // MyFrame
    //------------------------------------------------------------------------------

    // WDR: event table for MyFrame

    BEGIN_EVENT_TABLE(MyFrame,wxFrame)
        EVT_MENU(ID_ABOUT, MyFrame::OnAbout)
        EVT_MENU(ID_QUIT, MyFrame::OnQuit)
    END_EVENT_TABLE()

    MyFrame::MyFrame( wxWindow *parent, wxWindowID id, const wxString &title,
        const wxPoint &position, const wxSize& size, long style ):
        wxFrame( parent, id, title, position, size, style )
    {
        CreateMyMenuBar();

        CreateStatusBar(1);
        SetStatusText( "Welcome!" );

         // insert main window here
    }

    void MyFrame::CreateMyMenuBar()
    {
    #ifdef __WXMAC__
        wxApp::s_macAboutMenuItemId = ID_ABOUT;
    #endif

        SetMenuBar( MyMenuBarFunc() );
    }

    // WDR: handler implementations for MyFrame

    void MyFrame::OnAbout( wxCommandEvent &event )
    {
        wxMessageDialog dialog( this, "Welcome to SuperApp 1.0\n(C)opyright Joe Hacker",
            "About SuperApp", wxOK|wxICON_INFORMATION );
        dialog.ShowModal();
    }

    void MyFrame::OnQuit( wxCommandEvent &event )
    {
         Close( TRUE );
    }

    //------------------------------------------------------------------------------
    // MyApp
    //------------------------------------------------------------------------------

    IMPLEMENT_APP(MyApp)

    MyApp::MyApp()
    {
    }

    bool MyApp::OnInit()
    {
        MyFrame *frame = new MyFrame( NULL, -1, "SuperApp", wxPoint(20,20), wxSize(500,340) );
        frame->Show( TRUE );

        return TRUE;
    }

    int MyApp::OnExit()
    {
        return 0;
    }

File hw_wxDesigner.h:

    ////////////////////////////////////////////////////////////////////////////
    // Name:        hw_wxDesigner.h
    // Author:      XX
    // Created:     XX/XX/XX
    // Copyright:
/////////////////////////////////////////////////////////////////////////////

    #ifndef __hw_wxDesigner_H__
    #define __hw_wxDesigner_H__

    #ifdef __GNUG__
        #pragma interface "hw_wxDesigner.cpp"
    #endif

    // Include wxWindows' headers

    #ifndef WX_PRECOMP
        #include <wx/wx.h>
    #endif

    #include "hw_wxDesigner_wdr.h"

    // WDR: class declarations

    //----------------------------------------------------------------------------
    // MyFrame
    //----------------------------------------------------------------------------

    class MyFrame: public wxFrame
    {
    public:
        // constructors and destructors
        MyFrame( wxWindow *parent, wxWindowID id, const wxString &title,
            const wxPoint& pos = wxDefaultPosition,
            const wxSize& size = wxDefaultSize,
            long style = wxDEFAULT_FRAME_STYLE );

    private:
        // WDR: method declarations for MyFrame
        void CreateMyMenuBar();

    private:
        // WDR: member variable declarations for MyFrame

    private:
        // WDR: handler declarations for MyFrame
        void OnAbout( wxCommandEvent &event );
        void OnQuit( wxCommandEvent &event );

    private:
        DECLARE_EVENT_TABLE()
    };

    //----------------------------------------------------------------------------
    // MyApp
    //----------------------------------------------------------------------------

    class MyApp: public wxApp
    {
    public:
        MyApp();

        virtual bool OnInit();
        virtual int OnExit();
    };

    #endif

File hw_wxDesigner_wdr.cpp:

    //------------------------------------------------------------------------------
    // Source code generated by wxDesigner from file: hw_wxDesigner.wdr
    // Do not modify this file, all changes will be lost!
    //------------------------------------------------------------------------------

    #ifdef __GNUG__
        #pragma implementation "hw_wxDesigner_wdr.cpp"
    #endif

    // For compilers that support precompilation
    #include "wx/wxprec.h"

    #ifdef __BORLANDC__
        #pragma hdrstop
    #endif

    // Include private header
    #include "hw_wxDesigner_wdr.h"

    // Implement window functions

    // Implement menubar functions

    wxMenuBar *MyMenuBarFunc()
    {
        wxMenuBar *item0 = new wxMenuBar;

        wxMenu* item1 = new wxMenu;
        item1->Append( ID_ABOUT, "About", "" );
        item1->Append( ID_QUIT, "Quit", "" );
        item0->Append( item1, "File" );

        return item0;
    }

    // Implement toolbar functions

    // Implement bitmap functions

    // End of generated file

File hw_wxDesigner_wdr.h:

    //------------------------------------------------------------------------------
    // Header generated by wxDesigner from file: hw_wxDesigner.wdr
    // Do not modify this file, all changes will be lost!
    //------------------------------------------------------------------------------

    #ifndef __WDR_hw_wxDesigner_H__
    #define __WDR_hw_wxDesigner_H__

    #ifdef __GNUG__
        #pragma interface "hw_wxDesigner_wdr.cpp"
    #endif

    // Include wxWindows' headers

    #ifndef WX_PRECOMP
        #include <wx/wx.h>
    #endif

    #include <wx/image.h>
    #include <wx/statline.h>
    #include <wx/spinbutt.h>
    #include <wx/spinctrl.h>
    #include <wx/splitter.h>
    #include <wx/listctrl.h>
    #include <wx/treectrl.h>
    #include <wx/notebook.h>
    #include <wx/grid.h>

    // Declare window functions

    // Declare menubar functions

    #define ID_MENU 10000
    #define ID_ABOUT 10001
    #define ID_QUIT 10002
    wxMenuBar *MyMenuBarFunc();

    // Declare toolbar functions

    // Declare bitmap functions

    #endif

    // End of generated file

Compilation Steps

Each program is compiled into an object file using the appropriate compiler with the -c flag. After all the object files are created, the final g++ command links the object files together into a single executable:

    mwr@ch208a:~/code/c++$ g++ -c hw_wxDesigner.cpp `wx-config --cxxflags`
    mwr@ch208a:~/code/c++$ g++ -c hw_wxDesigner_wdr.cpp `wx-config --cxxflags`
    mwr@ch208a:~/code/c++$ g++ -o hw_wxDesigner hw_wxDesigner.o hw_wxDesigner_wdr.o `wx-config --libs`

Results

After typing the following command:

    mwr@ch208a:~/code/c++$ ./hw_wxDesigner