如何使用 Tkinter 设置网格的位置? [英] How do you set the position of a grid using Tkinter?

问题描述

甚至可以在 Tkinter 中设置网格的绝对位置吗?我正在尝试创建一个如下所示的 GUI，但我可能会以错误的方式进行操作.那么如果可能的话，你如何设置网格位置?

Is it even possible to set the absolute position of a grid within Tkinter? I am trying to create a GUI that looks like the one below, but I am probably going about it the wrong way. So if it is possible, how do you set the grid position?

目标图形用户界面:

到目前为止，我的 GUI 是这样的:

This is how my GUI is turning out, so far:

如您所见，我的新联系人需要在右侧，而联系人列表应在左侧.我了解如何使用绝对值移动联系人列表，但我可以对我的网格元素执行相同的操作吗?或者我应该对所有这些都使用绝对值，并结合填充?

As you can see, my New Contact needs to be on the right, while the Contact List should be on the left. I understand how to move the Contact List using absolute values, but can I do the same for my grid elements? Or should I use absolute values with all of them, combined with padding?

目前，这是我的代码:

from tkinter import *
contacts=['Justin Day']

class Contact_manager (Frame):

    def __init__(self, parent):
        Frame.__init__(self, parent)

        self.parent = parent
        self.initUI()

    def initUI(self):
        self.parent.title("Contact Manager")
        self.pack(fill=BOTH, expand=1)

        #New contact grid
        Label (self, text = "New Contact").grid (row=0, columnspan=2)
        Label (self, text = "First Name:").grid (row=1, sticky=E)
        Label (self, text = "Last Name:").grid (row=2, sticky=E)
        Label (self, text = "Phone#").grid (row=3, sticky=E)

        self.entry1 = Entry(self)
        self.entry2 = Entry(self)
        self.entry3 = Entry(self)
        self.entry1.grid (row=1, column=1)
        self.entry2.grid (row=2, column=1)
        self.entry3.grid (row=3, column=1)

        friend_check = IntVar()
        self.friend_check = Checkbutton (self, variable = friend_check,
                                 command = self.friend_box,
                                 text = "Friend")
        self.friend_check.grid (row=4, columnspan=2)

        Label (self, text = "Email:").grid (row=5, sticky=E)
        Label (self, text = "Birthday:").grid (row=6, sticky=E)

        self.entry4 = Entry(self)
        self.entry5 = Entry(self)
        self.entry4.grid (row=5, column=1)
        self.entry5.grid (row=6, column=1)

        #Contact listbox
        Label (self, text = "Contact List").place(x=20, y=190)
        contact_lb = Listbox(self)
        for i in contacts:
            contact_lb.insert(END, i)

        contact_lb.bind("<<ListboxSelect>>", self.onSelect)
        contact_lb.place(x=20, y=210)

    def onSelect(self, val):

        sender = val.widget
        idk = sender.curselection()
        value = sender.get(idx)

        self.var.set(value)

    def friend_box():
        if friend_check.get() == 1:
            contacts.append(Friend(f, l, p, e, bd))
        else:
            contacts.append(Person(f, l, p))
def main():

    root = Tk()
    ex = Contact_manager(root)
    root.geometry('600x700+200+100')
    root.mainloop()

if __name__ == '__main__':
    main()

推荐答案

您应该采用分而治之的方法在 GUI 中布置小部件.不要试图一次完成所有事情或使用一个几何管理器来协调一个窗口中的所有内容.有条不紊，一次解决一个小问题.

You should take a divide-and-conquer approach to laying out widgets in a GUI. Don't try to do everything at once or use one geometry manager to coordinate everything in one window. Be methodical, and tackle one small problem at a time.

例如，在您的目标 GUI 中，您似乎有四个部分:联系人列表、一个搜索框和按钮、一个新的联系表单以及右下角的某些内容(搜索结果?).如果我认为这些是四个不同的区域是正确的，请从创建四个框架开始.使用 grid 将它们放置在主窗口的四个角.为每个帧指定不同的颜色(用于调试目的).现在，摆弄选项，直到这四个区域以您想要的方式增长和缩小.确保给列和行赋予权重，以便它们都能正确调整大小.

For example, in your target GUI it appears you have four sections: the contact list, a search box and button, a new contact form, and something in the lower right corner (search results?). If I am correct that those are four distinct areas, start by creating four frames. Use grid to place them in the four corners of the main window. Give each frame a distinct color (for debugging purposes). Now, fiddle with options until those four areas grow and shrink in the way that you want. Make sure you give the columns and rows weight so that they all resize properly.

既然您已经完成了这些，您就有了四个更小、更易于管理的布局问题.现在，可能是我错了——也许你有两个区域，左和右.或者也许你有三个 - 左边，然后是右上角和右下角.现在我们假设我是对的，但无论如何技术都保持不变.

Now that you've done that, you have four smaller, more manageable layout problems. Now, it could be that I'm wrong -- maybe you have two areas, left and right. Or maybe you have three -the left, and then the upper right and the lower right. For now we'll assume I'm right but the technique remains the same regardless.

看起来您已经有了联系表单的布局，因此将它们移到右上角的框架中.确保在您扩大和缩小窗口时它们都正确扩大和缩小(因此，您可以扩大和缩小包含框架).

It looks like you already have the layout for the contact form, so move those into the upper-right frame. Make sure they all expand and shrink properly when you grown and shrink the window (and thus, you grow and shrink the containing frame).

完成后，开始下一部分——将联系人列表放在左上角.再次，确保它都正确调整大小.在这一点上，您不必担心右侧的小部件，因为您已经整理好了这些小部件.对于本节，您不需要网格，您可以使用 pack，因为它只是堆叠在彼此之上的几个小部件.但是，您可以使用最有意义的那个.

Once you have done that, work on the next section -- put the contact list in the upper left corner. Again, make sure it all resizes properly. At this point you shouldn't have to worry about the widgets on the right because you already have those sorted out. For this section you don't need grid, you can use pack since it's just a couple widgets stacked on top of each other. However, you can use whichever makes the most sense.

继续这样，处理 GUI 的其余两个角.有条不紊，一次处理一个独立的小部分.

Continue on this way, working on the remaining two corners of the GUI. Be methodical, and tackle small independent sections one at a time.

这篇关于如何使用 Tkinter 设置网格的位置?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！