Home > Software engineering >  How do I left-align buttons in tkinter?
How do I left-align buttons in tkinter?

Time:11-28

The following code

root = tk.Tk()
frame = ttk.Frame(root, padding=10)
frame.grid()

# Browse
tk.Text(frame, state="disabled", height=1).grid(column=0, row=0, columnspan=3, sticky="W", pady=5, ipadx=2, ipady=2)
ttk.Button(frame, text="Browse", command=None).grid(column=3, row=0, sticky="E")

# Selected files
tk.Text(frame, state="disabled").grid(column=0, row=1, columnspan=4, sticky="EW", pady=10)

# Options
ttk.Button(frame, text="SELECT", command=None).grid(column=0, row=2, sticky="W")
ttk.Button(frame, text="DELETE", command=None).grid(column=1, row=2, sticky="W")
ttk.Button(frame, text="Merge", command=None).grid(column=2, row=2, sticky="W")

ttk.Button(frame, text="Close", command=root.destroy).grid(column=3, row=2, sticky="E")

root.mainloop()

produces this,

gui

but I want the DELETE and MERGE buttons to be left-aligned so they are together with the SELECT button. How can I achieve this?

CodePudding user response:

Put buttons in new Frame and this frame put in original Frame

buttons_frame = ttk.Frame(frame)
buttons_frame.grid(column=0, row=2, sticky="W")

ttk.Button(buttons_frame, text="SELECT", command=None).grid(column=0, row=2, sticky="W")
ttk.Button(buttons_frame, text="DELETE", command=None).grid(column=1, row=2, sticky="W")
ttk.Button(buttons_frame, text="Merge", command=None).grid(column=2, row=2, sticky="W")

enter image description here

BTW:

In buttons_frame you may even use .pack(side='left') instead of grid()


Full code:

import tkinter as tk
import tkinter.ttk as ttk

root = tk.Tk()
frame = ttk.Frame(root, padding=10)
frame.grid()

# Browse
tk.Text(frame, state="disabled", height=1).grid(column=0, row=0, columnspan=3, sticky="W", pady=5, ipadx=2, ipady=2)
ttk.Button(frame, text="Browse", command=None).grid(column=3, row=0, sticky="E")

# Selected files
tk.Text(frame, state="disabled").grid(column=0, row=1, columnspan=4, sticky="EW", pady=10)

# Options
buttons_frame = ttk.Frame(frame)
buttons_frame.grid(column=0, row=2, sticky="W")
ttk.Button(buttons_frame, text="SELECT", command=None).grid(column=0, row=2, sticky="W")
ttk.Button(buttons_frame, text="DELETE", command=None).grid(column=1, row=2, sticky="W")
ttk.Button(buttons_frame, text="Merge", command=None).grid(column=2, row=2, sticky="W")

ttk.Button(frame, text="Close", command=root.destroy).grid(column=3, row=2, sticky="E")

root.mainloop()

EDIT:

You may also add empy column between Merge and Close and assign weight=1 to this column so it will get all empty space.

It needs to move Browse and Close to next column, and increase columnspan in both Text

import tkinter as tk
import tkinter.ttk as ttk

root = tk.Tk()
frame = ttk.Frame(root, padding=10)
frame.grid()

frame.columnconfigure(3, weight=1)  # column 3 will use all free space

# Browse
tk.Text(frame, state="disabled", height=1).grid(column=0, row=0, columnspan=4, sticky="W", pady=5, ipadx=2, ipady=2)
ttk.Button(frame, text="Browse", command=None).grid(column=4, row=0, sticky="E")

# Selected files
tk.Text(frame, state="disabled").grid(column=0, row=1, columnspan=5, sticky="EW", pady=10)

# Options
ttk.Button(frame, text="SELECT", command=None).grid(column=0, row=2, sticky="W")
ttk.Button(frame, text="DELETE", command=None).grid(column=1, row=2, sticky="W")
ttk.Button(frame, text="Merge", command=None).grid(column=2, row=2, sticky="W")

ttk.Button(frame, text="Close", command=root.destroy).grid(column=4, row=2, sticky="E")

root.mainloop()
  • Related