Expanding widgets to fill the panel in Tkinter? - python

I'm trying to create a simple UI in Python/Tkinter with an Entry widget, a Text widget, and two Buttons side-by-side. I'd like all the widgets to expand in width as the window expands, and the Text widget to expand in height as the window expands as well.
I've searched a whole bunch and what always comes up is assigning a non-zero weight in the grid, but I think I'm doing that already; but when I resize, the widgets stay centered in the grid rather than actually expanding to meet the window size.
Here's what I have now; any suggestions?
class EditWindow(Frame):
def __init__(self, master=None):
super().__init__(master)
self.master = master
self.pack()
self.create_widgets()
def create_widgets(self):
self.grid()
self.subject_box = Entry(self)
self.subject_box.insert(0, "Some text")
self.subject_box.grid(column=0, columnspan=2, row=0, sticky="NSEW")
self.content_box = Text(self)
self.content_box.insert(END, "Other text")
self.content_box.grid(column=0, columnspan=2, row=1, sticky="NSEW")
self.done_button = Button(self)
self.done_button["text"] = "Done (Temporary Change)"
self.done_button["command"] = self.done
self.done_button.grid(column=0, row=2, sticky="NSEW")
self.done_and_save_button = Button(self)
self.done_and_save_button["text"] = "Done (Permanently Save Changes)"
self.done_and_save_button["command"] = self.done_and_save
self.done_and_save_button.grid(column=1, row=2, sticky="NSEW")
Grid.rowconfigure(self.master, 0, weight=1)
Grid.rowconfigure(self.master, 1, weight=1)
Grid.rowconfigure(self.master, 2, weight=1)
Grid.columnconfigure(self.master, 0, weight=1)
def done(self):
self.save_changes = False
self.master.destroy()
def done_and_save(self):
self.save_changes = True
self.master.destroy()

The widgets all exist inside EditWindow, so you need to call rowconfigure and columnconfigure on self, not self.master. This code shouldn't do anything with master except use it as the master for itself. This code should also not call self.pack() or self.grid().
The code which creates the instance of EditWindow needs to be responsible for calling pack, place, or grid. When a widget calls one of the geometry manager commands on itself, it requires that the widget knows how it is being used by the master. This limits reusability and too tightly binds the class to the code that uses the class.
Here's a complete example which has the following changes:
removed self.pack from __init__
removed self.grid() from create_widgets
changed the Grid commands to operate on self rather than self.master
called pack with appropriate options from the same scope that created the instance of EditWindow.
from tkinter import *
class EditWindow(Frame):
def __init__(self, master=None):
super().__init__(master)
self.master = master
self.create_widgets()
def create_widgets(self):
self.subject_box = Entry(self)
self.subject_box.insert(0, "Some text")
self.subject_box.grid(column=0, columnspan=2, row=0, sticky="NSEW")
self.content_box = Text(self)
self.content_box.insert(END, "Other text")
self.content_box.grid(column=0, columnspan=2, row=1, sticky="NSEW")
self.done_button = Button(self)
self.done_button["text"] = "Done (Temporary Change)"
self.done_button["command"] = self.done
self.done_button.grid(column=0, row=2, sticky="NSEW")
self.done_and_save_button = Button(self)
self.done_and_save_button["text"] = "Done (Permanently Save Changes)"
self.done_and_save_button["command"] = self.done_and_save
self.done_and_save_button.grid(column=1, row=2, sticky="NSEW")
Grid.rowconfigure(self, 0, weight=1)
Grid.rowconfigure(self, 1, weight=1)
Grid.rowconfigure(self, 2, weight=1)
Grid.columnconfigure(self, 0, weight=1)
def done(self):
self.save_changes = False
self.master.destroy()
def done_and_save(self):
self.save_changes = True
self.master.destroy()
root = Tk()
ew = EditWindow(root)
ew.pack(fill="both", expand=True)
root.mainloop()

Related

Resizing Canvas with Scrollbar dynamically by using the layout_manager grid

