Fish C Note--python GUI programming (16): Tkinter's three major layout manager packs, grid, and place

What is layout Manager: Managing how our components are arranged

Tkinter provides us with three layout managers: Pack, grid, and place

Packs, grid, and place are used to manage the layout of all components that are under a parent component, where:

Pack is to arrange components in the order they are added

Grid is the arrangement of components by row and column

Place allows the programmer to specify the size and location of the component

When to use the pack manager.

Compared to the grid manager, the pack is more suitable for the arrangement of a small number of components, but it is simpler to use (as in all previous examples, we typically use the. Pack () method directly). If you need to create a relatively complex layout structure, it is recommended that you use multiple frame structures or use the grid manager to implement them.

Note: Do not mix pack () and grid () with the same parent component because Tkinter cannot determine which layout manager to use first.

One of the things we often encounter is to put a component in a container component and populate the entire parent component. Here's an example of building a ListBox component and populating it in the root window:

From Tkinter import *

root = Tk ()

listbox = ListBox (Root)
listbox.pack (Fill=both, expand=true)
# The fill option is to populate the entire parent component, and the expand option is still filled with the for

I in range when stretched:
    listbox.insert (end, str (i))

Mainloop ()

Where the Fill option tells the window manager that the component will populate the entire space allocated to it, both represents both horizontal and vertical extensions, X to landscape, and Y to portrait. The expand option is to tell the window manager to fill in the extra space of the parent component.

By default, the pack is a vertical arrangement of the components that will be added

From Tkinter import *

root = Tk ()

Label (root, text= ' red ', bg= ' red ', fg= ' White '). Pack (fill=x) #fill选项是设置横向填充
Label (Root, text= ' red ', bg= ' green ', fg= ' black '). Pack (fill=x)
Label (Root, text= ' red ', bg= ' Blue ', fg= ' White '). Pack (fill=x)
#整体是纵向填充

#Label (root, text= ' red ', bg= ' red ', fg= ') White '). Pack (Side=left) You can set the side option

mainloop () If you want to arrange the whole of the components horizontally.

When to use the grid manager.

The grid manager can be said to be the most flexible and tkinter of the three layout managers. If you only want to learn to use a layout manager, then grid is definitely preferred. Using the grid is especially handy when you're designing a dialog box. Using a grid can be a simple implementation of the many frameworks and packs you use to build the effect.

Use grid to arrange components, just tell it where you want the component to be placed (rows/columns, row options specify rows, column options specify columns). In addition, you do not have to point out the dimensions of the grid (which is called a grid) in advance, because the manager automatically calculates.

To set a simple login interface:

From Tkinter import *

root = Tk ()

Label (root, text= ' username '). Grid (Row=0, column=0, sticky=w)  #sticky选项设置组件朝向 C3/>label (root, text= ' password '). Grid (Row=1, column=0, sticky=w)

Entry (root). Grid (Row=0, column=1)
Entry (Root, show= ' * '). Grid (Row=1, column=1)

Mainloop ()

With several grids to place a component, you can use RowSpan and ColumnSpan to implement the ability to cross columns across rows:

From Tkinter import *

root = Tk ()

label (root, text= ' username '). Grid (Row=0, column=0, sticky=w)
label (Root, text= ' Password '). Grid (Row=1, column=0, sticky=w)

photo = Photoimage (file= "D:\u.gif")  #只能是. gif format
Label (Root, Image=photo). Grid (Row=0, column=2, rowspan=2, padx=5, pady=5)  #rowspan选项设置了跨行, now the photo component can display 0, 12 lines. Padx,pady sets the margins so that the picture text does not get together

Entry (root). Grid (Row=0, column=1)
Entry (Root, show= ' * '). Grid (Row=1, Column=1)

def Test ():
    print (' Commit success ')

Button (root, text= ' Submit ', width=10, command=test). Grid (row=2, columnspan=3, pady=5)  #column默认是0

Mainloop ()

How to use the Place manager:

It is generally not recommended to use the place layout manager because it is more work to compare packs and grid,place. But the existence is reasonable, place in some special circumstances can play magical, even pack and grid cannot replace.

