Python: tkinder - right way to handle window grid?-CodePudding

My aim is some application with toolbar at top and some table at bottom. The application should look like this:

----------------------------------
' l | m1 | m2 | r |              '
'---------------------------------
' alpha      |   =   |   beta    '
'--------------------------------'
' lb1r           |        lb1l   '
'---------------------------------
' lb2r           |        lb2l   '
'---------------------------------

The headline

----------------------------------
'     '      '      '     '      '
'  l  '  m1  '  m2  '  r  '      '
'     '      '      '     '      '
'---------------------------------

should work as toolbar. The body should be visualized in form of some table.

Unfortunately I am not able to merge cells in the tkinter grid and the application I have at moment looks like this:

-----------------------------------
'             '      '      '     '
'  l          '  m1  '  m2  '  r  '
'             '      '      '     '
'----------------------------------
' alpha       '   =  '      ' beta'
'---------------------------------'
' lb1r        '      '      'lb1l '
'----------------------------------
' lb2r        '      '      'lb2l '
'----------------------------------

How can I resolve my problems in formatting this application?

Edit: I tried to solve that with the tutorial. My problem now is, how can I adjust the width of the blue frame in that way the grid spans all over the red frame.

Means, I want to convert from this

--------------------------------------------------
' l | m1 | m2 | r |                              '
'-------------------------------------------------
'       ' alpha      |   =   |   beta    '       '
'       '--------------------------------'       '
' red   ' lb1r           |        lb1l   '  red  '
'       '---------------------------------       '
'       ' lb2r           |        lb2l   '       '
--------------------------------------------------

to that in the first illustration without the red border and a stretched table.

My edited code:

from tkinter import *


root = Tk()

frm_root = Frame(root,bg='red',width=600)
frm_root.pack()

frm_toolbar = Frame(frm_root, width=600, height=25,bg='green')
frm_tbl     = Frame(frm_root,  bg='blue')


##display_green
frm_toolbar.grid(column = 0, row = 0)
frm_toolbar.pack_propagate(0) #when using pack inside of the display

bt11 = Button(frm_toolbar, text="L")
bt11.pack(side='left')


bt12 = Button(frm_toolbar, text="M1")
bt12.pack(side='left')

bt13 = Button(frm_toolbar, text="M2")
bt13.pack(side='left')

bt14 = Button(frm_toolbar, text="R")
bt14.pack(side='left')

##display_yellow
frm_tbl.grid(column = 0, row = 1)
frm_tbl.pack_propagate(0) #when using pack inside of the display

bt21= Button(frm_tbl, text="Alpha")
bt21.grid(column=0, row = 1)

lb0= Label(frm_tbl, text="=")
lb0.grid(column=1, row = 1,columnspan=2)


bt22 = Button(frm_tbl, text="Beta")
bt22.grid(column=3, row = 1)


lb11 = Label(frm_tbl, text="sadasdasdadadsad")
lb11.grid(column=0, row=2,columnspan=2)


lb12 = Label(frm_tbl, text="lb1r")
lb12.grid(column=2, row=2 ,columnspan=2)

lb21 = Label(frm_tbl, text="lbl1l")
lb21.grid(column=0, row=3, columnspan=2)


lb22 = Label(frm_tbl, text="lb1rasdasdadasd")
lb22.grid(column=2, row=3,columnspan=2)

frm_tbl.grid_columnconfigure(1, weight=1)

root.mainloop()

CodePudding user response：

To achive what you want I have configured your code. I have replaced columnspan with sticky and changed the columns to align them right.

from tkinter import *


root = Tk()

frm_root = Frame(root,bg='red',width=600)
frm_root.pack()

frm_toolbar = Frame(frm_root, width=600, height=25,bg='green')
frm_tbl     = Frame(frm_root,  bg='blue')


##display_green
frm_toolbar.grid(column = 0, row = 0)
frm_toolbar.pack_propagate(0) #when using pack inside of the display

bt11 = Button(frm_toolbar, text="L")
bt11.pack(side='left')


bt12 = Button(frm_toolbar, text="M1")
bt12.pack(side='left')

bt13 = Button(frm_toolbar, text="M2")
bt13.pack(side='left')

bt14 = Button(frm_toolbar, text="R")
bt14.pack(side='left')

##display_yellow
frm_tbl.grid(column = 0, row = 1,sticky='we')
frm_tbl.pack_propagate(0) #when using pack inside of the display

bt21= Button(frm_tbl, text="Alpha")
bt21.grid(column=0, row = 1)

lb0= Label(frm_tbl, text="=")
lb0.grid(column=1, row = 1,sticky='ew')


bt22 = Button(frm_tbl, text="Beta")
bt22.grid(column=2, row = 1,sticky='ew')


lb11 = Label(frm_tbl, text="sadasdasdadadsad")
lb11.grid(column=1, row=2,sticky='ew')


lb12 = Label(frm_tbl, text="lb1r")
lb12.grid(column=2, row=2,sticky='ew')

lb21 = Label(frm_tbl, text="lbl1l")
lb21.grid(column=0, row=3,sticky='ew')

lb22 = Label(frm_tbl, text="lb1rasdasdadasd")
lb22.grid(column=2, row=3)

frm_tbl.grid_columnconfigure(1, weight=1)

root.mainloop()

Reconsidering your initial code, you also could go with columnspan. In addition, it makes things clearer if you sort your code for functional blocks like:

from tkinter import *

root = Tk()
root.title("BasicWindow")

#widget construction
bt11 = Button(root, text="L")
bt12 = Button(root, text="M1")
bt13 = Button(root, text="M2")
bt14 = Button(root, text="R")
bt21= Button(root, text="Alpha")
lb0= Label(root, text="=")
bt22 = Button(root, text="Beta")
lb11 = Label(root, text="lbl1l")
lb12 = Label(root, text="lb1r")
lb21 = Label(root, text="lbl1l")
lb22 = Label(root, text="lb1r")
#widget placement
bt11.grid(column=0, row=0,sticky='ew')
bt12.grid(column=1, row=0)
bt13.grid(column=2, row=0)
bt14.grid(column=3, row=0,sticky='ew')
bt21.grid(column=0, row=1)
lb0.grid(column=1, row=1,columnspan=2)
bt22.grid(column=3, row=1)
lb11.grid(column=0, row=2)
lb12.grid(column=3, row=2)
lb21.grid(column=0, row=3)
lb22.grid(column=3, row=3)


root.mainloop()