I built a canvas and I don't know why, I wont make it to resize with the frame.
Either something obvious is missing and by craftig all the stuff inside I lost my mind or something weird happens and I dont get it. Anyway here is my code, hope it can be clearify.
import tkinter as tk
root = tk.Tk()
class my_figure(tk.Frame):
def __init__(self, master,
width=450,height=590):
tk.Frame.__init__(self, master)
self.master = master
self.width=width
self.bind("<Configure>", self.update)
#DownFrame
self.body = tk.Frame(self, width=width,height=height,relief='sunken',bd=2)
self.vscrbar = tk.Scrollbar(self.body)
self.hscrbar = tk.Scrollbar(self.body,orient=tk.HORIZONTAL)
self.Display = tk.Canvas(self.body, width=width,height=height,
background='#f0f0f0',highlightthickness=0,
yscrollcommand=self.vscrbar.set,
xscrollcommand=self.hscrbar.set)
self.vscrbar.config(command=self.Display.yview)
self.hscrbar.config(command=self.Display.xview)
self.body.grid(column=0,row=1, sticky='nswe')
self.vscrbar.grid(column=1,sticky='ns')
self.hscrbar.grid(row=1,sticky='we')
self.Display.grid(column=0,row=0,
sticky='nswe')
self.grid_rowconfigure(1, weight=1)
self.columnconfigure(0, weight=1)
def update(self, event):
print(event.widget.winfo_width())
## self.Header.config(width=event.width)
## self.Button.config(width=event.width)
## self.body.config(width=event.width)
## self.Display.config(width=event.width)
figure = my_figure(root)
figure.grid(column=0, row=0)
root.grid_columnconfigure(0, weight=1)
root.grid_rowconfigure(0,weight=1)
root.mainloop()
You used nested parent container.Your my_figure is a widget inherit from Frame.And there are also a Frame widget in your my_figure.You need to set columnconfigure and rowconfigure for both of them.
Also need to use sticky="nwes" for your figure.
Though it could work normally,pack manager would be the best choice.
Code:
import tkinter as tk
root = tk.Tk()
class my_figure(tk.Frame):
def __init__(self, master):
tk.Frame.__init__(self, master)
self.master = master
# self["bd"] = 10
self.bind("<Configure>", self.update)
# DownFrame
self.body = tk.Frame(self, relief='sunken')
for i in range(self.body.grid_size()[1] + 1):
self.body.grid_rowconfigure(i, weight=1)
for i in range(self.body.grid_size()[0] + 1):
self.body.grid_columnconfigure(i, weight=1)
for i in range(self.grid_size()[1] + 1):
self.grid_rowconfigure(i, weight=1)
for i in range(self.grid_size()[0] + 1):
self.grid_columnconfigure(i, weight=1)
self.vscrbar = tk.Scrollbar(self.body)
self.hscrbar = tk.Scrollbar(self.body, orient=tk.HORIZONTAL)
self.Display = tk.Canvas(self.body,
background='#f0f0f0', highlightthickness=0,
yscrollcommand=self.vscrbar.set,
xscrollcommand=self.hscrbar.set)
self.vscrbar.config(command=self.Display.yview)
self.hscrbar.config(command=self.Display.xview)
self.body.grid(column=0, row=0, sticky='nswe')
self.vscrbar.grid(row=0, column=1, sticky='ns')
self.hscrbar.grid(row=1, column=0, sticky='we')
self.Display.grid(column=0, row=0,
sticky='nswe')
def update(self, event):
print(event.widget.winfo_width())
## self.Header.config(width=event.width)
## self.Button.config(width=event.width)
## self.body.config(width=event.width)
## self.Display.config(width=event.width)
figure = my_figure(root)
figure.grid(column=0, row=0, sticky="nwes")
root.grid_columnconfigure(0, weight=1)
root.grid_rowconfigure(0,weight=1)
root.mainloop()

Resize button in Tkinter GUI Python

