Python Tkinter Scaling Issue

61 Views Asked by At

I'm new into programming and I am trying to do a little Python Tkinter GUI for a OpenCv application. My issue: I created a root window in Tkinter and added 2 frames into it. In the frames are 2 buttons and 2 combobox dropdown menus. When I'm viewing my GUI on my monitor evertything is perfectly centered etc.. Now when I'm viewing my GUI on my Laptop screen everything is scaled different (Monitor and Laptop runs on 1920x1080 pixels). Is there a way to fix the widgets in place in the frame so it doesnt matter on which screen I'm viewing my GUI?

Code:

# Hauptfenster erstellen
root = tk.Tk()
root.title("KI Blattanalyse")

#Blatt Icon als Software Symbol
icon = Image.open('Logo\\ICON.png')
photo = ImageTk.PhotoImage(icon)
root.iconphoto(True, photo)
root.photo = photo

# Menüleiste erstellen
menubar = tk.Menu(root)

#Datei Menü zum Beenden der Anwendung
file_menu = tk.Menu(menubar, tearoff=0)
file_menu.add_command(label="Beenden", command=on_exit)
menubar.add_cascade(label="Datei", menu=file_menu)

#Features Menü, um die Auswertungen der Software anzeigen zu lassen
feature_menu = tk.Menu(menubar, tearoff=0)
feature_menu.add_command(label="Durchschnittliche Blattfarbe", command = open_page_one)
feature_menu.add_command(label="Anzahl der Blätter", command = open_page_two)
feature_menu.add_command(label="Fläche der Blätter", command = open_page_three)
feature_menu.add_command(label="Substrate", command = open_page_four)
feature_menu.add_command(label="Pflanzen", command = open_page_five)
menubar.add_cascade(label="Features", menu=feature_menu)

#Definition der Frames auf der Startseite
#Linkes Frame
frame_left = LabelFrame(root, frame_styles, text="Aufnahme starten")
frame_left.pack(fill = "both", expand=True)
frame_left.place(rely=0.10, relx=0.05, relheight=0.80, relwidth=0.4)
#Rechtes Frame
frame_right = LabelFrame(root, frame_styles, text="Aufnahme")
frame_right.pack(fill = "both", expand=True)
frame_right.place(rely=0.10, relx=0.50, relheight=0.80, relwidth=0.45)

#Knopf zum Starten der Aufnahme
button_recordpic = tk.Button(frame_left, text_styles, text="RECORD PICTURE", command=lambda: record_picture(aruco_dict, mtx, dist, newcameramtx), height=5, width=20) 
button_recordpic.grid(row = 1, column = 1, pady = 30, sticky = "NSEW")
 
#Knopf zum Kameracheck
button_cameracheck = tk.Button(frame_left, text_styles, text="CAMERA CHECK", command=lambda: cam_check(aruco_dict, mtx, dist, newcameramtx), height=5, width=20)
button_cameracheck.grid(row = 2, column = 1, pady = 30, sticky = "NSEW")

#Dropdown Menü im linken Frame, um die Box auszuwählen
combo_box_setbox_label = tk.Label(frame_left, text="Choose a box")
combo_box_setbox_label.grid(row = 3)
combo_box_setbox = ttk.Combobox(frame_left, state ="readonly", values=["Box 1", "Box 2", "Box 3", "Box 4", "Box 5"])
combo_box_setbox.bind("<<ComboboxSelected>>", selection_box)
combo_box_setbox.grid(row = 4)

#Dropdown Menü im linken Frame, um die Aufnahme auszuwählen
combo_box_record_label = tk.Label(frame_left, text="Choose a record date")
combo_box_record_label.grid(row = 3, column = 2, sticky = "NSEW")
combo_box_record = ttk.Combobox(frame_left, state="readonly", values = check_record_folder())
combo_box_record.bind("<<ComboboxSelected>>", selection_record)
combo_box_record.grid(row = 4, column = 2, sticky = "NSEW")

#Label erstellen und Bild einfügen
label = Label(frame_right)
label.pack()


#Menüleiste dem Hauptfenster zuweisen
root.config(menu=menubar)

#Fenster maximieren
root.state('zoomed')

#Standardgröße im Fenstermodus
root.geometry("1920x1080")

#Hauptloop starten
root.mainloop()

I tried googeling for the error but didn't really find something that helped me.

1

There are 1 best solutions below

0
On

To make your GUI more responsive to different screen sizes, consider using a geometry manager like pack or grid that handles resizing and scaling more dynamically. With these managers, you can specify how your widgets should expand and fill available space.

Here's a modified version of your code using the grid geometry manager:

import tkinter as tk
from tkinter import ttk
from tkinter import Label, LabelFrame
from PIL import Image, ImageTk

