[英]How can I create this layout with Python3 using Tkinter with the grid geometry manager?
I am trying to create the following layout:我正在尝试创建以下布局:
This is my code:这是我的代码:
from . import FlowPane,JsonPane,PropertiesPane,ToolbarPane
import tkinter as tk
class ConflixEditor(tk.Tk):
def __init__(self, args):
super().__init__()
self.__dict__.update({k: v for k, v in locals().items() if k != 'self'})
self.minsize(width=1024, height=768)
self.title('Conflix Editor')
# Widget Creation
self.frame = tk.Frame(self)
self.toolbarPane = ToolbarPane.ToolbarPane(self.frame, bg='black')
self.flowPane = FlowPane.FlowPane(self.frame, bg='red')
self.propertiesPane = PropertiesPane.PropertiesPane(self.frame, bg='blue')
self.jsonPane = JsonPane.JsonPane(self.frame, bg='green')
# Widget Layout
self.grid_columnconfigure(0, weight=1)
self.grid_rowconfigure(2, weight=1)
self.frame.grid(row=0, column=0, sticky=tk.N+tk.E+tk.S+tk.W)
self.toolbarPane.grid(row=0, column=0, columnspan=3, rowspan=2, sticky=tk.N+tk.E+tk.W)
self.flowPane.grid(row=2, column=0, columnspan=2, rowspan=5, sticky=tk.N+tk.S+tk.W)
self.propertiesPane.grid(row=2, column=2, columnspan=1, rowspan=5, sticky=tk.N+tk.E+tk.S)
self.jsonPane.grid(row=7, column=0, columnspan=3, rowspan=3, sticky=tk.E+tk.S+tk.W)
The constructors for FlowPane, JsonPane, PropertiesPane, ToolbarPane all take two parameters: the parent widget and the background color. FlowPane、JsonPane、PropertiesPane、ToolbarPane 的构造函数都采用两个参数:父窗口小部件和背景颜色。
Instead of getting the desired result above, I am getting the following result:我没有得到上面想要的结果,而是得到以下结果:
What am I doing wrong?我究竟做错了什么? How can I create the desired layout?如何创建所需的布局? Note that the background colors are just temporary to confirm that each widget is using the correct amount of space.请注意,背景 colors 只是临时确认每个小部件正在使用正确的空间量。 This is eventually going to be an application for designing and building Netflix Conductor workflows.这最终将成为设计和构建 Netflix Conductor 工作流程的应用程序。 I want to have a toolbar with menus and buttons in the black area, a Canvas in the red area for displaying the flow-chart elements that represent tasks in the workflows, a Treeview for viewing properties in the blue area, and a Text Editor in the green area at the bottom for viewing/editing the raw JSON.我想在黑色区域有一个带有菜单和按钮的工具栏,在红色区域有一个 Canvas 用于显示代表工作流中的任务的流程图元素,在蓝色区域有一个 Treeview 用于查看属性,在底部的绿色区域用于查看/编辑原始 JSON。
You need to:你需要:
height
option for toolbarPane
and jsonPane
;为toolbarPane
和jsonPane
指定height
选项;width
option for propertiesPane
;为propertiesPane
指定width
选项;tk.E
to sticky
option for flowPane
;将tk.E
添加到flowPane
的sticky
选项;grid_rowconfigure()
and grid_columnconfigure()
for self
and self.frame
as well对self
和self.frame
使用grid_rowconfigure()
和grid_columnconfigure()
Below is an updated code:以下是更新的代码:
class ConflixEditor(tk.Tk):
def __init__(self, *args):
super().__init__()
#self.__dict__.update({k: v for k, v in locals().items() if k != 'self'})
self.minsize(width=1024, height=768)
self.title('Conflix Editor')
# make self.frame use all the space of root window
self.grid_columnconfigure(0, weight=1)
self.grid_rowconfigure(0, weight=1)
# Widget Creation
self.frame = tk.Frame(self)
self.toolbarPane = ToolbarPane.ToolbarPane(self.frame, bg='black', height=100) # added height option
self.flowPane = FlowPane.FlowPane(self.frame, bg='red')
self.propertiesPane = PropertiesPane.PropertiesPane(self.frame, bg='blue', width=250) # added width option
self.jsonPane = JsonPane.JsonPane(self.frame, bg='green', height=200) # added height option
# Widget Layout
self.frame.grid_columnconfigure(0, weight=1) # used self.frame instead of self
self.frame.grid_rowconfigure(2, weight=1) # used self.frame instead of self
self.frame.grid(row=0, column=0, sticky=tk.N+tk.E+tk.S+tk.W)
self.toolbarPane.grid(row=0, column=0, columnspan=3, rowspan=2, sticky=tk.N+tk.E+tk.W)
self.flowPane.grid(row=2, column=0, columnspan=2, rowspan=5, sticky=tk.N+tk.E+tk.S+tk.W) # added tk.E
self.propertiesPane.grid(row=2, column=2, columnspan=1, rowspan=5, sticky=tk.N+tk.E+tk.S)
self.jsonPane.grid(row=7, column=0, columnspan=3, rowspan=3, sticky=tk.E+tk.S+tk.W)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.