I've created a simple GUI application with Tkinter.
I have two questions about this code:
import tkinter as tk
from tkinter import ttk, Grid, Frame, N, S, W, E, StringVar, Label, Entry, RAISED, Button, Checkbutton, Scrollbar
class mainApp(Frame):
def __init__(self, parent):
Frame.__init__(self, parent)
self.parent = parent
self.scan_button = Button(self.parent, text="Scan", command=self.scan_wifi)
self.forget_button = Button(self.parent, text="Forget", command=self.forget_wifi)
self.reboot_button = Button(self.parent, text="Reboot", command=self.reboot)
frame=Frame(self.parent)
Grid.rowconfigure(self.parent, 0, weight=1)
Grid.columnconfigure(self.parent, 0, weight=1)
frame.grid(row=0, column=0, sticky=N+S+E+W)
grid=Frame(self.parent)
grid.grid(sticky=N+S+E+W, column=0, row=7, columnspan=2)
Grid.rowconfigure(self.parent, 7, weight=1)
Grid.columnconfigure(self.parent, 0, weight=1)
headings=('Name', 'Address', 'Quality', 'Channel', 'Signal Level', 'Encryption')
row=[]
rows=[]
self.table = ttk.Treeview(show="headings", selectmode="browse")
self.table["columns"]=headings
self.table["displaycolumns"]=headings
for head in headings:
self.table.heading(head, text=head, anchor=tk.CENTER)
self.table.column(head, width=30, anchor=tk.CENTER)
self.scrolltable = tk.Scrollbar(command=self.table.yview)
self.table.configure(yscrollcommand=self.scrolltable.set)
self.scrolltable.grid(row=1, column=100, sticky=N+S)
for row in rows:
self.table.insert('', tk.END, values=tuple(row))
self.table.bind('<ButtonRelease-1>', self.OnRelease)
self.table.grid(row=0, rowspan=14, columnspan = 21, sticky=N+S+E+W)
self.scan_button.grid(row=15, column = 1, columnspan = 1, sticky=N+S+E+W)
self.forget_button.grid(row=15, column = 0, columnspan = 1 , sticky=N+S+E+W)
self.reboot_button.grid(row=15, column = 3, columnspan = 1 , sticky=N+S+E+W)
def OnRelease(self, event):
pass
def scan_wifi(self):
pass
def forget_wifi(self):
pass
def reboot(self):
pass
root=tk.Tk()
app = mainApp(root)
root.mainloop()
1) How I can move the button on the top of the window?
2) Why, if I resize the window, the button "Forget" becomes bigger than other buttons? How I can make all buttons identical size?
Because you have called columnconfigure(0, weight=1) only, therefore only the Forget button will be resized when the window is resized.
To move the buttons to the top of the window, you need to rearrange the buttons to row=0 and the Treeview to row=1. Below is modified code based on yours:
import tkinter as tk
from tkinter import ttk
class mainApp(tk.Frame):
def __init__(self, parent):
tk.Frame.__init__(self, parent)
self.parent = parent
# buttons
self.forget_button = tk.Button(self.parent, text='Forget', command=self.forget_wifi)
self.scan_button = tk.Button(self.parent, text='Scan', command=self.scan_wifi)
self.reboot_button = tk.Button(self.parent, text='Reboot', command=self.reboot)
self.forget_button.grid(row=0, column=0, sticky='nsew')
self.scan_button.grid(row=0, column=1, sticky='nsew')
self.reboot_button.grid(row=0, column=2, sticky='nsew')
# make the 3 buttons same width
for i in range(3):
self.parent.columnconfigure(i, weight=1)
# make the treeview and the scrollbar to fill the remaining space
self.parent.rowconfigure(1, weight=1)
# treeview and scrollbar
frame = tk.Frame(self.parent)
frame.grid(row=1, column=0, columnspan=3, sticky='nsew')
headings=('Name', 'Address', 'Quality', 'Channel', 'Signal Level', 'Encryption')
self.table = ttk.Treeview(frame, show='headings', selectmode='browse')
self.table['columns'] = headings
self.table['displaycolumns'] = headings
for head in headings:
self.table.heading(head, text=head, anchor=tk.CENTER)
self.table.column(head, width=30, anchor=tk.CENTER)
self.scrolltable = tk.Scrollbar(frame, command=self.table.yview)
self.table.configure(yscrollcommand=self.scrolltable.set)
self.table.pack(side=tk.LEFT, fill=tk.BOTH, expand=1)
self.scrolltable.pack(side=tk.RIGHT, fill=tk.Y)
self.table.bind('<ButtonRelease-1>', self.OnRelease)
def OnRelease(self, event):
pass
def scan_wifi(self):
pass
def forget_wifi(self):
pass
def reboot(self):
pass
root=tk.Tk()
app = mainApp(root)
root.mainloop()

