Graphical User Interface Coding

Before I lay down code (which we'll do very shortly), I like to make an outline (hierarchy) of my GUI interface. I list the control's description, then the variable name I'll use for it. Here's what the outline looks like for our demo program:

I'm going to step-through coding this GUI application.

Obviously, we first need to determine what GUI package we want to use. We have many options, but I like the idea of a cross-platform library. I can code once and let Windows and Linux/FreeBSD users run the same program.

include wxEuphoria.e -- main wxEuphoria code
include wxCheckBox.e -- code for using checkboxes (including toggle buttons)
include wxSizer.e -- code needed for resizing/repositioning widgets

Then I create all the controls, in order, using my outline. I indent all child widgets to keep everything organized.

constant
win_Main = create( wxFrame, {0, -1, "Big Corp Product Manager", -1, -1, 320, 230}),
panel_left = create( wxPanel, win_Main ),
bttn_Products = create( wxToggleButton, {panel_left, -1, "Products", -1, -1, -1, -1 }),
bttn_Reports = create( wxToggleButton, {panel_left, -1, "Reports", -1, -1, -1, -1 }),
bttn_Inv = create( wxToggleButton, {panel_left, -1, "Inventory", -1, -1, -1, -1 }),
panel_right = create( wxPanel, {panel_left, -1, -1, -1, -1, -1, wxRAISED_BORDER}),
Frame_Products = create( wxPanel, {panel_right, -1, -1, -1, -1, -1, wxRAISED_BORDER}),
Frame_Reports = create( wxPanel, {panel_right, -1, -1, -1, -1, -1, wxRAISED_BORDER}),
Frame_Inv = create( wxPanel, {panel_right, -1, -1, -1, -1, -1, wxRAISED_BORDER})

Make a note that wxWidgets refers to "windows" as "frames."

Now we're going to put it all together.

procedure main()
atom vsizer, hsizer

hsizer = create( wxBoxSizer, wxHORIZONTAL )
vsizer = create( wxBoxSizer, wxVERTICAL )

add_window_to_sizer( vsizer, bttn_Products, 0, wxTOP, 0 )
add_window_to_sizer( vsizer, bttn_Reports, 0, wxTOP, 4 )
add_window_to_sizer( vsizer, bttn_Inv, 0, wxTOP, 4 )

add_sizer_to_sizer( hsizer, vsizer, 0, wxALIGN_CENTER + wxLEFT, 4 )
add_window_to_sizer( hsizer, panel_right, 1, wxGROW + wxALL, 5 )

set_sizer( panel_left, hsizer )

wxMain( win_Main )
end procedure

main()