Understanding wxWidgets sizers - c++

I'm still getting used to the sizers in wxWidgets, and as such can't seem to make them do what I want.
I want a large panel that will contain a list of other panels/boxes, which each then contain a set of text fields
----------------------
| label text box |
| label2 text box2 |
----------------------
----------------------
| label text box |
| label2 text box2 |
----------------------
----------------------
| label text box |
| label2 text box2 |
----------------------
I also need to be able to add (at the end), and remove(anywhere) these boxes.
If there's too many to fit in the containing panel a vertical scroll bar is also required.
This is what I've tried so far, it works for the first box that's created with the containing panel, but additional added items are just a small box in the top left of the main panel, even though the sizer code is the same for all boxes.
//itemsList is a container containg a list of *Item pointers to each box/panel/whatever the right name is
Items::Items(wxWindow *parent)
:wxPanel(parent, wxID_ANY, wxDefaultPosition, wxDefaultSize, wxBORDER_SUNKEN)
{
//one sstarting item
OnAdd(wxCommandEvent());
}
void Items::OnAdd(wxCommandEvent &event)
{
unsigned id = itemsList .size();
Item *item = new Item(this,id);
itemsList .push_back(item);
RebuildSizer();
}
void Items::RebuildSizer()
{
this->SetSizer(0,true);
wxBoxSizer *sizerV = new wxBoxSizer(wxVERTICAL);
for(std::vector<Item*>::iterator it = itemsList .begin(); it != itemsList .end(); ++it)
sizerV->Add(*it, 1, wxEXPAND | wxLEFT | wxRIGHT, 5);
SetSizer(sizerV);
}
void Items::OnRemove (wxCommandEvent &event, unsigned itemId)
{
delete itemsList [itemId];
itemsList .erase(items.begin()+itemId);
for(std::vector<Item*>::iterator it = itemsList .begin()+itemId; it != itemsList .end(); ++it)
(*it)->ChangeId(itemId++);
RebuildSizer();
}
Also what's the best way to lay out the contents of each box? I was thinking of using a 2 by 2 grid sizer but I'm not sure how to make the text boxes to expand to be as wide as possible while making the labels stay as small as possible (but also maintaining the alignment between the 2 text boxes)?

"If theres too many to fit in the containing panel a vertical scroll bar is also required."
You could have a look at wxScrolledWindow.
"additional added items are just a small box in the top left of the main panel"
I am not sure, but, maybe a call to wxSizer::Layout() will help.
"Also whats the best way to lay out the contents of each box?"
Have a look at this sizerdemo. If it is not mandatory, that the labels stay as small as possible, you could give the labels a fixed width and only let the text boxes grow. If you want to adapt the size when adding or removing new boxes, you could implement the OnSize() event handler.

May I suggest to you to post this question to one of the wxWidgets mailing list? They will be able to help you very quickly.

Can I also recommend the wxForum, I have found it very useful for wxWidgets questions in the past.
More specifically for scrolling wxScrolledWindow should help, use wxScrolledWindow->SetSizer with your top level sizer (the one that contains your controls) to set up a scrolled area, also check out the samples called scroll, scrollsub and vscroll included in wxWidgets (in the samples directory of your wxwidgets install).

Related

CTabCtrl, enabling and disabling tabs

Using Visual C++ MFC.
I have a dialog page, which contains a tab control object. I've created my own tab control class derived from CTabCtrl, where I created all my tab pages contained in an array, like so:
tabArray[0] = new TabPage;
tabArray[1] = new TabPage;
tabArray[0]->Create(DIALOG, this);
tabArray[1]->Create(DIALOG, this);
In my initial dialog page, I have a bunch of checkboxes. Depending on the state of these checkboxes, I add/remove the tab pages (but not the underlying TabPage classes!).
This is done like so. I keep track of which tabs are enabled/disabled in m_fTabEnabled. The state of the tab is toggled with the checkbox. This is used to determine which tab needs to be inserted.
m_fTabEnabled[iTab] = !m_fTabEnabled[iTab];
DeleteAllItems();
for(int i = 0; i < NUMOFTABS; ++i)
{
if(m_fTabEnabled[i]) InsertItem(i, m_sTabNames[i]);
}
Using this method, I have an issue that if I have three tabs enabled, and I remove the second tab, that the dialog containing the data from the second tab is displayed on the third tab. For example:
tab 1, label 1, contains: 1
tab 2, label 2, contains: 2
tab 3, label 3, contains: 3
remove tab 2, tab 3 is shifted to tab 2
tab 1, label 1, contains: 1
tab 2, label 3, contains: 2
tab 3 hidden.
This causes a problem when I'm retrieving data from the tabs, because what I filled in tab three is lost to the data that used to be in tab two.
Does anybody have any suggestions on ways to manage this?

Is there a way to reassign a grid layout to a label?

