0

How can you position the frames (and or elements inside the frames) such that the radio buttons at the bottom are shifted to the left outer edge of the GUI interface and the title is shifted to the center of the GUI interface?

GUI

enter image description here

import tkinter

root = tkinter.Tk()
root.title('Bookings')
root.geometry('700x500')

frame_title = tkinter.Frame(root)
frame_fields = tkinter.Frame(root)
frame_scan = tkinter.Frame(root)
frame_credentials = tkinter.Frame(root)
frame_site = tkinter.Frame(root)
frame_change = tkinter.Frame(root)


def passx():
    pass


frame_title.grid(row=0, column=0, padx=(50, 0))
title = tkinter.Label(frame_title, text="Bookings Scan", font=("Helvetica", 24))
title.grid(pady=(27, 10))
frame_fields.grid(row=1, column=0, padx=(30, 0), pady=(10, 0))
start_date_lbl = tkinter.Label(frame_fields, text="Enter the start date: ", font=("Helvetica", 16))
start_date_lbl.grid(column=0, row=0, pady=15)
start_date_unp = tkinter.Entry(frame_fields, width=11, font=("Helvetica", 16))
start_date_unp.grid(column=1, row=0)
start_date = start_date_unp.get()
end_date_lbl = tkinter.Label(frame_fields, text="Enter the end date: ", font=("Helvetica", 16))
end_date_lbl.grid(column=0, row=1)
end_date_unp = tkinter.Entry(frame_fields, width=11, font=("Helvetica", 16))
end_date_unp.grid(column=1, row=1)
end_date = end_date_unp.get()
frame_scan.grid(row=1, column=1, padx=(45, 0))
scan_btn = tkinter.Button(frame_scan, text="Scan", command=passx, height=2, width=8, font=("Helvetica", 16))
scan_btn.grid(row=0, column=0, pady=(10, 0))
frame_credentials.grid(row=2, column=0)
credential = tkinter.IntVar(value=0)
tkinter.Radiobutton(frame_credentials, text='Username', variable=credential, value=1, font=("Helvetica", 16)).grid(column=1, row=4, sticky='W', pady=(43, 50))
tkinter.Radiobutton(frame_credentials, text='Password', variable=credential, value=2, font=("Helvetica", 16)).grid(column=1, row=5, sticky='W')
frame_site.grid(row=2, column=1, pady=(40, 0))
site = tkinter.IntVar(value=0)
tkinter.Radiobutton(frame_site, text='PearsonVUE', variable=site, value=1, font=("Helvetica", 16)).grid(column=0, row=0, sticky='W', pady=8)
tkinter.Radiobutton(frame_site, text='Kryterion', variable=site, value=2, font=("Helvetica", 16)).grid(column=0, row=1, sticky='W')
tkinter.Radiobutton(frame_site, text='PSI PAN', variable=site, value=3, font=("Helvetica", 16)).grid(column=0, row=2, sticky='W', pady=8)
tkinter.Radiobutton(frame_site, text='Scantron', variable=site, value=4, font=("Helvetica", 16)).grid(column=0, row=3, sticky='W')
tkinter.Radiobutton(frame_site, text='PSI Atlas', variable=site, value=5, font=("Helvetica", 16)).grid(column=0, row=4, sticky='W', pady=8)
frame_change.grid(row=2, column=2, padx=25, pady=(20, 0))
change_btn = tkinter.Button(frame_change, text="Change", command=passx, height=2, width=8, font=("Helvetica", 16))
change_btn.grid(column=3, row=3)
root.mainloop()
Vy Do
  • 46,709
  • 59
  • 215
  • 313
Kevin
  • 71
  • 1
  • 9
  • You can use solution at https://stackoverflow.com/a/3353112/3728901, many solutions you can apply. – Vy Do Jul 08 '21 at 03:12

2 Answers2

0

Great and simple question. To move through x,y coordinates on your GUI you need to use the place() function. It lets you position a widget either with absolute x,y coordinates, or relative to another widget.

Example:

In this example, three labels are positioned diagonally using x,y coordinates.

from tkinter import *
root = Tk()

root.geometry('250x200+250+200')
Label(root, text="Position 1 : x=0, y=0", bg="#FFFF00", fg="white").place(x=5, y=0)
Label(root, text="Position 2 : x=50, y=40", bg="#3300CC", fg="white").place(x=50, y=40)
Label(root, text="Position 3 : x=75, y=80", bg="#FF0099", fg="white").place(x=75, y=80)

root.mainloop()

That’s it. This should now allow you to move and position widgets and other text around on the x,y axis. Hope this helped!

0

To achieve the goal:

  • set columnspan=3 in frame_title.grid(...)
  • set columnspan=2 in frame_fields.grid(...)
  • move frame_scan to column 2
...
frame_title.grid(row=0, column=0, columnspan=3) ### added columnspan=3
...
frame_fields.grid(row=1, column=0, padx=(30, 0), pady=(10, 0), columnspan=2) ### added columnspan=2
...
frame_scan.grid(row=1, column=2, padx=(45, 0)) ### moved to column 2
...

The output:

enter image description here

acw1668
  • 40,144
  • 5
  • 22
  • 34