首页 > 解决方案 > Tkinter 布局问题

问题描述

我无法按照我想要的方式进行布局。我对这个模块比较陌生,感觉不是很灵活,除非我只是错误地使用了这些功能。我尝试过使用带包的框架、带网格的框架、不带框架的网格和不带框架的包。打包感觉与 CSS 中的浮动非常相似,但同时又不是。

root = Tk()
root.title("Derivative Calculator GUI")

input = Entry(bg="white")
input.grid(row=0, column=0)
derivbutton = Button(text="Derive This")
derivbutton.grid(row=0, column=1)
secondderiv = Button(text="Second Derivative")
secondderiv.grid(row=1, column=1)
AnswerLabel = Label(text="Answer")
AnswerLabel.grid(row=2, column=0)
StepsLabel = Label(text="Step-by-Step:")
StepsLabel.grid(row=3, column=0)

WhiteBoard = Canvas(width=525, height=400, bg="white")
drawFunction = WhiteBoard.bind("<B1-Motion>", hold)
drawFunction2 = WhiteBoard.bind("<ButtonRelease-1>", release)
WhiteBoard.grid(row=3, column=2)
ClearButton = Button(width=75, height=3, text="Clear All", bg="white", command=clear_all)
ClearButton.grid(row=4, column=2)
ToolBar1 = Frame()
PencilButton = Button(text="Pencil", bg="grey", width=2, height=2)
PencilButton.grid()
ToolBar1.grid(row=0,column=2)
ToolBar2 = Frame()
ToolBar2.grid(row=1, column=2)


root.mainloop()

我希望它看起来像什么: 我的 GUI 的 MS Paint 表示

它实际上是什么样子: 实际的 GUI

标签: pythontkinter

解决方案


不要将所有内容都放在根窗口中,也不要尝试仅使用grid或仅使用pack. 有条不紊。

例如,您的 GUI 看起来分为两个部分:左侧的区域有一个方程式、一些按钮,以及“答案:”和“步骤”部分。右侧区域有一些按钮和一个画布或文本小部件。因此,首先创建两个框架,然后pack将它们并排放置。

接下来,处理左框架。它似乎由三个部分组成:方程式和一些按钮、一个答案部分和一个步骤部分。这些区域从上到下排列。您可以创建三个框架并用 排列它们pack,也可以尝试用 排列它们grid。两者都应该可以,尽管我可能至少会为顶部制作一个框架。

最后,解决右边的问题。同样,它似乎由三个部分组成,因此三个框架会使工作更容易:一个用于顶部的按钮,一个用于中间的东西,一个用于底部的按钮。

不要试图一下子把这一切都说清楚。一次只做一个部分。最初给每一帧一个独特的颜色,这样你就可以看到一帧在哪里结束,下一帧从哪里开始。


推荐阅读