C++ Simple Form Login using Wxwidgets

Long it seems I do not write anymore because of busy thesis, and now I write again with new tutorial and new programming not like programming website again, but desktop programming using c++ and wxwidgets.

Why I use c++ and not java or python?

I use c++ because I like low-level programming and language C is father of several language such as PHP, Python, and most OS is writing using C language.
Okay back to the topic, the first we must create Form Login Header, this header is using for interface form login.


#include "wx/wx.h"

class FormLogin : public wxFrame
	FormLogin(const wxString& title);

	// Destructor
	virtual ~FormLogin();

	wxStaticText* m_usernameLabel;
	wxStaticText* m_passwordLabel;
	wxTextCtrl* m_usernameEntry;
	wxTextCtrl* m_passwordEntry;
	wxButton* m_buttonLogin;
	wxButton* m_buttonQuit;
	wxMessageDialog *dlg;

	void OnQuit(wxCommandEvent& event);
	void OnLogin(wxCommandEvent& event);


		BUTTON_Login = wxID_HIGHEST + 1
#endif // FORMLOGIN_H


  1. Line 4 is used to include wxwidgets library, to install wxwidgets read on this tutorial Installation wxwidgets on Linux and Windows.
  2. Line 6. I create class FormLogin and deriving a class from wxFrame
  3. Line 8-12 I create public class for constructor and destructor
  4. Line 14-21 I create variable with private access.

    Why I use private access?

    Because this variable is only access to class FormLogin and not another class.

  5. Line 23-25 I create method/function OnQuit and OnLogin. This function is used for if user click quit button or login button.
  6. Line 27-33 I create event table. This event is using for “handlers” function OnQuit and OnLogin.
  7. Line 32 I create Event name custom BUTTON_Login with ID set manual.

After header code, now this is the cpp code:

#include "FormLogin.h"
#include <wx/wx.h>

