Tkinter - 如何動態調整漸變框的大小？

Question

我想知道如何根據 window 大小自動調整以下漸變幀的大小。

from tkinter import *

class InventorySystem:
    def __init__(self, root):
        self.root = root
        self.root.title("Inventory System")
        self.root.geometry("1366x768")

        j = 0
        colors = ["#007F5F", "#2B9348", "#55A630", "#80B918", "#AACC00", "#BFD200",
                  "#D4D700", "#DDDF00", "#EEEF20", "#FFFF3F"]
        for color in colors:
            Frame(self.root, width = 1366 / len(colors), height = 768,
                  bg = color).place(x = j, y = 0)
            j = j + 1366 / len(colors)

if __name__ == "__main__":
    root = Tk()
    application = InventorySystem(root)
    root.mainloop()

Answer 1

你想做的事情有點復雜，所以即使你不只是學習如何使用tkinter也可能具有挑戰性（只會因為它的文檔記錄太少而加劇）。 因此，我創建了一個示例，說明如何根據您問題中的代碼執行此操作。

一件不直觀的事情（對我來說）是，針對 window 本身及其內部的所有小部件調用 window 的<'Configure>'事件的Event處理“回調” function - 如果您沒有意識到會發生這種情況。

我還更改並重新格式化了您的代碼，以更嚴格地遵循PEP 8 - Python 代碼建議的樣式指南，我強烈建議您閱讀並開始關注。 請特別注意，我將您的通配符from tkinter import *更改為更可取的import tkinter as tk — 請參閱Should wildcard import be avoided?

import tkinter as tk

WIDTH, HEIGHT = 1366, 768  # Initial size of root window.

class InventorySystem:
    # Gradient frame colors.
    COLORS = ["#007F5F", "#2B9348", "#55A630", "#80B918", "#AACC00",
              "#BFD200", "#D4D700", "#DDDF00", "#EEEF20", "#FFFF3F"]

    def __init__(self, root):
        self.root = root
        self.root.title("Inventory System")
        self.root.geometry(f'{WIDTH}x{HEIGHT}')
        self.width, self.height = WIDTH, HEIGHT  # Size of root window.
        self.create_gradient_frames()

    def create_gradient_frames(self):
        """Create a gradient frame for each color."""
        self.gradient_frames = []
        colors = self.COLORS  # Alias for local access.
        gradient_frame_width = round(self.width / len(colors))
        gradient_frame_height = self.height

        for i, color in enumerate(colors):
            frame = tk.Frame(self.root, width=gradient_frame_width,
                             height=gradient_frame_height, bg=color)
            frame.place(x=i * gradient_frame_width,
                        y=self.height - gradient_frame_height)
            self.gradient_frames.append(frame)

    def update_gradient_frames(self):
        """Update size and position of all gradient frames."""
        gradient_frame_width = round(self.width / len(self.COLORS))
        gradient_frame_height = self.height

        for i, frame in enumerate(self.gradient_frames):
            frame.config(width=gradient_frame_width, height=gradient_frame_height)
            frame.place(x=i * gradient_frame_width,
                        y=self.height - gradient_frame_height)

    def on_resize(self, event):
        """Root window size change event handler."""
        # Needed following because event handler is called for the container win
        # and all its child widgets but we only need to handle container itself.
        if event.widget.master is not None:  # Not the root window?
            return  # Ignore.

        width, height = root.winfo_width(), root.winfo_height()  # Current size.
        if width != self.width or height != self.height:  # Updated?
            self.width, self.height = width, height  # Track change.
            self.update_gradient_frames()


if __name__ == "__main__":
    root = tk.Tk()
    application = InventorySystem(root)
    root.bind('<Configure>', application.on_resize)  # Bind callback function to event.
    root.mainloop()

這是正在調整大小的 window 的屏幕截圖：

Answer 2

您可以使用.place()的相關選項：

# relative width of each frame
# 1.0 means same width of parent
relw = 1 / len(colors) 
for j, color in enumerate(colors):
    Frame(self.root, bg=color).place(relx=j*relw, y=0, relwidth=relw, relheight=1)

有關詳細信息，請參閱有關place()的官方文檔。