Tkinter GUI不在适当的位置

Question

我正在尝试创建一个Tkinter -一个顶部有标签的灰色盒子，然后在那个下拉框下面，左边有一个标签描述它，另一个下拉框的左边有一个标签。相反，我得到的标签在适当的地方，但然后两个下拉框和标签是在彼此之上，即使他们是在不同的框架。

from Tkinter import *
import ttk


class review_gui():


    def __init__(self):
        self.root = Tk()

        self.EDM_GUI(1)

        self.root.mainloop()


    def EDM_GUI(self, column):
        self.EDM_frm = Frame(self.root, background = "grey")
        self.EDM_frm.pack(side = "top")

        EDM_Label_frm = Frame(self.EDM_frm).pack(side = "top")
        EDM_DD_frm = Frame(self.EDM_frm).pack(side = "bottom")

        EDM_DB_frm = Frame(EDM_DD_frm).pack(side = "top")
        EDM_Port_frm = Frame(EDM_DD_frm).pack(side = "bottom")



        EDM_lbl = Label(EDM_Label_frm, text="EDM", fg="black").pack()

        EDM_DD_label = Label(EDM_DB_frm, text="Select EDM:", fg="black")
        EDM_DD_label.pack(side="left")
        EDM_Drop_Down = ttk.Combobox(EDM_DB_frm, state="readonly")
        EDM_Drop_Down["values"] = ("One", "Two", "Three")
        EDM_Drop_Down.pack(side="right")



        EDM_P_label = Label(EDM_Port_frm, text="Select Portfolio:", fg="black")
        EDM_P_label.pack(side="left")
        Port_Drop_Down = ttk.Combobox(EDM_Port_frm, state="readonly")
        Port_Drop_Down["values"] = ("One", "Two", "Three")
        Port_Drop_Down.pack(side="right")

rg = review_gui()

Answer 1

Standart pack几何管理器可能看起来古怪和任性，但这不是真的。你必须明白的一件事是你行动的顺序！

所以主要的算法是：

1. 创建一个实例(小部件或容器的实例)，并与其父实例关联。
2. 实例被打包了。

换句话说:想象一下你在建造一座房子！在你的例子中，你开始在五金店或其他地方建房子，所以你的房子不是按照你的计划建造的。

试着想象每一个框架都是房子的地板。里面的小部件是家具！所以，首先你用家具规划地板，然后按你的意愿打包。

我修改了你的EDM_GUI函数，它看起来像你想要的那样工作！只需记住避免在一行中声明和打包，因为pack返回None。

示例

def EDM_GUI(self, column):
    self.EDM_frm = Frame(self.root, background="grey")
    self.EDM_frm.pack()

    EDM_Label_frm = Frame(self.EDM_frm).pack()
    EDM_DD_frm = Frame(self.EDM_frm).pack()

    EDM_DB_frm = Frame(EDM_DD_frm)
    EDM_Port_frm = Frame(EDM_DD_frm)



    EDM_lbl = Label(EDM_Label_frm, text="EDM", fg="black").pack()

    EDM_DD_label = Label(EDM_DB_frm, text="Select EDM:", fg="black")
    EDM_DD_label.pack(side="left")
    EDM_Drop_Down = ttk.Combobox(EDM_DB_frm, state="readonly")
    EDM_Drop_Down["values"] = ("One", "Two", "Three")
    EDM_Drop_Down.pack(side="right")
    EDM_DB_frm.pack(side="top")



    EDM_P_label = Label(EDM_Port_frm, text="Select Portfolio:", fg="black")
    EDM_P_label.pack(side="left")
    Port_Drop_Down = ttk.Combobox(EDM_Port_frm, state="readonly")
    Port_Drop_Down["values"] = ("One", "Two", "Three")
    Port_Drop_Down.pack(side="right")
    EDM_Port_frm.pack(side="bottom")

结果

​

​

：关于pack管理器的维护和逻辑的问题:我不知道pack管理器是如何在引擎盖下工作的，但是您可以通过在框架中添加边框来测试是否出了问题！只需像这样声明您的帧：FrameVar = Frame(parent, relief='raised', borderwidth=10)。正如您所看到的，外框小部件直接放置到您的root窗口！

所以我测试了3种变体(从你的问题，从我的答案和正确的一个)：

1. 完全超过一个(从你的问题)

​

​

1. (从我的回答中)

​

​

1. 更正一，帧中的所有项目

​

​

正确代码

def EDM_GUI(self, column):
    self.EDM_frm = Frame(self.root)

    EDM_Label_frm = Frame(self.EDM_frm)
    EDM_lbl = Label(EDM_Label_frm, text="EDM", fg="black").pack()
    EDM_Label_frm.pack()

    EDM_DD_frm = Frame(self.EDM_frm)

    EDM_DB_frm = Frame(EDM_DD_frm)
    EDM_DD_label = Label(EDM_DB_frm, text="Select EDM:", fg="black")
    EDM_DD_label.pack(side="left")
    EDM_Drop_Down = ttk.Combobox(EDM_DB_frm, state="readonly")
    EDM_Drop_Down["values"] = ("One", "Two", "Three")
    EDM_Drop_Down.pack(side="right")
    EDM_DB_frm.pack(side="top")

    EDM_Port_frm = Frame(EDM_DD_frm)
    EDM_P_label = Label(EDM_Port_frm, text="Select Portfolio:", fg="black")
    EDM_P_label.pack(side="left")
    Port_Drop_Down = ttk.Combobox(EDM_Port_frm, state="readonly")
    Port_Drop_Down["values"] = ("One", "Two", "Three")
    Port_Drop_Down.pack(side="right")
    EDM_Port_frm.pack(side="bottom")

    EDM_DD_frm.pack()
    self.EDM_frm.pack()

只在您喜欢全局名称空间污染时才使用通配符导入。

Answer 2

这个问题源于您在创建小部件的同时调用pack：

EDM_Label_frm = Frame(self.EDM_frm).pack(side = "top")

在python中，当您执行foo().bar()时，无论bar()返回什么，结果都是。因此，在Frame(...).pack(...)的情况下，您将得到.pack(...)返回的内容。pack总是返回None，因此EDM_Label_frm被设置为None。

由于EDM_Label_frm设置为None，因此该框架的任何子帧实际上都是根框架的子框架。当您调用pack或grid时，您最终会将它们放置在根窗口中。

因此，您应该将小部件创建与小部件布局分开。我建议您始终这样做，尽管从技术上讲，您只需要在需要将小部件用作其他命令的参数时才需要这样做。

如果您做了这一项更改，UI将看起来更接近您的预期。我发现最好总是将布局组合在一起，这样就更容易获得布局的总体视图。在许多情况下，当您将所有布局组合在一起时，我认为它可以提高代码的可读性。

例如：

EDM_Label_frm = Frame(self.EDM_frm)
EDM_DD_frm = Frame(self.EDM_frm)
EDM_DB_frm = Frame(EDM_DD_frm)
EDM_Port_frm = Frame(EDM_DD_frm)

self.EDM_frm.pack(side = "top")
EDM_Label_frm.pack(side = "top")
EDM_DD_frm.pack(side = "bottom")
EDM_DB_frm.pack(side = "top")
EDM_Port_frm.pack(side = "bottom")