Strange behavior of frames in tkinter

I have a project I am working on and it requires me to update a frame with new page information depending on what button is clicked.
I have 2 frames in the main page. One frame holds the buttons and the other frame is to be updated on button click. However when I click on a button it seams to remove both buttons and set up the new page on the first frame.
I don't see how this is possible as I have check each frame and they should be separate.
When I run the test1.py page I get this window as expected:
However this is what I get when I press one of the buttons:
I should expect to see the 2 buttons still there and the label now to the right of the buttons. I really cant see how this could be happening.
Here are my example pages.
test1.py contains:
import tkinter as tk
import test2
import test3
class TestApp(tk.Frame):
def __init__(self, master, *args, **kwargs):
tk.Frame.__init__(self, master, *args, **kwargs)
self.button_frame = tk.Frame(self)
self.button_frame.grid(row=0, column=0)
self.working_frame = tk.Frame(self)
self.working_frame.grid(row=0, column=1)
tk.Button(self.button_frame, text="Test 2", command=lambda: self.update_main_frame("test2")).grid(row=0, column=0)
tk.Button(self.button_frame, text="Test 3", command=lambda: self.update_main_frame("test3")).grid(row=1, column=0)
def update_main_frame(self, window_name):
if window_name == "test2":
self.reset_working_frame()
x = test2.TestFrame2(self.working_frame)
x.grid(row=0, column=0, sticky="nsew")
if window_name == "test3":
self.reset_working_frame()
x = test3.TestFrame3(self.working_frame)
x.grid(row=0, column=0, sticky="nsew")
def reset_working_frame(self):
self.working_frame.destroy()
self.working_frame = tk.Frame(self)
self.working_frame.grid(row=0, column=1)
if __name__ == "__main__":
root = tk.Tk()
TestApp(root).grid(row=0, column=0, sticky="nsew")
tk.mainloop()
test2.py contains:
import tkinter as tk
class TestFrame2(tk.Frame):
def __init__(self, parent):
tk.Frame.__init__(self)
self.parent = parent
self.internal_frame = tk.Frame(self)
self.internal_frame.grid(row=0, column=0, sticky="nsew")
tk.Label(text="some small label").grid(row=0, column=0)
test3.py contains:
import tkinter as tk
class TestFrame3(tk.Frame):
def __init__(self, parent):
tk.Frame.__init__(self)
self.parent = parent
self.internal_frame = tk.Frame(self)
self.internal_frame.grid(row=0, column=0, sticky="nsew")
tk.Label(text="some larger label!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!").grid(row=0, column=0)
You didn't give a parent frame to the TestFrame or the Label, so both default to root. Try this:
class TestFrame2(tk.Frame):
def __init__(self, parent):
tk.Frame.__init__(self, parent) # add parent Frame
self.parent = parent
self.internal_frame = tk.Frame(self)
self.internal_frame.grid(row=0, column=0, sticky="nsew")
lbl = tk.Label(self.internal_frame, text="some small label") # add parent Frame
lbl.grid(row=0, column=0)
Also, putting the initialization and layout on the same line leads to bugs. Use 2 lines.

Tkinter: Code stops and window doesn't show up

