Help needed with layout/sizer

#1

Hi.
I am trying to learn wxPython layout. This is what I want my GUI to look like:
(please excuse my horrible drawing)

MyLayout

Element 1 is the primary element which expands horizontally and vertically as the
window is resized
Element 2 and 3 should only expand vertically but retain minimum required size
horizontally
Element 4 and 5 should retain minimum required size both horizontally and vertically
Element 6 can only expand horizontally, retaining its minimum required size vertically

I have tried so many different ways both in python code and with wxGlade
but not able to get what I want

Please help. I do not need complete code, just some hint as to how something like this is done.
Thanks in advance.

#2

I’m definitely not an expert in wx, but I would simplify the implementation by creating two panels for each row.

The top panel can expand vertically to fill the space of the window & you only need to manage the resizing of element 1.
The bottom panel is fixed vertically and you only need to manage expanding element 6 horizontally.

I’m sure it can be done in one panel but I find the code for complex layouts makes things very difficult to understand and manage/maintain/modify.

#3

Hi,

I had a go using wxGlade. The design uses a top-level vertical boxsizer containing 2 horizontal boxsizers, with a fourth horizontal boxsizer for Element 6. I then adjusted the proportion & wx.EXPAND parameters to get the required resizing behaviour.

I don’t know how you intended to do the drawing in Element 1, so I just put a wx.Panel there and changed its background colour to make it more visible.

I’m not sure what you mean about making Element 3 (Combobox) expand vertically?

Here is the generated code:

#!/usr/bin/env python3
# -*- coding: UTF-8 -*-
#
# generated by wxGlade 1.0.5 on Sun Apr 23 10:12:24 2023
#

import wx

# begin wxGlade: dependencies
# end wxGlade

# begin wxGlade: extracode
# end wxGlade


class MyFrame(wx.Frame):
    def __init__(self, *args, **kwds):
        # begin wxGlade: MyFrame.__init__
        kwds["style"] = kwds.get("style", 0) | wx.DEFAULT_FRAME_STYLE
        wx.Frame.__init__(self, *args, **kwds)
        self.SetSize((475, 300))
        self.SetTitle("frame")

        self.panel_1 = wx.Panel(self, wx.ID_ANY)

        sizer_1 = wx.BoxSizer(wx.VERTICAL)

        sizer_2 = wx.BoxSizer(wx.HORIZONTAL)
        sizer_1.Add(sizer_2, 1, wx.EXPAND, 0)

        self.panel_2 = wx.Panel(self.panel_1, wx.ID_ANY)
        self.panel_2.SetBackgroundColour(wx.Colour(143, 221, 255))
        sizer_2.Add(self.panel_2, 1, wx.EXPAND | wx.RIGHT, 4)

        self.slider_1 = wx.Slider(self.panel_1, wx.ID_ANY, 0, 0, 10, style=wx.SL_VERTICAL)
        sizer_2.Add(self.slider_1, 0, wx.EXPAND | wx.RIGHT, 4)

        self.combo_box_1 = wx.ComboBox(self.panel_1, wx.ID_ANY, choices=[], style=wx.CB_DROPDOWN)
        sizer_2.Add(self.combo_box_1, 0, 0, 0)

        sizer_3 = wx.BoxSizer(wx.HORIZONTAL)
        sizer_1.Add(sizer_3, 0, wx.EXPAND, 0)

        self.radio_box_1 = wx.RadioBox(self.panel_1, wx.ID_ANY, "", choices=["choice 1", "choice 2", "choice 3"], majorDimension=1, style=wx.RA_SPECIFY_COLS)
        self.radio_box_1.SetSelection(0)
        sizer_3.Add(self.radio_box_1, 0, wx.RIGHT, 4)

        self.radio_box_2 = wx.RadioBox(self.panel_1, wx.ID_ANY, "", choices=["choice 4", "choice 5", "choice 6"], majorDimension=1, style=wx.RA_SPECIFY_COLS)
        self.radio_box_2.SetSelection(0)
        sizer_3.Add(self.radio_box_2, 0, wx.RIGHT, 4)

        sizer_4 = wx.BoxSizer(wx.HORIZONTAL)
        sizer_3.Add(sizer_4, 1, wx.ALIGN_CENTER_VERTICAL, 0)

        self.button_1 = wx.Button(self.panel_1, wx.ID_ANY, "button_1")
        sizer_4.Add(self.button_1, 0, wx.RIGHT, 4)

        self.button_2 = wx.Button(self.panel_1, wx.ID_ANY, "button_2")
        sizer_4.Add(self.button_2, 0, wx.RIGHT, 4)

        self.button_3 = wx.Button(self.panel_1, wx.ID_ANY, "button_3")
        sizer_4.Add(self.button_3, 0, 0, 0)

        self.panel_1.SetSizer(sizer_1)

        self.Layout()
        # end wxGlade

# end of class MyFrame

class MyApp(wx.App):
    def OnInit(self):
        self.frame = MyFrame(None, wx.ID_ANY, "")
        self.SetTopWindow(self.frame)
        self.frame.Show()
        return True

# end of class MyApp

if __name__ == "__main__":
    app = MyApp(0)
    app.MainLoop()

This zip file contains the .wxg file: layout_question_1.wxg.zip (1.1 KB)

#4

Many thanks to both of you. RichardT, your code does exactly what I was aiming to do.