Search code examples
wxwidgets

Embedding wxWidget controls ontop of each other

I have defined a wxPanel that contains a wxFlexGridSizer which contains 4 rows and 2 columns of controls (wxStaticText and wxTextCtrl).

For atheistic purposes, I want to over lay the content of this sizer with a wxRadioBox (with no radio buttons) as it shows a nice outline around the data I want the user to enter with a little description.

How would I go about achieving this?

Thank you!

Edit: 

void MyFrame::Initialize_Project_Info() {

//wxStaticText* s = new wxStaticText(this, wxID_ANY, _T("")); //Random control assigned to the parent to overide wxEVT_SIZE (check wxFrame documentation)

//To try and implement Project Panel
int xx = 5, yy = 10;
int delta_x = 10, delta_y = 10;


wxBoxSizer* hbox = new wxBoxSizer(wxHORIZONTAL);
wxFlexGridSizer* fgs = new wxFlexGridSizer(4, 2, 10, 15);
wxPanel* Project_Panel = new wxPanel(this, wxID_ANY, wxDefaultPosition, wxSize(200, 200), wxTAB_TRAVERSAL, _T(""));

wxStaticBoxSizer* sbox = new wxStaticBoxSizer(wxVERTICAL, Project_Panel, _T("Project Information"));


//Project_Info_OverLay = new wxRadioBox(Project_Panel, wxID_ANY, _T("Project Information"), wxPoint(5, 0), wxSize(400, 250), 0, NULL, 1, wxRA_SPECIFY_COLS, wxDefaultValidator, _T(""));


//Note wsSize(width,height).
Project_Name = new wxStaticText(Project_Panel,wxID_ANY,_T("Project:"));
Engineer_Name = new wxStaticText(Project_Panel, wxID_ANY, _T("Engineer:"));
CrossSection_Name = new wxStaticText(Project_Panel, wxID_ANY, _T("Cross Section ID:"));
Additional_Notes = new wxStaticText(Project_Panel, wxID_ANY, _T("Additional Notes:"));


Enter_PN = new wxTextCtrl(Project_Panel, wxID_ANY, wxEmptyString, wxDefaultPosition, wxDefaultSize, wxTE_PROCESS_ENTER | wxTE_PROCESS_TAB, wxDefaultValidator, _T(""));
Enter_EN = new wxTextCtrl(Project_Panel, wxID_ANY, wxEmptyString, wxDefaultPosition, wxDefaultSize, wxTE_PROCESS_ENTER | wxTE_PROCESS_TAB, wxDefaultValidator, _T(""));
Enter_CSN = new wxTextCtrl(Project_Panel,wxID_ANY, wxEmptyString, wxDefaultPosition, wxDefaultSize, wxTE_PROCESS_ENTER | wxTE_PROCESS_TAB, wxDefaultValidator, _T(""));
Enter_AN = new wxTextCtrl(Project_Panel, wxID_ANY, wxEmptyString, wxDefaultPosition, wxSize(250,100), wxTE_PROCESS_ENTER | wxTE_PROCESS_TAB | wxTE_MULTILINE, wxDefaultValidator, _T(""));

fgs->Add(Project_Name);
fgs->Add(Enter_PN, 1, wxEXPAND);
fgs->Add(Engineer_Name);
fgs->Add(Enter_EN, 1, wxEXPAND);
fgs->Add(CrossSection_Name);
fgs->Add(Enter_CSN, 1, wxEXPAND);
fgs->Add(Additional_Notes);
fgs->Add(Enter_AN, 1, wxEXPAND);

sbox->Add(fgs);

Project_Panel->SetSizer(sbox);
Solution

  • You're almost there. Just change

     Project_Panel->SetSizer(sbox);

    to

    hbox->Add(sbox, wxSizerFlags().Border(wxALL));
Project_Panel->SetSizer(hbox);

    Although not part of you're question, I think a better option instead of specifying the horizontal and vertical gaps for the flex grid sizer would be to use sizer flags to define the gaps. This will help your forms be more flexible when dealing with high dpi screens.

    To do this, define the sizer like this:

    wxFlexGridSizer* fgs = new wxFlexGridSizer(4, 2, 0, 0);

    And then add elements to it like this:

    fgs->Add(Project_Name,
         wxSizerFlags().Align(wxALIGN_RIGHT|wxALIGN_CENTER_VERTICAL)
                       .Border(wxTOP|wxBOTTOM|wxLEFT));
fgs->Add(Enter_PN,wxSizerFlags().Expand().Border(wxALL));
fgs->Add(Engineer_Name,
         wxSizerFlags().Align(wxALIGN_RIGHT|wxALIGN_CENTER_VERTICAL)
                       .Border(wxBOTTOM|wxLEFT));
fgs->Add(Enter_EN, wxSizerFlags().Expand().Border(wxBOTTOM|wxLEFT|wxRIGHT));
fgs->Add(CrossSection_Name,
         wxSizerFlags().Align(wxALIGN_RIGHT|wxALIGN_CENTER_VERTICAL)
                       .Border(wxBOTTOM|wxLEFT));
fgs->Add(Enter_CSN,
         wxSizerFlags().Expand().Border(wxBOTTOM|wxLEFT|wxRIGHT));
fgs->Add(Additional_Notes,
         wxSizerFlags().Align(wxALIGN_RIGHT).Border(wxBOTTOM|wxLEFT));
fgs->Add(Enter_AN, wxSizerFlags().Expand().Border(wxBOTTOM|wxLEFT|wxRIGHT));

    This produces this layout:

    enter image description here

    (I've also aligned the static texts next to their text boxes. You can remove the Align(wxALIGN_RIGHT) parts if you don't like this.)

    I realize, dealing with sizers can be tricky for newcomers to wxWidgets. There are some graphical gui builders such as wxFormbuilder or wxCrafter that you might find helpful.