I am trying to create Tabs in python tkinter. I would like the Tab's height to size dynamically based on its content. Below is a sample of my code
from tkinter import *
from tkinter import ttk
root = Tk()
root.title('Frames')
root.geometry('500x500')
frame1 = LabelFrame(root)
frame1.pack(padx=5, pady = 5)
notebook1 = ttk.Notebook(frame1)
notebook1.pack(pady= 5)
nbframe1 = Frame(notebook1, bg = 'white')
nbframe2 = Frame(notebook1, bg = 'grey')
nbframe1.pack(fill ='both', expand=1)
nbframe2.pack(fill ='both', expand=1)
notebook1.add(nbframe1, text= 'A Search')
notebook1.add(nbframe2, text= 'B Search')
a_label = Label(nbframe1, text= 'A_Tag', bg = 'white')
a_label.grid(row = 0, column = 0, sticky=W, padx=5)
b_label = Label(nbframe1, text= 'B_Tag', bg = 'white')
b_label.grid(row = 1, column = 0, sticky=W, padx=5)
a_text = StringVar()
a_entry = Entry(nbframe1, textvariable = a_text, width=50)
a_entry.grid(row = 0, column = 1, sticky=W, padx=5)
b_text = StringVar()
b_entry = Entry(nbframe1, textvariable = b_text, width=25)
b_entry.grid(row = 1, column = 1, sticky=W, padx=5)
root.mainloop()
From my code, the Tabs created have same height even though one is empty. This is based on the height of the Tab with content. How can i set it so that each Tab's height is based only on the contents.
You can bind a function to the virtual event <<NotebookTabChanged>> to adapt the height of the notebook to the currently selected tab using the height option of the notebook:
def on_change_tab(event):
tab = event.widget.nametowidget(event.widget.select()) # get selected tab
event.widget.configure(height=tab.winfo_reqheight()) # resize notebook
With your example:
from tkinter import *
from tkinter import ttk
root = Tk()
root.title('Frames')
root.geometry('500x500')
def on_change_tab(event):
tab = event.widget.nametowidget(event.widget.select())
event.widget.configure(height=tab.winfo_reqheight())
frame1 = LabelFrame(root)
frame1.pack(padx=5, pady=5)
notebook1 = ttk.Notebook(frame1)
notebook1.pack(pady=5)
nbframe1 = Frame(notebook1, bg='white')
nbframe2 = Frame(notebook1, bg='grey')
notebook1.add(nbframe1, text='A Search')
notebook1.add(nbframe2, text='B Search')
a_label = Label(nbframe1, text='A_Tag', bg='white')
a_label.grid(row=0, column=0, sticky=W, padx=5)
b_label = Label(nbframe1, text='B_Tag', bg='white')
b_label.grid(row=1, column=0, sticky=W, padx=5)
a_text = StringVar()
a_entry = Entry(nbframe1, textvariable=a_text, width=50)
a_entry.grid(row=0, column=1, sticky=W, padx=5)
b_text = StringVar()
b_entry = Entry(nbframe1, textvariable=b_text, width=25)
b_entry.grid(row=1, column=1, sticky=W, padx=5)
root.update_idletasks() # force display update so that the initial tab is displayed correctly
notebook1.bind('<<NotebookTabChanged>>', on_change_tab) # binding to update the height
root.mainloop()
Related
I am trying to build a pattern for question paper...
I created a canvas in a frame and added a scrollbar. I created another frame inside and set the scrollbar to it. THe pattern for a question is in a frames which is repeated on the inner frame as per choice of user.
But the scrollbar is not working here, so after the question pattern has crossed the page, I cannot view them.
Here is a shortened form of my code.....
from tkinter import *
from tkinter import ttk
home = Tk()
width = home.winfo_screenwidth() - 20
height = home.winfo_screenheight() - 100
home.wm_geometry(f"{width}x{height}")
home.state("zoomed")
frame1 = Frame(home, bg='RED')
frame2 = Frame(home, bg='yellow')
frame1.pack(fill=Y, side=LEFT)
frame2.pack(fill=BOTH, expand=YES, side=LEFT)
label1 = Label(frame1, text="Label for Frame1", bg='light blue')
label1.grid(row=0, column=0)
def handle_resize(event):
canvas = event.widget
canvas_frame = canvas.nametowidget(canvas.itemcget("canvas_frame", "window"))
min_width = canvas_frame.winfo_reqwidth()
min_height = canvas_frame.winfo_reqheight()
if min_width < event.width:
canvas.itemconfigure("canvas_frame", width=event.width)
if min_height < event.height:
canvas.itemconfigure("canvas_frame", height=event.height)
canvas.configure(scrollregion=canvas.bbox("all"))
question_type_canvas = Canvas(frame2, bg='light green')
question_type_canvas.pack(side=LEFT, expand=YES, fill=BOTH)
inner_question_type_frame = Frame(question_type_canvas)
question_type_canvas.create_window((0, 0), window=inner_question_type_frame, anchor='nw', tags=("canvas_frame",))
vbar = Scrollbar(frame2, orient=VERTICAL, command=question_type_canvas.yview())
vbar.pack(side=RIGHT, fill=Y)
question_type_canvas.configure(yscrollcommand=vbar.set)
question_type_canvas.bind('<Configure>', handle_resize)
def clone_question_types(ques_index, row_number):
question_type_frame = Frame(inner_question_type_frame, bg='light pink')
question_type_frame.grid(row=row_number, column=0)
question_types_dict = dict({'Multiple Choice Questions': 1,
'Fill in the Blanks': 2})
question_types_combo_values = list(question_types_dict.keys())
question_no_label = Label(question_type_frame, text=f'Q {ques_index + 1}', bg='light pink', width=5)
type_label = Label(question_type_frame, text='Type: ', width=20, padx=5, bg='light pink')
type_selected = StringVar(question_type_frame)
type_menu = ttk.Combobox(question_type_frame, textvariable=type_selected,
values=list(question_types_combo_values), width=20, state="readonly")
next_question_button = Button(question_type_frame, text='Next Question',
command=lambda: [next_question_button.configure(state=DISABLED),
clone_question_types(ques_index + 1, row_number + 1)])
question_no_label.grid(row=0, column=0, sticky='w')
type_label.grid(row=0, column=1, sticky='w')
type_menu.grid(row=0, column=2, sticky='w')
next_question_button.grid(row=3, column=1)
clone_question_types(0, 0)
home.mainloop()
I have tried adding a scrollbar to my GUI but it keeps returning a small canvas which my labels don't fit.
Below is my code using Python.
import tkinter as tk
from tkinter import Canvas, Frame, ttk
from tkinter.constants import ANCHOR, BOTH, LEFT, RIGHT, VERTICAL, Y
root = tk.Tk()
#create a Main Frame
main_frame = tk.Frame(root)
main_frame.grid(row=2, column=0, pady=(5,0), sticky="nw")
main_frame.grid_rowconfigure(0, weight=1)
main_frame.grid_columnconfigure(0, weight=1)
#create a canvas
my_canvas = Canvas(main_frame, bg="yellow")
my_canvas.grid(row=0, column=0, sticky="news")
#Scrollbar
my_scrollbar = ttk.Scrollbar(main_frame, orient=VERTICAL, command=my_canvas.yview)
my_scrollbar.grid(row=0, column=0, sticky="ns")
#configure the canvas
my_canvas.configure(yscrollcommand=my_scrollbar.set)
my_canvas.bind('<Configure>', lambda e: my_canvas.configure(scrollregion = my_canvas.bbox("all")))
#create another frame inside canvas
second_frame = Frame(my_canvas)
#add that new frame to a window in the canvas
my_canvas.create_window((0,0), window=second_frame, anchor="nw")
# Labels
tk.Label(root, text="Decision Support System").grid(
column=0, row=0, sticky="", padx=50)
tk.Label(root, text="""This is a simple application that will help in decision making on whether to adopt a technology based on criteria listed below, you are rate each criteria 1-5
1- not important, 2- slightly important, 3- moderately important, 4-important, 5- very important""").grid(column=0, row=1)
tk.Label(root, text="What type of technology are you trying to invest in?").grid(
column=0, row=2, sticky="w", pady=20, padx=10)
tk.Label(root, text="CA1- Technology Predictors, Group score[35], Coefficient = 0.200").grid(
column=0, row=3, sticky="", pady=10, padx=10)
tk.Label(root, text="Ca1.1-Level of training required : is training of staff going to be thorough?").grid(
column=0, row=4, sticky="w", pady=10, padx=10)
#GUI window
root.mainloop()
And this is what it looks like:
It has a total of 27 rows.
Does this work for you?
I've added a horizontal scrollbar and placed all labels into canvas.
import tkinter as tk
from tkinter import Canvas, Frame, ttk
from tkinter.constants import ANCHOR, BOTH, LEFT, RIGHT, VERTICAL, HORIZONTAL, X, Y
root = tk.Tk()
root.grid_rowconfigure(0, weight = 1)
root.grid_columnconfigure(0, weight = 1)
my_canvas = Canvas(root, bg = "yellow")
my_canvas.grid(row = 0, column = 0, sticky = "news")
#Scrollbar
v_scrollbar = ttk.Scrollbar(root, orient = VERTICAL, command = my_canvas.yview)
v_scrollbar.grid(row = 0, column = 1, sticky="ns")
my_canvas.configure(yscrollcommand = v_scrollbar.set)
my_canvas.bind("<Configure>", lambda e: my_canvas.configure(scrollregion = my_canvas.bbox("all")))
#Scrollbar
h_scrollbar = ttk.Scrollbar(root, orient = HORIZONTAL, command = my_canvas.xview)
h_scrollbar.grid(row = 1, column = 0, sticky="ew")
my_canvas.configure(xscrollcommand = h_scrollbar.set)
my_canvas.bind("<Configure>", lambda e: my_canvas.configure(scrollregion = my_canvas.bbox("all")))
#create a Main Frame
main_frame = tk.Frame(my_canvas)
main_frame.grid(row = 0, column = 0, sticky = "nsew")
# Labels
tk.Label(main_frame, text = "Decision Support System").grid(
column = 0, row = 0, sticky = "", padx = 50)
tk.Label(main_frame, text="""This is a simple application that will help in decision making on whether to adopt a technology based on criteria listed below, you are rate each criteria 1-5
1- not important, 2- slightly important, 3- moderately important, 4-important, 5- very important""").grid(
column = 0, row = 1)
tk.Label(main_frame, text="What type of technology are you trying to invest in?").grid(
column = 0, row = 2, sticky="w", pady = 20, padx = 10)
tk.Label(main_frame, text="CA1- Technology Predictors, Group score[35], Coefficient = 0.200").grid(
column = 0, row = 3, sticky="", pady = 10, padx = 10)
tk.Label(main_frame, text="Ca1.1-Level of training required : is training of staff going to be thorough?").grid(
column = 0, row = 4, sticky = "w", pady = 10, padx = 10)
my_canvas.create_window((0,0), window = main_frame, anchor = "nw")
root.geometry("836x221")
root.mainloop()
I just put together this basic retirement savings calculator using python. While this works, I had a couple of questions:
Is there a way to embed the plot directly, i.e. without saving it as a PNG and then loading it again?
Line 30 reads img.image = render. While I understand that this updates the image attribute for the label defined on line 29, I am confused why this line is required, since we already call out image = render on line 29 itself. Why twice?
from tkinter import *
import pandas as pd
import matplotlib.pyplot as plt
from PIL import ImageTk, Image
def generate_plot():
rate = float(entry_1.get())
years_saving = int(entry_2.get())
initial_savings = float(entry_3.get())
yearly_contribution = float(entry_4.get())
model = pd.DataFrame({'time': range(years_saving)})
model['simple_exp'] = [initial_savings*rate**year for year in model['time']]
model['yearly_invest'] = model['simple_exp'] + [yearly_contribution*(rate**year - 1)/(rate-1) for year in model['time']]
final = model['yearly_invest'].sort_values(ascending= False).iloc[0]
label_5 = Label(frame, text=f"You would have saved INR {final} by retirement")
label_5.grid(row=0, column=0)
plt.plot(model['time'], model['yearly_invest'])
plt.title('Retirement Savings')
plt.xlabel('Time in Years)')
plt.ylabel('INR (Lacs)')
plt.savefig('plot.png')
load = Image.open('plot.png')
render = ImageTk.PhotoImage(load)
img = Label(frame, image = render)
img.image = render
img.grid(row=1, column=0)
# my_label = Label(frame, image = my_img)
# my_label.grid(row=1, column=0)
# img = ImageTk.PhotoImage(Image.open('plot.png'))
# img_label = Label(frame, image = img)
# img_label.grid(row=1, column=0)
root = Tk()
label_1 = Label(root, text = 'INTEREST RATE(%)')
label_2 = Label(root, text = 'NUMBER OF YEARS IN SAVINGS')
label_3 = Label(root, text = 'INITIAL CORPUS (INR LACS)')
label_4 = Label(root, text = 'YEARLY CONTRIBUTION (INR LACS')
frame = Frame(root, width=300, height=300)
button = Button(root, text="GENERATE PLOT", command = generate_plot, padx = 5, pady=5)
entry_1 = Entry(root)
entry_2 = Entry(root)
entry_3 = Entry(root)
entry_4 = Entry(root)
label_1.grid(row=0, column=0, pady=5, padx=5)
entry_1.grid(row=0, column=1, pady=5, padx=5)
label_2.grid(row=1, column=0, pady=5, padx=5)
entry_2.grid(row=1, column=1, pady=5, padx=5)
label_3.grid(row=2, column=0, pady=5, padx=5)
entry_3.grid(row=2, column=1, pady=5, padx=5)
label_4.grid(row=3, column=0, pady=5, padx=5)
entry_4.grid(row=3, column=1, pady=5, padx=5)
button.grid(row=4,column=0, columnspan=2, pady=20, padx=5)
frame.grid(row=5, column=0, columnspan = 2, padx = 5, pady = 5)
root.mainloop()
You can try saving to a stream using BytesIO:
from tkinter import *
from io import BytesIO
import pandas as pd
import matplotlib.pyplot as plt
from PIL import ImageTk, Image
def generate_plot():
rate = float(entry_1.get())
years_saving = int(entry_2.get())
initial_savings = float(entry_3.get())
yearly_contribution = float(entry_4.get())
model = pd.DataFrame({'time': range(years_saving)})
model['simple_exp'] = [initial_savings*rate**year for year in model['time']]
model['yearly_invest'] = model['simple_exp'] + [yearly_contribution*(rate**year - 1)/(rate-1) for year in model['time']]
final = model['yearly_invest'].sort_values(ascending= False).iloc[0]
label_5 = Label(frame, text=f"You would have saved INR {final} by retirement")
label_5.grid(row=0, column=0)
plt.plot(model['time'], model['yearly_invest'])
plt.title('Retirement Savings')
plt.xlabel('Time in Years)')
plt.ylabel('INR (Lacs)')
img_data = BytesIO()
plt.savefig(img_data)
load = Image.open(img_data)
render = ImageTk.PhotoImage(load)
img = Label(frame, image = render)
img.image = render # This is needed to keep a reference to the image, see the link below
img.grid(row=1, column=0)
# my_label = Label(frame, image = my_img)
# my_label.grid(row=1, column=0)
# img = ImageTk.PhotoImage(Image.open('plot.png'))
# img_label = Label(frame, image = img)
# img_label.grid(row=1, column=0)
root = Tk()
label_1 = Label(root, text = 'INTEREST RATE(%)')
label_2 = Label(root, text = 'NUMBER OF YEARS IN SAVINGS')
label_3 = Label(root, text = 'INITIAL CORPUS (INR LACS)')
label_4 = Label(root, text = 'YEARLY CONTRIBUTION (INR LACS')
frame = Frame(root, width=300, height=300)
button = Button(root, text="GENERATE PLOT", command = generate_plot, padx = 5, pady=5)
entry_1 = Entry(root)
entry_2 = Entry(root)
entry_3 = Entry(root)
entry_4 = Entry(root)
label_1.grid(row=0, column=0, pady=5, padx=5)
entry_1.grid(row=0, column=1, pady=5, padx=5)
label_2.grid(row=1, column=0, pady=5, padx=5)
entry_2.grid(row=1, column=1, pady=5, padx=5)
label_3.grid(row=2, column=0, pady=5, padx=5)
entry_3.grid(row=2, column=1, pady=5, padx=5)
label_4.grid(row=3, column=0, pady=5, padx=5)
entry_4.grid(row=3, column=1, pady=5, padx=5)
button.grid(row=4,column=0, columnspan=2, pady=20, padx=5)
frame.grid(row=5, column=0, columnspan = 2, padx = 5, pady = 5)
root.mainloop()
Reference: Why do my Tkinter images not appear?
I'm trying to make this really simple GUI using tkinter and I'm using grid as a layout manager.
But when I place a certain button in column 2, it appears to the extreme left side of the window.
I just want to place the buttons exactly where I want in the window but that doesn't seem to work.
I don't know what I'm doing wrong exactly but here's the code and a screenshot.
from tkinter import *
class GUI:
#Initialize the application window
def __init__(self):
w = 520
h = 350
self.window = Tk()
ws = self.window.winfo_screenwidth()
hs = self.window.winfo_screenheight()
x = (ws/2) -(w/2)
y = (hs/2) -(h/2)
self.window.title("Excel file import")
self.window.geometry('%dx%d+%d+%d' % (w, h, x, y))
self.window.configure(bg='#004A99')
self.window.resizable(False,False)
# self.logo = Image.open(LOGO)
# self.log = self.logo.resize((150,105),Image.ANTIALIAS)
# self.logo2 = ImageTk.PhotoImage(self.log)
# self.lbl1 = Label(self.window, image=self.logo2)
# self.lbl1.image = self.logo2
# self.lbl1.grid(row=4, column=0, ipadx=0, ipady=0, pady=0, padx=0)
self.homeDirectory = r'C:/Users/Shtlrs/Desktop/Clients folder/'
self.cfgFile = self.homeDirectory + r'cfg.ini'
#Add client button
self.addClientBtn = Button(self.window, text="Add new client", bg='#1b98e0', fg="white",
width=20, height=1)
self.addClientBtn.grid(row=2, column=2, ipadx=5, ipady=5, pady=5, padx=5)
self.addClientBtn.bind("<ButtonRelease-1>",self.addNewClient)
#Select client button
self.selectClientBtn = Button(self.window, text="Select existing client", bg='#1b98e0', fg="white",
width=20, height=1)
self.selectClientBtn.grid(row=3, column=2, ipadx=5, ipady=5, pady=5, padx=5)
self.selectClientBtn.bind("<ButtonRelease-1>",self.selectClient)
# Delete client button
self.deleteClientBtn = Button(self.window, text="Delete existing client", bg='red', fg="white",
width=20, height=1)
self.deleteClientBtn.grid(row=4, column=2, ipadx=5, ipady=5, pady=5, padx=5)
self.deleteClientBtn.bind("<ButtonRelease-1>",self.deleteClient)
#Cients dropdown ( appears next to "select existing clients")
# clients = ["Medtronic","Ancora","Momo"]
# self.clientsDropDown = ttk.Combobox(self.window,values=clients)
# self.clientsDropDown.grid(row=3,column=1, ipadx=5,ipady=5,pady=5,padx=5)
# self.clientsDropDown.current(0)
self.restart = Button(self.window, text="Restart", bg='#1b98e0', fg="white",
width=20, height=1)
self.restart.grid(row=5, column=2, ipadx=5, ipady=5, pady=5, padx=5)
self.restart.bind("<ButtonRelease-1>", self.restartAPP)
self.window.mainloop()
The code lacks a lot of other functions of course (For the bindings)
But when I run this I get:
Buttons appear in the wrong column using tkinter's grid layout manager
Actually,it is the right position.Due to the first column has no widget,so it seems it is in the "wrong" column.
You can create a frame,and put all of your buttons in it.And use .pack(anchor=Center) or .pack(anchor="center") to make the frame in the center.Also,you need to set the bg attribute of Frame to make sure they have the same color.
Followed by your code,a minimal example code is here:
from tkinter import *
class GUI:
#Initialize the application window
def __init__(self):
w = 520
h = 350
self.window = Tk()
ws = self.window.winfo_screenwidth()
hs = self.window.winfo_screenheight()
x = (ws/2) -(w/2)
y = (hs/2) -(h/2)
self.window.title("Excel file import")
self.window.geometry('%dx%d+%d+%d' % (w, h, x, y))
self.window.configure(bg='#004A99')
self.window.resizable(False,False)
self.buttonFrame = Frame(self.window,bg="#004A99") # create a new frame
self.buttonFrame.pack(anchor=CENTER) # make it center
# self.logo = Image.open(LOGO)
# self.log = self.logo.resize((150,105),Image.ANTIALIAS)
# self.logo2 = ImageTk.PhotoImage(self.log)
# self.lbl1 = Label(self.window, image=self.logo2)
# self.lbl1.image = self.logo2
# self.lbl1.grid(row=4, column=0, ipadx=0, ipady=0, pady=0, padx=0)
self.homeDirectory = r'C:/Users/Shtlrs/Desktop/Clients folder/'
self.cfgFile = self.homeDirectory + r'cfg.ini'
#Add client button
self.addClientBtn = Button(self.buttonFrame, text="Add new client", bg='#1b98e0', fg="white",width=20, height=1) # put your button in the frame.
self.addClientBtn.grid(row=2, column=2, ipadx=5, ipady=5, pady=5, padx=5)
self.addClientBtn.bind("<ButtonRelease-1>",self.addNewClient)
#Select client button
self.selectClientBtn = Button(self.buttonFrame, text="Select existing client", bg='#1b98e0', fg="white",width=20, height=1) # put your button in the frame.
self.selectClientBtn.grid(row=3, column=2, ipadx=5, ipady=5, pady=5, padx=5)
self.selectClientBtn.bind("<ButtonRelease-1>",self.selectClient)
# Delete client button
self.deleteClientBtn = Button(self.buttonFrame, text="Delete existing client", bg='red', fg="white",width=20, height=1) # put your button in the frame.
self.deleteClientBtn.grid(row=4, column=2, ipadx=5, ipady=5, pady=5, padx=5)
self.deleteClientBtn.bind("<ButtonRelease-1>",self.deleteClient)
#Cients dropdown ( appears next to "select existing clients")
# clients = ["Medtronic","Ancora","Momo"]
# self.clientsDropDown = ttk.Combobox(self.buttonFrame,values=clients) # put it in the frame.
# self.clientsDropDown.grid(row=3,column=1, ipadx=5,ipady=5,pady=5,padx=5)
# self.clientsDropDown.current(0)
self.restart = Button(self.buttonFrame, text="Restart", bg='#1b98e0', fg="white",
width=20, height=1)
self.restart.grid(row=5, column=2, ipadx=5, ipady=5, pady=5, padx=5)
self.restart.bind("<ButtonRelease-1>", self.restartAPP)
self.window.mainloop()
#You need to revise all the functions below.
def addNewClient(self):
pass
def selectClient(self):
pass
def deleteClient(self):
pass
def restartAPP(self):
pass
start = GUI()
Now it is:
I'm using rows to layout my Tkinter program.
I usually use pack so my buttons would automatically place itself and not over lap, using rows, my buttons are overlapping, and I have to align them by changing their padx value. I was wondering if there was an easier way to do this.
from sys import argv
from Tkinter import *
from PIL import Image, ImageTk, ImageFilter
import random
script, infile = argv
class MyApp(object):
def __init__(self):
self.root = Tk()
self.root.wm_title("ImagePro")
# Original
original = Image.open(infile)
(w, h) = (original.size[0], original.size[1])
tkpi = ImageTk.PhotoImage(original)
label = Label(self.root, image=tkpi)
label.grid(row =0, column=0, padx=5,pady=5)
img = original.copy().convert("L")
tkpi2 = ImageTk.PhotoImage(img)
label = Label(self.root, image=tkpi2)
label.grid(row =0, column=1, padx=5,pady=5)
Label(self.root, text = "Original").grid(row=1, column=0)
Label(self.root, text = "Modified").grid(row=1, column=1)
Button(self.root, text = "Brighten").grid(row=2, column=0, sticky=W)
Button(self.root, text = "Darken").grid(row=2, column=0, sticky=W, padx=60)
Button(self.root, text = "Warm").grid(row=2, column=0, sticky=W, padx=112)
Button(self.root, text = "Cool").grid(row=2, column=0, sticky=W, padx=158)
self.root.mainloop()
MyApp()
To do this you need to start using frames. A frame acts as a container for widgets. Add all the buttons to a frame, then add that frame to the root container.
class MyApp(object):
def __init__(self):
self.root = Tk()
self.root.wm_title("ImagePro")
#Original
original = Image.open(infile)
(w, h) = (original.size[0], original.size[1])
tkpi = ImageTk.PhotoImage(original)
label = Label(self.root, image=tkpi)
label.grid(row =0, column=0, padx=5,pady=5)
img = original.copy().convert("L")
tkpi2 = ImageTk.PhotoImage(img)
label = Label(self.root, image=tkpi2)
label.grid(row =0, column=1, padx=5,pady=5)
Label(self.root, text = "Original").grid(row=1, column=0)
Label(self.root, text = "Modified").grid(row=1, column=1)
self.buttonframe = Frame(self.root)
self.buttonframe.grid(row=2, column=0, columnspan=2)
Button(self.buttonframe, text = "Brighten").grid(row=0, column=0)
Button(self.buttonframe, text = "Darken").grid(row=0, column=1)
Button(self.buttonframe, text = "Warm").grid(row=0, column=2)
Button(self.buttonframe, text = "Cool").grid(row=0, column=3)
self.root.mainloop()
Each button goes in its own column within the frame, and the frame goes at the bottom of the main container.
If you use the same row,column couple for several widgets, they will appear in the same cell of the grid. Thus something like this should do the trick.
Button(self.root, text = "Brighten").grid(row=2, column=0)
Button(self.root, text = "Darken").grid(row=2, column=1)
Button(self.root, text = "Warm").grid(row=2, column=2)
Button(self.root, text = "Cool").grid(row=2, column=3)
You will find detailed information on this documentation of grid geometry manager http://effbot.org/tkinterbook/grid.htm