I am working on a very basic interface on Python with Tkinter, that displays two input boxes and a button to login. I try to do it by creating different frames and change the frame when the user is logged. It was working nearly fine but then the code started to execute itself not entirely sometimes and entirely but without the Tkinter window. I looked into it and saw nothing shocking but I am not an expert so I am looking for help.
This is the code to run my class that implement Tkinter window:
print 1
app = Skeleton("HomePage")
print 2
app.mainloop()
print 3
The skeleton Class that implement the Tkinter window:
class Skeleton(Tk):
def __init__(self, f,*args, **kwags):
Tk.__init__(self,*args, **kwags)
self.title(f)
container = Frame(self, width=512, height=512)
container.pack(side="top", fill="both", expand=True)
container.grid_rowconfigure(0, weight=1)
container.grid_columnconfigure(0, weight=1)
self.frames = {}
frameName = {"home","upload","retrieve","deconnected"}
self.frames["HomePage"] = HomePage(parent= container, controller=self)
self.frames["HomePage"].grid(row=0, column=0, sticky="nsew")
print 321
self.show_frame("HomePage")
def show_frame(self, page_name):
'''Show a frame for the given page name'''
print "Je vais te montrer mon frame"
frame = self.frames[page_name]
frame.tkraise()
And the code of the Home Page frame:
class HomePage(Frame):
def __init__(self, parent, controller):
Frame.__init__(self, parent)
self.parent = parent
self.controller = controller
#print ("Construction de la page dáccueil")
#LABEL
self.username = Label(self, text="Username:")
self.username.grid(row =0,column =0)
self.username.pack()
#ENTRY
self.username_txb = Entry( self)
self.username_txb.focus_set()
self.username_txb.grid(row =0,column =1)
self.username_txb.pack(side=LEFT)
#LABEL
self.pass_lbl = Label(self, text="Password:")
self.pass_lbl.grid(row =0,column =2)
#ENTRY
self.password_txb = Entry( self, text="Password", show = "*")
self.password_txb.grid(row =0,column =3)
self.password_txb.pack(side=LEFT)
#LOGIN BUTTON
self.login_btn = Button(self, text="Login", command=lambda: controller.show_frame("UploadPage"))
self.login_btn.grid(row =0,column =4)
self.login_btn.pack(side=LEFT)
self.info_pane = PanedWindow()
self.info_pane.grid(row =1,column =0)
self.info_pane.pack(fill="none", expand=True, side=BOTTOM)
self.info_lbl = Label(self, text="More information about access:", fg="blue", cursor="hand2")
self.contact_lbl = Label(self, text="Contact us", fg="blue", cursor="hand2")
self.contact_lbl.grid(row =2,column =0)
self.contact_lbl.pack()
self.contact_lbl.bind("<Button-1>", self.callback)
print ("123Construction de la page dáccueil")
#self.parent.update()
def callback(self, event):
pass
def connect(self,controller ):
login = self.username_txb.get()
pwd = self.password_txb.get()
if(login == "a" and pwd == "a"):
print "Valid account"
self.controller.show_frame("UploadPage")
#UploadPage frame is implemented
The output everytime I execute the code is as following:
1
123Construction de la page dáccueil
Thank you in advance for the help. Hope this will help other people.
First lets address your use of pack() and grid().
Due to how tkinter is set up you cannot use both pack() and grid() on the same widget in a frame or window at one time.
You may use for example pack() to pack the main frame and grid() on the widgets inside that frame but you cannot use both in side the frame.
If one of your issues is where each widget is located and if it is expanding with the window you can manage all that inside of grid() so we can just use grid() here as its what I prefer when writing up a GUI.
Next we need to look at your call to show_frame as you are attempting to show a frame that does not exist in self.frames in the code you have presented us.
I have created a new class so your program can be tested with this line of code:
self.controller.show_frame("UploadPage")
The new class just makes a basic frame with a label in it showing that the frame does rise properly with tkrise().
I did some general clean up as your show_frame method was taking unnecessary steps to raise the frame, your method of importing tkinter is not the best option and some other quality corrections.
Instead of using:
frame = self.frames[page_name]
frame.tkraise()
We can simplify this method with just one line like this:
self.frames[page_name].tkraise()
I have also changed how you are importing tkinter as importing with * can sometimes cause problems if you inadvertently override build in methods. The best option is to import tkinter like this:
import tkinter as tk
Take a look at the below code and let me know if you have any questions. It should provide the info you need to allow the HomePage frame and UploadPage frame to work as intended.
import tkinter as tk
class Skeleton(tk.Tk):
def __init__(self, f,*args, **kwags):
tk.Tk.__init__(self,*args, **kwags)
self.title(f)
self.container = tk.Frame(self, width=512, height=512)
self.container.grid(row=0, column=0, sticky="nsew")
self.container.grid_rowconfigure(0, weight=1)
self.container.grid_columnconfigure(0, weight=1)
self.frames = {}
self.frames["HomePage"] = HomePage(parent=self.container, controller=self)
self.frames["HomePage"].grid(row=0, column=0, sticky="nsew")
self.frames["UploadPage"] = UploadPage(parent=self.container)
self.frames["UploadPage"].grid(row=0, column=0, sticky="nsew")
self.show_frame("HomePage")
def show_frame(self, page_name):
self.frames[page_name].tkraise()
class HomePage(tk.Frame):
def __init__(self, parent, controller):
tk.Frame.__init__(self, parent)
self.parent = parent
self.controller = controller
self.username = tk.Label(self, text="Username:")
self.username.grid(row =0,column =0)
self.username_txb = tk.Entry(self)
self.username_txb.focus_set()
self.username_txb.grid(row=0, column=1)
self.pass_lbl = tk.Label(self, text="Password:")
self.pass_lbl.grid(row =0,column =2)
self.password_txb = tk.Entry(self, text="Password", show="*")
self.password_txb.grid(row =0,column =3)
self.login_btn = tk.Button(self, text="Login", command=self.connect)
self.login_btn.grid(row=0, column=4)
self.info_pane = tk.PanedWindow()
self.info_pane.grid(row=1, column=0)
self.info_lbl = tk.Label(self, text="More information about access:", fg="blue", cursor="hand2")
self.contact_lbl = tk.Label(self, text="Contact us", fg="blue", cursor="hand2")
self.contact_lbl.grid(row=2, column=0)
self.contact_lbl.bind("<Button-1>", self.callback)
def callback(self, event):
pass
# webbrowser.open_new("https://www.tno.nl/nl/")
# I do not have the import for this webbrowser so I disabled it for testing.
def connect(self):
login = self.username_txb.get()
pwd = self.password_txb.get()
if(login == "a" and pwd == "a"):
self.controller.show_frame("UploadPage")
class UploadPage(tk.Frame):
def __init__(self, parent):
tk.Frame.__init__(self, parent)
tk.Label(self, text="This upload frame is a test to see if your code is working").grid(row=0, column=0)
if __name__ == "__main__":
app = Skeleton("HomePage")
app.mainloop()