I have created a GUI with the aid of Tkinter that has created a 3 [C]olomn by 8 [R]ow, (I have placed the borders of the 'cells' in red) and output is like so:
Just to calrify:
Where the "logo [E]" is (C1,R1) & (C1,R2) are rowspanned and where the "main window" is from (C2,R3) to (C3,R8) are colomnspanned and rowspanned.
All are Label widget except for (C1,R3 to C1,R8), which are button widgets with a command to display a string in "Main Window" (gray area).
My aim is to make the "Main Window"(gray area) display only in different grid layouts based on the selected button on the left. So for example I would like to make the grey have a grid layout of 2col by 4 row when C1,R6 is pressed, or when C1,R3 is pressed the grid layout to be 2Cx6R all in the gray area.
Q: Is there a way of re-gridding a label? If so how? Or an alternative approach?
ADDENDUM:
Ideally I would like to update the GREEN area with different number of row and column configurations. For example: When Micro Audit is touched, the Green area will configure itself to have 4 rows by 2 columns, and when Find Item is selected, it will only 3 rows with 1 column, etc. :

QT gui items won't shrink to ft to their parent widget

I have three widgets under my main window . I design my program that each widget will be controlled by a class .
Last 2 hours I waste my time to fit 3 GUI elements to one of this widgets.
I want to have a label and a line item and a button. I put them in to a grid layout(in real case I have 3 row for simplicity I put 1 row in the example below). And set the grid layout's parent to my class.
What I expect is this GUI items to resize themselves and fit to one row in this widget, no matter what I tried I couldn't succeed .
In short I expect this items to shrink to fit to the widget by themselves. But couldn't figure out how to do it. Any advice ?
void
enviromentSetup::createDialogs()
{
numberOfPoints = new QLabel (QApplication::translate("leftPanel","numberOfPoints"));
inputNumberOfPoints = new
QLineEdit(QString::number(st_environmentParamaters.number_of_points_in_line));
maxElementsButton = new QPushButton("Max Elems");
gridLayout = new QGridLayout(this);
gridLayout->addWidget(numberOfPoints, 0, 0);
gridLayout->addWidget(inputNumberOfPoints, 0, 1);
gridLayout->addWidget(maxElementsButton, 0, 2);
this->show();
}
It is insufficient to merely make the parent of the layout the main widget. You also have to explicitly set the layout of the widget.
Add the following line just before you show the widget:
this->setLayout(gridLayout);

win32 List View Abbreviating Text

I'm using win32 to create a list view with downloaded icons, however, the text is abbreviated at approximately 19 characters (as about size 12 font, Segoe UI). I have included the CreateWindow and item creation code I'm using for it.
Any advice would be appreciated.
HWND airlinelist = CreateWindow(WC_LISTVIEW,L"",WS_CHILD | LVS_LIST | WS_TABSTOP | WS_BORDER,18,104,323,74,hwnd,(HMENU)3,hinst,NULL);
LVITEM newi;
ZeroMemory(&newi,sizeof(LVITEM));
const wchar_t* n = L"Client Website Name, website.com"
newi.pszText = newc;
newi.mask = LVIF_TEXT | LVIF_IMAGE;
newi.iImage = 0;
ListView_InsertItem(airlinelist,&newi);
The above would create a list view with the icon and something to the effect of "Client Website Nam..." despite it only taking up half of the list view's width.
I'll assume you're using LVS_LIST mode because the style is shown in your code sample. You can use the LVM_SETCOLUMNWIDTH message to adjust the column size once you've added items to the list control. You can also use the ListView_SetColumnWidth macro. E.g.:
SendMessage(airlinelist, LVM_SETCOLUMNWIDTH, 0, 300);
This would set the columns to 300 pixels wide. If you're actually using LVS_REPORT mode you would need to set the width for each column individually.

Fitting a big grid (wxGrid) in a dialog (wxDialog)

Here is my layout:
I have a sizer that contains a grid (with a proportion of 1) and a ok/cancel button bar
The all thing is in a wxDialog
Here it is:
|||||||||||||||
| |
| GRID |
| |
| |
| |
|||||||||||||||
| OK CANCEL |
|||||||||||||||
The issue is that the grid contains too many row, and over flow the screen, so in the end I don't see the top part of the dialog. Is there a way, when calling Fit() on the dialog, to limit its height ?
I have tried stuff like this: SetSizeHints(-1,-1,-1,500); and SetMaxSize(500,500) but it did not worked.
Also I have tried to do that: this->SetSize(this->GetSize().GetX(), 500);, but since the vertical scroll bar appears on the grid, it is not wide enough and a horizontal scroll bar shows up.
EDIT
In the constructor I call wxGrid(parent, wxID_ANY, wxDefaultPosition, wxDefaultSize)
The easiest way to handle this is to use a grid of fixed size. If there are more rows than will fit, then a scroll bar will appear. You set the size you want in the constructor.
new wxGrid( this, IDC_grid, wxPoint(-1,-1),wxSize(igridxsize,igridysize));
If you want the size of the grid to adjust, e.g. when the user resizes the application window, things are a bit more complex. You need handle the window size event and change the grid size as appropriate.
Something along these lines:
myDialog::OnSize(wxSizeEvent& event);
{
wxSize dialogSize = event.GetSize();
myGrid->OnSize( wxSizeEvent(
dialogSize.GetWidth() * 0.9, dialogSize.GetHeight() * 0.7 ));
}