To display a subassembly in the middle of a parent component

From Tkinter import *

root = Tk ()

def callback ():
    print (' point to me ')

Button (root, text= ' dot me ', command= Callback). Place (relx=0.5, rely=0.5, Anchor=center)  #relx和rely是相对父组件的位置. 0 is the leftmost, 0.5 is the middle, and 1 is the rightmost

mainloop ()

In some cases, you want a component to overwrite another component. The following example uses a button to overwrite a label picture

From Tkinter import *

root = Tk ()

photo = Photoimage (file= "D:\u.gif")
Label (Root, Image=photo). Pack ()

DEF callback ():
    print (' point to me ')

Button (root, text= ' dot me ', command=callback). Place (relx=0.5, rely=0.5, anchor= CENTER)  #relx和rely是相对父组件的位置. 0 is the leftmost, 0.5 is the middle, and 1 is the rightmost

mainloop ()

The RELX and rely options specify the location relative to the parent component, the range is 00~1.0

The Relheight and Relwidth options Specify the dimensions relative to the parent component

From Tkinter import *

root = Tk ()

Label (root, bg= ' red '). Place (relx=0.5, rely=0.5, relheight=0.75, relwidth=0.75 , Anchor=center)  #relheight和relwidth是设置调用place的子组件相对于父组件的高度和宽度
Label (root, bg= ' yellow '). Place (relx=0.5, rely=0.5, relheight=0.5, relwidth=0.75, Anchor=center)
Label (root, bg= ' green '). Place (relx=0.5, rely=0.5, relheight=0.25, relwidth=0.75, Anchor=center)

Mainloop ()

There are also x and Y options for setting offsets (pixels), and if both relx (rely) and X (y) are set, place will first compute RELX and rely, and then implement the offset values specified by x and Y.

Method of Pack

Note: The bottom method applies to all components

Pack (**options)

--The specific meaning and usage of each option are listed below in detail

Anchor

--control the position of the component in the space allocated by the pack

--n, NE, E, SE, S, SW, W, NW or center to locate (Ewsn says Cardinal)

--The default value is center

Expand

--Specifies whether to populate additional space for the parent component

--Default value is False

Fill

--Specify space for Fill pack allocation

--The default value is None, which indicates the original size of the child component is maintained

--You can also use values such as: X (horizontal fill), Y (vertical fill), and both (horizontal and vertical padding)

In_:

--place the component in the component specified by this option

--The specified component must be a parent component of the component

IPADX:

--Specify an inner margin in the horizontal direction

Ipady:

--Specify an inner margin in the vertical direction

PADX:

--Specify the outer margin in horizontal direction

Pady:

--Specifies the outer margin in the vertical direction

Side

--Specify where components are placed

--The default value is top

--the values that can be set are: Left,bottom,right

Pack_configure (**options)

--Same as pack ()

Pack_forget ()

--"Remove" components from the screen

--and did not destroy the component, but could not see the

--"deleted" components can be displayed through a pack or other layout manager

Pack_info ()

--the option to return the current pack in the form of a dictionary

Pack_propagate (flag)

--if turned on, the parent component automatically adjusts the dimensions to accommodate all subassemblies

--The default is open (Flag=true)

--This method applies only to parent components

Pack_slaves ()

--Returns all child components of the component as a list

--This method applies only to parent components

The method of grid:

Note: The bottom method applies to all components

Grid (**options)

--The specific meaning and usage of each option are listed below

Column

--Specifies the column that the component inserts (0 for the first column)

--The default value is 0

ColumnSpan:

--Specify how many columns (across columns) to display the component

In_:

--place the component in the component specified by this option

--The specified component must be a parent component of the component

IPADX:

--Specify an inner margin in the horizontal direction

Ipady:

--Specify an inner margin in the vertical direction

PADX:

--Specify the outer margin in horizontal direction

Pady:

--Specifies the outer margin in the vertical direction

Row

--Specifies the line that the component inserts (0 for the first row)

RowSpan

--Specifies how many lines (across lines) to display the component

Sticky

--the position of the control component in the space allocated by the grid

--You can use n,e,s,w and their combination to locate