def on_exit():
    root.destroy()

def open_page_one():
    # Add your logic for opening page one here
    pass

def open_page_two():
    # Add your logic for opening page two here
    pass

def open_page_three():
    # Add your logic for opening page three here
    pass

def open_page_four():
    # Add your logic for opening page four here
    pass

def open_page_five():
    # Add your logic for opening page five here
    pass

def record_picture(aruco_dict, mtx, dist, newcameramtx):
    # Add your logic for recording a picture here
    pass

def cam_check(aruco_dict, mtx, dist, newcameramtx):
    # Add your logic for camera check here
    pass

def selection_box(event):
    # Add your logic for handling box selection here
    pass

def selection_record(event):
    # Add your logic for handling record selection here
    pass

def check_record_folder():
    # Add your logic for checking record folder here
    return ["Record 1", "Record 2", "Record 3"]  # Dummy data, replace with your implementation

# Hauptfenster erstellen
root = tk.Tk()
root.title("KI Blattanalyse")

# Blatt Icon als Software Symbol
icon = Image.open('Logo\\ICON.png')
photo = ImageTk.PhotoImage(icon)
root.iconphoto(True, photo)
root.photo = photo

# Menüleiste erstellen
menubar = tk.Menu(root)

# Datei Menü zum Beenden der Anwendung
file_menu = tk.Menu(menubar, tearoff=0)
file_menu.add_command(label="Beenden", command=on_exit)
menubar.add_cascade(label="Datei", menu=file_menu)

# Features Menü, um die Auswertungen der Software anzeigen zu lassen
feature_menu = tk.Menu(menubar, tearoff=0)
feature_menu.add_command(label="Durchschnittliche Blattfarbe", command=open_page_one)
feature_menu.add_command(label="Anzahl der Blätter", command=open_page_two)
feature_menu.add_command(label="Fläche der Blätter", command=open_page_three)
feature_menu.add_command(label="Substrate", command=open_page_four)
feature_menu.add_command(label="Pflanzen", command=open_page_five)
menubar.add_cascade(label="Features", menu=feature_menu)

# Definition der Frames auf der Startseite
# Linkes Frame
frame_left = LabelFrame(root, text="Aufnahme starten")
frame_left.grid(row=0, column=0, sticky="nsew", padx=10, pady=10)
frame_left.grid_columnconfigure(1, weight=1)  # Make column 1 expandable

# Rechtes Frame
frame_right = LabelFrame(root, text="Aufnahme")
frame_right.grid(row=0, column=1, sticky="nsew", padx=10, pady=10)
frame_right.grid_columnconfigure(0, weight=1)  # Make column 0 expandable

# Knopf zum Starten der Aufnahme
button_recordpic = tk.Button(frame_left, text="RECORD PICTURE", command=lambda: record_picture(aruco_dict, mtx, dist, newcameramtx), height=5, width=20)
button_recordpic.grid(row=1, column=1, pady=30, sticky="nsew")

# Knopf zum Kameracheck
button_cameracheck = tk.Button(frame_left, text="CAMERA CHECK", command=lambda: cam_check(aruco_dict, mtx, dist, newcameramtx), height=5, width=20)
button_cameracheck.grid(row=2, column=1, pady=30, sticky="nsew")

# Dropdown Menü im linken Frame, um die Box auszuwählen
combo_box_setbox_label = tk.Label(frame_left, text="Choose a box")
combo_box_setbox_label.grid(row=3, column=0, columnspan=2, pady=5, sticky="nsew")
combo_box_setbox = ttk.Combobox(frame_left, state="readonly", values=["Box 1", "Box 2", "Box 3", "Box 4", "Box 5"])
combo_box_setbox.bind("<<ComboboxSelected>>", selection_box)
combo_box_setbox.grid(row=4, column=0, columnspan=2, pady=5, sticky="nsew")

# Dropdown Menü im linken Frame, um die Aufnahme auszuwählen
combo_box_record_label = tk.Label(frame_left, text="Choose a record date")
combo_box_record_label.grid(row=5, column=0, columnspan=2, pady=5, sticky="nsew")
combo_box_record = ttk.Combobox(frame_left, state="readonly", values=check_record_folder())
combo_box_record.bind("<<ComboboxSelected>>", selection_record)
combo_box_record.grid(row=6, column=0, columnspan=2, pady=5, sticky="nsew")

# Label erstellen und Bild einfügen
label = Label(frame_right)
label.pack(expand=True, fill="both")

# Menüleiste dem Hauptfenster zuweisen
root.config(menu=menubar)

# Fenster maximieren
root.state('zoomed')

# Hauptloop starten
root.mainloop()