FormLogin::FormLogin(const wxString& title)
: wxFrame((wxFrame *) NULL, wxID_ANY, title, wxPoint(wxID_ANY, wxID_ANY), wxSize(340, 150), 
	wxPanel *panel = new wxPanel(this, wxID_ANY);

	wxBoxSizer *vbox = new wxBoxSizer(wxVERTICAL);

	wxBoxSizer *hbox1 = new wxBoxSizer(wxHORIZONTAL);
	m_usernameLabel = new wxStaticText(panel, wxID_ANY, wxT("Username: "), wxDefaultPosition, wxSize(70, -1));
	hbox1->Add(m_usernameLabel, 0);

	m_usernameEntry = new wxTextCtrl(panel, wxID_ANY);
	hbox1->Add(m_usernameEntry, 1);
	vbox->Add(hbox1, 0, wxEXPAND | wxLEFT | wxRIGHT | wxTOP, 10);

	wxBoxSizer *hbox2 = new wxBoxSizer(wxHORIZONTAL);
	m_passwordLabel = new wxStaticText(panel, wxID_ANY, wxT("Password: "), wxDefaultPosition, wxSize(70, -1));
	hbox2->Add(m_passwordLabel, 0);

	m_passwordEntry = new wxTextCtrl(panel, wxID_ANY, wxString(""),
		wxDefaultPosition, wxDefaultSize, wxTE_PASSWORD);
	hbox2->Add(m_passwordEntry, 1);
	vbox->Add(hbox2, 0, wxEXPAND | wxLEFT | wxTOP | wxRIGHT, 10);

	wxBoxSizer *hbox3 = new wxBoxSizer(wxHORIZONTAL);
	m_buttonLogin = new wxButton(panel, BUTTON_Login, wxT("Login"));

	m_buttonQuit = new wxButton(panel, wxID_EXIT, ("Quit"));
	vbox->Add(hbox3, 0, wxALIGN_RIGHT | wxTOP | wxRIGHT | wxBOTTOM, 10);


void FormLogin::OnQuit(wxCommandEvent& event)

void FormLogin::OnLogin(wxCommandEvent& event)
	wxString username = m_usernameEntry->GetValue();
	wxString password = m_passwordEntry->GetValue();

	if (username.empty() || password.empty()) {
		wxMessageBox(wxT("Username or password must not empty"), wxT("Warning!"), wxICON_WARNING);
	else {
		wxMessageBox(wxT("Welcome"), wxT("Message!"), wxICON_INFORMATION);

FormLogin::~FormLogin() {}

BEGIN_EVENT_TABLE(FormLogin, wxFrame)
EVT_BUTTON(wxID_EXIT, FormLogin::OnQuit)
EVT_BUTTON(BUTTON_Login, FormLogin::OnLogin)


  1. Line 5. The frame size is 340 x 150 px with this code wxSize(340, 150)
  2. Line 6 is for to create frame without maximaze function and can’t resize the frame.
  3. Line 8 I create panel for add element-element such as text box, label, and button to the frame with panel
  4. Line 10, 12, 20, 29 I create frame with divide layout/size using wxBoxSizer more info read this http://docs.wxwidgets.org/trunk/classwx_box_sizer.html. I using box sizer because I want add element to frame with default positioning with box sizer and not spesific add element using X line or Y line.
  5. Line 13, 16, 21, 24 I add element label, and text box to panel of the elements that have been defined previously in FormLogin.h (line 15-21).
  6. For password text box and if you want the text will be echoed as asterisks, so you must add wxTE_PASSWORD style to wxTextCtrl. Reference from this http://docs.wxwidgets.org/trunk/classwx_text_ctrl.html
  7. Line 30 I create button with event custom name BUTTON_Login, this name is reference to FormLogin.h and this code is used for handlers event EVT_BUTTON(BUTTON_Login, FormLogin::OnLogin) line 63.
  8. Line 33 is same such as above (line 30), but for the ID I use default ID from wxwidgets because this ID is exist in wxwidgets, so we don’t have to create custom ID, for lis of the default ID event wxwidgets read on this http://docs.wxwidgets.org/trunk/page_stockitems.html
  9. Line 51-56 I crate logic to validate if text input is empty (line 51), so user will receive message box with icon warning) and if not, user get message welcome
  10. Line 61-64, this code is to definition table events, example if user click login button, so the code will be redirect to function OnLogin

And the last for main frame we must create Main.h:

#ifndef MAIN_H
#define MAIN_H

#include <wx/wx.h>
#include <wx/app.h>

class MainApp : public wxApp
	virtual bool OnInit();

#endif // MAIN_H

Explanations: This class/ class MainApp is deriving a class from wxFrame.
And this is the code Main.cpp:

#include "Main.h"
#include "FormLogin.h"

bool MainApp::OnInit()

	FormLogin *formLogin = new FormLogin(wxT("SIA"));

	return true;


Line 2. FromLogin.h must be include to create instance class and create Frame layout in line 8 with code new FormLogin()


  1. Form Login View:
  2. If username or password is empty:
  3. If success login:


  1. May I simply just say what a relief to find somebody who truly understands what they are discussing on the internet. You certainly realize how to bring an issue to light and make it important. More and more people should look at this and understand this side of the story. It’s surprising you are not more popular since you surely possess the gift.

  2. Howdy! Someone in my Facebook group shared this website with us so I
    came to take a look. I’m definitely loving the information. I’m book-marking and will be
    tweeting this to my followers! Outstanding blog and fantastic design and style.

  3. I loved as much as you will receive carried out right here. The sketch is attractive, your authored material stylish. nonetheless, you command get got an edginess over that you wish be delivering the following. unwell unquestionably come more formerly again since exactly the same nearly very often inside case you shield this hike.

  4. terima kasih untuk tutorial yang sangat bagus untuk diikuti. untuk validasi user login tinggal menambahkan satu object database guna memerika user/pass dari table.

    void FormLogin::OnLogin(wxCommandEvent& event)
    ………. …………
    else {
    bool isLogin = getValidatedFromDB(user, passwd);

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s