--Use a plus sign (+) to indicate an elongated fill, such as n+s means to lengthen the component vertically to fill the grid, n+s+w+e to fill the entire grid

--Center display without specifying the value

Grid_bbox (Column=none, Row=none, Col2=none, Row2=none)

--Returns a four-tuple description of the qualified rectangle in which the component is located

--If you specify the column and row arguments, the description of the qualified rectangle for the component of that position (column, row) is returned

Grid_columnconfigure (index, **options)

--Set the properties of the column

-Note: Set the grid sequence owned by this component

--The options and meanings you can set are as follows:

MinSize:

--Specifies the minimum width of the column

pad--Specifies the horizontal margin of the largest grid in the column

Weight

--Specify the relative distance between column and column

--The default value is 0

---Note: When you build a window, grid automatically assigns the size of the window according to the size of the component, and when you stretch the window the dimensions will be blank. This option is to specify whether columns and columns are filled with blanks, and the default is not to fill them. In addition, the value of this option is a multiple of the specified padding space, for example, a weight=2 column will fill one more space than the Weight=1 column, so the average padding is required, and all columns are set to Weight=1.

Grid_configure (**options)

--like Grid ()

Grid_forget ()

--"Remove" components from the screen

--and did not destroy the component, but could not see the

--You can display the deleted component through grid or another layout manager, but the option settings for that component's grid will not be restored

Grid_info ()

--the option to return to the current grid in the form of a dictionary

Grid_location (x, y)

--Returns the grid position at (or near) the given coordinate (x, y)

--The return value is a 2-tuple representation of the grid (columns, rows)

Grid_propagate (flag)

--if turned on, the parent component automatically adjusts the dimensions to accommodate all subassemblies

--The default is open (Flag=true)

--This method applies only to parent components

Grid_remove ()

--Same as Grid_forget (), but remember the option settings for the grid where the component resides

Grid_rowconfigure (index, **options)

--Set the properties of the row

--Note: Set the line of grid owned by this component

--The options and meanings you can set are as follows:

MinSize:

--Specifies the minimum height of the row

Pad

Specifies the vertical margin of the largest grid in the column

Weight

--Specifies the relative distance between rows

--The default value is 0

Grid_size ()

--Returns the size of the grid owned by the component

--The return value is a 2-tuple representing the number of grids (columns, rows), respectively

Grid_slaves (Row=none, Column=none)

--Returns all subcomponents of the component as a list

--This method applies only to parent components

The method of place

Note: The method below applies to all components

Place (**options)

--The meaning and usage of each option is listed below

Anchor

--the position of the control component in place allocation space

--n, NE, E, SE, S, SW, W, NW or center to locate (Ewsn says Cardinal)

--The default value is NW

Bordermode:

--Specify Border mode (inside or outside)

--The default value is inside

Height

--Specifies the height of the component (in pixels)

In_:

--place the component in the component specified by this option

--The specified component must be a parent component of the component

Relheight:

--Specifies the height of the component relative to the parent component

--The value range is 0.0~1.0

Relwidth:

--Specifies the width of the component relative to the parent component

--The value range is 0.0~1.0

RELX:

--Specifies the horizontal position of the component relative to the parent component

--The value range is 0.0~1.0

Rely

--Specifies the vertical position of the component relative to the parent component

--The value range is 0.0~1.0

Width

--Specifies the width of the component (in pixels)

X:

--Specifies the horizontal offset of the component (in pixels)

--If the RELX option is also specified, the RELX option is implemented first

Y:

--Specifies the vertical offset of the component (in pixels)

--If the rely option is also specified, the rely option is implemented first

Place_configure (**options)

--like place ()

Place_forget ()

--"Remove" components from the screen

--and did not destroy the component, but could not see the

--You can display deleted components through place or other layout management

Place_info ()

--the option to return the current place in the form of a dictionary

Place_slaves ()

--Returns all subcomponents of the component as a list

--This method applies only to parent components

Slaves ()

--Just like place_slaves ()

IPADX:

--Specify an inner margin in the horizontal direction

IPADX:

--Specify an internal margin in the horizontal direction