Tk grid won't resize properly

I'm trying to write a simple ui with Tkinter in python and I cannot get the widgets within a grid to resize. Whenever I resize the main window the entry and button widgets do not adjust at all.
Here is my code:
class Application(Frame):
def __init__(self, master=None):
Frame.__init__(self, master, padding=(3,3,12,12))
self.grid(sticky=N+W+E+S)
self.createWidgets()
def createWidgets(self):
self.dataFileName = StringVar()
self.fileEntry = Entry(self, textvariable=self.dataFileName)
self.fileEntry.grid(row=0, column=0, columnspan=3, sticky=N+S+E+W)
self.loadFileButton = Button(self, text="Load Data", command=self.loadDataClicked)
self.loadFileButton.grid(row=0, column=3, sticky=N+S+E+W)
self.columnconfigure(0, weight=1)
self.columnconfigure(1, weight=1)
self.columnconfigure(2, weight=1)
app = Application()
app.master.title("Sample Application")
app.mainloop()
Add a root window and columnconfigure it so that your Frame widget expands too. That's the problem, you've got an implicit root window if you don't specify one and the frame itself is what's not expanding properly.
root = Tk()
root.columnconfigure(0, weight=1)
app = Application(root)
I use pack for this. In most cases it is sufficient.
But do not mix both!
class Application(Frame):
def __init__(self, master=None):
Frame.__init__(self, master)
self.pack(fill = X, expand =True)
self.createWidgets()
def createWidgets(self):
self.dataFileName = StringVar()
self.fileEntry = Entry(self, textvariable=self.dataFileName)
self.fileEntry.pack(fill = X, expand = True)
self.loadFileButton = Button(self, text="Load Data", )
self.loadFileButton.pack(fill=X, expand = True)
A working example. Note that you have to explicitly set the configure for each column and row used, but columnspan for the button below is a number greater than the number of displayed columns.
## row and column expand
top=tk.Tk()
top.rowconfigure(0, weight=1)
for col in range(5):
top.columnconfigure(col, weight=1)
tk.Label(top, text=str(col)).grid(row=0, column=col, sticky="nsew")
## only expands the columns from columnconfigure from above
top.rowconfigure(1, weight=1)
tk.Button(top, text="button").grid(row=1, column=0, columnspan=10, sticky="nsew")
top.mainloop()

Categories