I have an app with 1 video frame and 5 Buttons. I want the video frame on top and the buttons nicely under the frame all in one row.
Here is my code:
self.root = tki.Tk()
self.panel = None
#create a button, that when pressed, will take the current
#frame and save it to file
btn= tki.Button(self.root, text="Snapshot!", command=self.takeSnapshot)
btn.grid(sticky = tki.S)
btnturnl= tki.Button(self.root, text="Left", command = self.EinsRechts)
btnturnl.grid(sticky = tki.SW)
btnturnl2= tki.Button(self.root, text="Two Left", command = self.ZweiRechts)
btnturnl2.grid(sticky = tki.SW)
btnturnr= tki.Button(self.root, text="Right", command = self.EinsLinks)
btnturnr.grid(sticky = tki.SE)
btnturnr2= tki.Button(self.root, text="Two Right", command = self.ZweiLinks)
btnturnr2.grid(sticky = tki.SE)
self.panel = tki.Label(image=image) #in this panel the video feed gets shown
self.panel.image = image
self.panel.grid(sticky = tki.N)
This is how it really looks:
what am I doing wrong?
I am not that experienced with Tkinter so if I maybe have missed a function that would be better suited for me I'd gladly change my code.
If you have questions feel free to ask and thanks for the help.
You are missing the actual column and row arguments:
http://effbot.org/tkinterbook/grid.htm#patterns
take this example to achieve what you want .Using the row and column works like excel worksheet so you can increase the value position it where you want it.
btn= tki.Button(self.root, text="Snapshot!", command=self.takeSnapshot)
btn.grid(row=1 , column=2, sticky = tki.S)
btnturnl= tki.Button(self.root, text="Left", command = self.EinsRechts)
btnturnl.grid(row=3 , column=5, sticky = tki.SW)
Replace:
btn.grid(sticky = tki.S)
...
btnturnl.grid(sticky = tki.SW)
...
btnturnl2.grid(sticky = tki.SW)
...
btnturnr.grid(sticky = tki.SE)
...
btnturnr2.grid(sticky = tki.SE)
...
self.panel.grid(sticky = tki.N)
with:
btn.grid(row=1, column=0, sticky = tki.S)
...
btnturnl.grid(row=1, column=1, sticky = tki.SW)
...
btnturnl2.grid(row=1, column=2, sticky = tki.SW)
...
btnturnr.grid(row=1, column=3, sticky = tki.SE)
...
btnturnr2.grid(row=1, column=4, sticky = tki.SE)
...
self.panel.grid(row=0, column=0, columnspan=5, sticky = tki.N)
If you don't specify row or column numbers in a grid call row defaults to last_row_no + 1 and column defaults to 0.
Review below the code snippets that produce identical GUIs:
import tkinter as tk
root = tk.Tk()
label = tk.Label(root, text="Label")
button = tk.Button(root, text="Button")
label.grid() # implicit
button.grid()
root.mainloop()
is identical to:
import tkinter as tk
root = tk.Tk()
label = tk.Label(root, text="Label")
button = tk.Button(root, text="Button")
label.grid(row=0, column=0) # explicit
button.grid(row=1, column=0)
root.mainloop()
It is suggested to be explicit, latter is the better code, to quote zen of python(import this):
"Explicit is better than implicit."
Related
This is a part of code from my school project.
from tkinter import *
from tkinter.font import Font
class student_window():
def __init__(self, master):
self.student_win = master
#window = Toplevel(self.master)
self.student_win.geometry("1280x720")
self.header1Font = Font(family='Helvetica', size=20)
self.optionFont = Font(family='Sans Serrif', size=20)
self.student_win.focus()
self.show_window()
def show_window(self):
print("ookk")
self.student_win.title("Student Window")
self.option_frame = Frame(self.student_win, width=200, height=720)
lbl_header = Label(self.option_frame,text="EXAMINATION", font=self.header1Font, fg='white', bg='#172D44').grid(row=0,column=0, sticky=NSEW)
lbl_welcome = Label(self.option_frame, text="Welcome,", fg='#E9F1F7', bg='#2A3F54').grid(row=1,column=0)
lbl_username = Label(self.option_frame, text="Username", fg='white', bg='#2A3F54').grid(row=2,column=0)
lbl_header2 = Label(self.option_frame, text="STUDENT CORNER", fg='white', bg='#2A3F54').grid(row=3, column=0)
self.btn_tests = Button(self.option_frame, text="Attempt Exam", fg='#E9F1F7', bg='#35495D', relief=FLAT)
self.btn_tests.grid(row=4,column=0, sticky=NSEW)
self.btn_attempts = Button(self.option_frame, text="Attempts", fg='#E9F1F7', bg='#2A3F54', relief=FLAT)
self.btn_attempts.grid(row=5, column=0, sticky=NSEW)
self.btn_result = Button(self.option_frame, text="Result", fg='#E9F1F7', bg='#2A3F54', relief=FLAT)
self.btn_result.grid(row=6, column=0, sticky=NSEW)
self.btn_goBack = Button(self.option_frame, text="Go Back", fg='#E9F1F7', bg='#2A3F54', relief=FLAT)
self.btn_goBack.grid(row=7, column=0, sticky=NSEW)
self.option_frame.configure(bg='#2A3F54')
self.option_frame.grid(row=0, column=0)
self.option_frame.grid_propagate(0)
self.main_frame = Frame(self.student_win, width=880, height=720)
self.main_result_frame = Frame(self.main_frame)
self.main_result_frame.grid(row=0,column=0)
self.attempts_frame = Frame(self.main_frame)
self.attempts_frame.grid(row=0, column=0)
self.test_frame = Frame(self.main_frame)
lbl_test = Label(self.test_frame, text="In test frame").pack()
self.test_frame.grid(row=0,column=0)
self.main_frame.grid(row=0,column=1)
self.main_frame.grid_propagate(0)
self.info_frame = Frame(self.student_win, width=200, height=720)
self.btn_username = Button(self.info_frame, text="Username", relief=FLAT)
self.btn_username.grid(row=0,column=0)
self.userInfo_frame = Frame(self.info_frame)
self.info_frame.grid(row=0, column=2)
self.info_frame.grid_propagate(0)
root = Tk()
student_window(root)
root.mainloop()
And it looks something like this.
The Student Panel for my project
The whole window is divided into three frames and want to expand each label and button of the left frame(self.option_frame) to fill it horizontally. I tried doing sticky=EW and sticky=NSEW but still some space is left. How do I fix that?
You need to call self.option_frame.columnconfigure(0, weight=1) to make column 0 to use all the available horizontal space.
I was just trying some things and what I have found to be working is to make the label width bigger than than the frame then anchoring the text to the left.
I started using TK in python to build a graphical interface for my program.
I'm not able to fix 2 issues concerning (1) the position of a button in the window and (2) use a value of a radiobutton inside a fucntion.
This is my current code:
root = tk.Tk()
root.title("START")
root.geometry("500x200+500+200")
v = tk.IntVar()
v.set(0) # initializing the choice
my_choise = [
("Basic",1),
("Advanced",2),
('Extreme',3)
]
def ShowChoice():
print(v.get())
tk.Label(root,
text="""Choose your configuration:""",
justify = tk.LEFT,
padx = 20).pack()
val = 0
for val, choise in enumerate(my_choise):
tk.Radiobutton(root,text=choise,padx = 20,variable=v,command=ShowChoice,value=val).pack(anchor=tk.W)
def star_program(value):
os.system("ifconfig")
def open_comments_file():
os.system("gedit /home/user/Desktop/comments.txt")
def open_links_file():
os.system("gedit /home/user/Desktop/links.txt")
frame = tk.Frame(root)
frame.pack()
open_file_c = tk.Button(frame,
text="Comments",
command=open_comments_file)
open_file_f = tk.Button(frame,
text="Links",
command=open_links_file)
button = tk.Button(frame,
text="Start",
command=star_program(v.get()))
button.pack(side=tk.LEFT)
open_file_f.pack(side=tk.LEFT)
open_file_c.pack(side=tk.LEFT)
slogan = tk.Button(frame,
text="Cancel",
command=quit)
slogan.pack(side=tk.LEFT)
root.mainloop()
I would like that the buttons "Links" and "Comments" were positioned below the radiobutton, one below the other. Now, all buttons are in line, but I would like to have "start" and "cancel" at the bottom of my window.
Then I tried to use the value of the radiobutton (choice) inside the star_program function. It does not work. My idea is, based on the choice selected in the radiobutton, perform different actions when I click the button "start":
def star_program(value):
if value == 0:
os.system("ifconfig")
else:
print "Goodbye"
In addition, concerning "start" button, I have a strange behavior. The program runs "ifconfig" command also if I don't click on "start". And If I click "start" it does not perform any action.
Any suggestion?
Thanks!!!
i'm assuming this is more like what you're after:
root = tk.Tk()
root.title("START")
root.geometry("500x200+500+200")
v = tk.IntVar()
v.set(0) # initializing the choice
my_choise = [
("Basic",1),
("Advanced",2),
('Extreme',3)
]
def ShowChoice():
print(v.get())
tk.Label(root,
text="""Choose your configuration:""",
justify = tk.LEFT,
padx = 20).grid(column=1, row=0, sticky="nesw") # use grid instead of pack
root.grid_columnconfigure(1, weight=1)
val = 0
for val, choise in enumerate(my_choise):
tk.Radiobutton(root,text=choise,padx = 20,variable=v,command=ShowChoice,value=val).grid(column=1, row=val+1, sticky="nw")
def star_program(value):
os.system("ifconfig")
def open_comments_file():
os.system("gedit /home/user/Desktop/comments.txt")
def open_links_file():
os.system("gedit /home/user/Desktop/links.txt")
frame = tk.Frame(root)
frame.grid(column=1, row=4, sticky="nesw")
open_file_c = tk.Button(frame,
text="Comments",
command=open_comments_file)
open_file_f = tk.Button(frame,
text="Links",
command=open_links_file)
button = tk.Button(frame,
text="Start",
command=lambda: star_program(v.get()))
# use lambda to create an anonymous function to be called when button pushed,
needed for functions where arguments are required
button.grid(column=2, row=3, sticky="nesw")
open_file_f.grid(column=1, row=1, sticky="nesw")
open_file_c.grid(column=1, row=2, sticky="nesw")
slogan = tk.Button(frame,
text="Cancel",
command=quit)
slogan.grid(column=4, row=3, sticky="nesw")
root.mainloop()
The problem with the "start" button is due to the function definition.
This is the right code that does not trigger any action if you don't click the button:
button = tk.Button(frame,
text="Start",
command=star_program)
When the application is run first, the last frame's widgets are displayed on the screen. What i wanted to do is, displaying the related frames when the user clicks their buttons. So, i want to display a blank frame with the top buttons. In order to do that, what should i do? (I removed the button functions, because they are not related to the question.) Thanks in advance.
import tkinter as tk
class TopFrame(tk.Frame):
def __init__(self, master=None):
tk.Frame.__init__(self, master)
self.grid(row=0, column=0, sticky="nsew")
self.BottomFrame = tk.Frame(master=master)
self.BottomFrame.grid(row=1, column=0, sticky="nsew")
self.f1 = tk.Frame(master=self.BottomFrame)
self.f2 = tk.Frame(master=self.BottomFrame)
self.f3 = tk.Frame(master=self.BottomFrame)
for f in (self.f1, self.f2, self.f3):
f.grid(row=0, column=0, sticky="nsew")
self.b1 = tk.Button(master=self, text="Add Words")
self.b2 = tk.Button(master=self, text="Add From File")
self.b3 = tk.Button(master=self, text="Change Words")
self.add_button = tk.Button(master=self.f1, text="Add")
self.open_button = tk.Button(master=self.f2, text="Open File")
self.change_button = tk.Button(master=self.f3, text="Change")
self.l1 = tk.Label(master=self.f1, text="English")
self.l2 = tk.Label(master=self.f1, text="Turkish")
self.l3 = tk.Label(master=self.f3, text="Old word")
self.l4 = tk.Label(master=self.f3, text="New word")
self.e1 = tk.Entry(master=self.f1)
self.e2 = tk.Entry(master=self.f1)
self.e3 = tk.Entry(master=self.f3)
self.e4 = tk.Entry(master=self.f3)
self.configure_buttons()
self.configure_labels()
self.configure_entries()
def configure_buttons(self):
self.b1.grid(row=0, column=0)
self.b1.configure(command=lambda: self.f1.tkraise())
self.b2.grid(row=0, column=1)
self.b2.configure(command=lambda: self.f2.tkraise())
self.b3.grid(row=0, column=2)
self.b3.configure(command=lambda: self.f3.tkraise())
self.add_button.grid(row=2, columnspan=2)
#self.add_button.configure(command=self.add_word)
self.open_button.pack(side="top")
#self.open_button.configure(command=self.add_from_file)
self.change_button.grid(row=2, columnspan=2)
def configure_labels(self):
self.l1.grid(row=0, column=0)
self.l2.grid(row=0, column=1)
self.l3.grid(row=0, column=0)
self.l4.grid(row=0, column=1)
def configure_entries(self):
self.e1.grid(row=1, column=0)
self.e2.grid(row=1, column=1)
self.e3.grid(row=1, column=0)
self.e4.grid(row=1, column=1)
if __name__ == "__main__":
root = tk.Tk()
example = TopFrame(master=root)
example.mainloop()
Instead of having 3 widgets in the same location, it's better to have only the one you need.
First, get rid of this code:
for f in (self.f1, self.f2, self.f3):
f.grid(row=0, column=0, sticky="nsew")
Now the frame will start in a blank state.
Then, instead of calling .tkraise() on the frames, we will remove the current frame (if any) and add another one in its place. So
self.b1.configure(command=lambda: self.f1.tkraise())
self.b2.configure(command=lambda: self.f2.tkraise())
self.b3.configure(command=lambda: self.f3.tkraise())
becomes:
self.b1.configure(command=lambda: self._activate(self.f1))
self.b2.configure(command=lambda: self._activate(self.f2))
self.b3.configure(command=lambda: self._activate(self.f3))
with
def _activate(self, frame):
# remove the current frame
for child in self.BottomFrame.winfo_children():
child.grid_forget()
# add the new frame in its place
frame.grid(row=0, column=0, sticky='nsew')
In my Python GUI script, I have a pop up window, and there is text area widget on the pop-up window, users can input some content inside, and then click one button on the pop-up window to get the input text.
But it seems that in the defined function, the widget on the pop-up window can not be accessed. the code goes as following:
from Tkinter import *
def Add_Content():
content = ent_new.get("1.0","end")
print content
def Add_Task():
task_index = 1
new_window = Toplevel()
label1 = Label(new_window, text="New Goal:")
label1.grid(row = 0, column = 0)
ent_new = Text(new_window, bg= "white", height=5, width= 30)
ent_new.grid(row=0,column =1,padx=5, pady=5)
bu_new = Button( new_window,text="Add", command = Add_Content)
bu_new.grid(row=0, column =2)
new_window.focus_force()
master = Tk()
group = LabelFrame(master, text="Operation", padx=5, pady=5, relief = RAISED)
group.grid(row=0,column= 0, padx=10, pady=10, sticky=N)
bu_add = Button(group, text = "Add Task",width = 15, command = Add_Task)
bu_add.grid(row=0,column=0)
mainloop()
in the above script, the ent_new can not be found in function Add_Content
The problem is that ent_new is in another namespace. You can solve it by making Add_Content recieve ent_new in the arguments like that,
def Add_Content(my_ent):
content = my_ent.get("1.0","end")
print content
and then using a wrapper function (lambda) when passing it to Button
bu_new = Button( new_window,text="Add", command = lambda: Add_Content(ent_new))
Without adding a class and the concept of self and parent, you can use lambda given in the first answer or you can use a global variable.
Note: In python circles globals are rather frowned upon but they work and get the job done.
from Tkinter import *
global ent_new
def Add_Content():
content = ent_new.get("1.0","end")
print content
def Add_Task():
global ent_new
task_index = 1
new_window = Toplevel()
label1 = Label(new_window, text="New Goal:")
label1.grid(row = 0, column = 0)
ent_new = Text(new_window, bg= "white", height=5, width= 30)
ent_new.grid(row=0,column =1,padx=5, pady=5)
bu_new = Button( new_window,text="Add", command = Add_Content)
bu_new.grid(row=0, column =2)
new_window.focus_force()
master = Tk()
group = LabelFrame(master, text="Operation", padx=5, pady=5, relief = RAISED)
group.grid(row=0,column= 0, padx=10, pady=10, sticky=N)
bu_add = Button(group, text = "Add Task",width = 15, command = Add_Task)
bu_add.grid(row=0,column=0)
mainloop()
def create_layout(frame):
frame = Frame(frame, bg = 'red')
frame.pack(side = LEFT, fill=BOTH)
b = Button(frame, text='Button1', command=pressed, padx = 20)
b.pack(pady = 20, padx = 20)
c = Button(frame, text='Button2', command=pressed, padx=20)
c.pack(pady = 20, padx = 20)
I got this code so far, assume that from Tkinter import * has already been called and the frame has already had its size and colour set. It should look like the picture below. However i can't ever get button 3 and 4 to the frame on the right, whenever i add a button it goes in the red frame.
OK, the first set of buttons, button 1 & 2 are in the "frame", buttons 3 & 4 should be left out.
So with buttons 1 & 2, open the frame with the bg of red, pack it with side=tk.LEFT, fill with both & expand it.
With buttons 3 & 4, just side them LEFT and expand. That will work like a treat ;-)
You need to add another frame that sits to the right, and then pack button3 and button4 into that. Maybe change the previous frame you have there to frame1 and then have:
frame2 = Frame(frame, bg = "yellow")
frame2.pack(side = RIGHT, fill = BOTH)
Then, create the buttons and pack them in. Hope this helps!
You have 2 frames, and 4 buttons.
Let us create a function called create_widgets() which will only consist in calling 2 other functions create_frames() and create_buttons()
For the frames, we use the grid() layout manager:
def create_frames(self):
self.left_frame = tk.Frame(width=140, height=140, background='red')
self.left_frame.grid(row=0, column=0)
self.right_frame = tk.Frame(width=300, height=140, background='gold2')
self.right_frame.grid(row=0, column=1)
This will create this interface:
Let us design create_buttons() in a way it only consists in calling to 2 different functions, each having a specific task:
create_left_frame_buttons() to create buttons for the left frame
create_right_frame_buttons() to create buttons for the right frame
Here is their simple implementation:
def create_buttons(self):
self.create_left_frame_buttons()
self.create_right_frame_buttons()
def create_left_frame_buttons(self):
self.button1 = tk.Button(self.left_frame, text='Button1')
self.button1.grid(row=0, column=0, padx=30, pady=20)
self.button2 = tk.Button(self.left_frame, text='Button2')
self.button2.grid(row=1, column=0, padx=30, pady=20)
def create_right_frame_buttons(self):
self.button1 = tk.Button(self.right_frame, text='Button3')
self.button1.grid(row=0, column=0, padx=20, pady=50)
self.button2 = tk.Button(self.right_frame, text='Button4')
self.button2.grid(row=0, column=1, padx=70)
Note that I used the options padx and pady to create a suitable spacing between the buttons.
Up to this moment, this is the resulting interface:
You can see both the left and right frames are shrinking, and the result is ugly. To fix this issue, we can set rid_propagate(0) for each frame.
So based on these observations and following Tkinter best practices, here is the full code:
import tkinter as tk
class MainApplication(tk.Frame):
def __init__(self, master):
self.master = master
tk.Frame.__init__(self, self.master)
self.configure_gui()
self.create_widgets()
def configure_gui(self):
self.master.title('Simple layout')
self.master.geometry('440x140')
self.master.resizable(0, 0)
def create_widgets(self):
self.create_frames()
self.create_buttons()
def create_frames(self):
self.left_frame = tk.Frame(width=140, height=140, background='red')
self.left_frame.grid_propagate(0)
self.left_frame.grid(row=0, column=0)
self.right_frame = tk.Frame(width=300, height=140, background='gold2')
self.right_frame.grid_propagate(0)
self.right_frame.grid(row=0, column=1)
def create_buttons(self):
self.create_left_frame_buttons()
self.create_right_frame_buttons()
def create_left_frame_buttons(self):
self.button1 = tk.Button(self.left_frame, text='Button1')
self.button1.grid(row=0, column=0, padx=30, pady=20)
self.button2 = tk.Button(self.left_frame, text='Button2')
self.button2.grid(row=1, column=0, padx=30, pady=20)
def create_right_frame_buttons(self):
self.button1 = tk.Button(self.right_frame, text='Button3')
self.button1.grid(row=0, column=0, padx=20, pady=50)
self.button2 = tk.Button(self.right_frame, text='Button4')
self.button2.grid(row=0, column=1, padx=70)
if __name__ == '__main__':
root = tk.Tk()
main_app = MainApplication(root)
root.mainloop()
Demo: