Layout of tkinter control

There are three ways to layout controls in tkinter: (1) pack layout (2) grid layout (3) place layout Package Layout uses block to organize controls. ...

There are three ways to layout controls in tkinter:

(1) pack layout

(2) grid layout

(3) place layout

Package Layout uses block to organize controls. Package (options,...), options parameters can be selected: side, fill, padx/pady, anchor, etc.
21 - set up three labels and use the pack method layout.

from tkinter import * win=Tk() label1=Label(win,text="Skyreach pillar" ,bg="blue") label2=Label(win,text="Bumblebee",bg="yellow") label3=Label(win,text="Ambulance",bg="red") label1.pack() label2.pack() label3.pack() win.mainloop()

By default, the pack age layout arranges the involved labels from top to bottom. To change the position of the label, use the side parameter.
22 - use the side parameter to rearrange the three labels.

from tkinter import * win=Tk() label1=Label(win,text="Skyreach pillar",bg="blue") label2=Label(win,text="Bumblebee",bg="yellow") label3=Label(win,text="Ambulance",bg="red") label1.pack(side=LEFT) label2.pack(side=LEFT) label3.pack(side=LEFT) win.mainloop()

At this time, the three labels will be arranged horizontally, in addition to LEFT (from LEFT to RIGHT), top (from top to BOTTOM), BOTTOM (from BOTTOM to top), and RIGHT (from RIGHT to LEFT). When using the pack method, you can use padx / pad to set the distance between the control boundary and the container boundary.
ipadx/ipady is used to control the distance between the label text and the x or y axis of the label container.

23 - increase the spacing of 10 pixels above and below the label bumblebee.

from tkinter import * win=Tk() label1=Label(win,text="Skyreach pillar",bg="blue") label2=Label(win,text="Bumblebee",bg="yellow") label3=Label(win,text="Ambulance",bg="red") label1.pack(fill=X) label2.pack(pady=10) label3.pack(fill=X) win.mainloop()

24 - let the Bumblebee tag the x-axis at a distance of 10.

from tkinter import * win=Tk() label1=Label(win,text="Skyreach pillar",bg="blue") label2=Label(win,text="Bumblebee",bg="yellow") label3=Label(win,text="Ambulance",bg="red") label1.pack() label2.pack(ipadx=10) label3.pack() win.mainloop()

25 - create a label with "OK" content at the bottom left of the window. The distance between the label and the left and the bottom of the window is 10 pixels.

from tkinter import * win=Tk() label=Label(win,text="OK",font="Song style 20 bold",bg="blue",fg="white") label.pack(anchor=W,side=LEFT,padx=10,pady=10) win.mainloop()

grid layout: organize controls through a table like structure.
grid (options,...), options parameters can be row, column, padx / paddy, rowspan, columnspan, sticky, etc

26 row and column experience.

from tkinter import * win=Tk() label1=Label(win,text="Skyreach pillar",bg="blue") label2=Label(win,text="Bumblebee",bg="yellow") label3=Label(win,text="Ambulance",bg="red") label4=Label(win,text="Decepticons",relief="raised") label5=Label(win,text="Skyreach pillar",relief="raised") label6=Label(win,text="Bumblebee",relief="raised") label7=Label(win,text="Ambulance",relief="raised") label8=Label(win,text="Decepticons",relief="raised") label1.grid(row=0,column=0) label2.grid(row=0,column=1) label3.grid(row=0,column=2) label4.grid(row=0,column=3) label5.grid(row=1,column=0) label6.grid(row=1,column=1) label7.grid(row=1,column=2) label8.grid(row=1,column=3) win.mainloop()

Use of 27 columnspan

from tkinter import * win=Tk() label1=Label(win,text="Skyreach pillar",relief="raised") label2=Label(win,text="Bumblebee",relief="raised") label4=Label(win,text="Decepticons",relief="raised") label5=Label(win,text="Skyreach pillar",relief="raised") label6=Label(win,text="Bumblebee",relief="raised") label7=Label(win,text="Ambulance",relief="raised") label8=Label(win,text="Decepticons",relief="raised") label1.grid(row=0,column=0) label2.grid(row=0,column=1,columnspan=2) label4.grid(row=0,column=3) label5.grid(row=1,column=0) label6.grid(row=1,column=1) label7.grid(row=1,column=2) label8.grid(row=1,column=3) win.mainloop()

columnspan merges tags 2 and 3 into a single tag. columnspan controls the number of merges in the column direction, and rowspan indicates the number of merges in the row direction.

sticky is similar to anchor, but only N/S/W/E can be set, i.e. up / down / left / right

Use of 28 sticky

from tkinter import * win=Tk() label1=Label(win,text="Skyreach pillar",) label2=Label(win,bg="green",width=20) label3=Label(win,text="Ambulance") label4=Label(win,bg="blue",width=20) label1.grid(row=0,column=0,padx=5,pady=5,sticky=W) label2.grid(row=0,column=1,padx=5,pady=5) label3.grid(row=1,column=0,padx=5) label4.grid(row=1,column=1,padx=5) win.mainloop()

A place layout allows you to specify the size and location of components.

29 place layout.

from tkinter import * win=Tk() label1=Label(win,text="Skyreach pillar",bg="blue") label2=Label(win,text="Bumblebee",bg="yellow") label3=Label(win,text="Ambulance",bg="red") label1.place(x=0,y=0) label2.place(x=30,y=50) label3.place(x=60,y=100) win.mainloop()

In this method, x/y parameters are used. x and Y parameters can directly set the position at the top left of the window component. x is increasing to the right, y is increasing to the down.

Use width/height to control the entity size of the control.

30 - set image label position and size in the window.

from tkinter import * win=Tk() win.geometry('800x600') picture1=PhotoImage(file=r'C:\Users\Administrator\Desktop\xingkong.png') label1=Label(win,image=picture1) label1.place(x=20,y=30,width=200,height=120) picture2=PhotoImage(file=r'C:\Users\Administrator\Desktop\user.png') label2=Label(win,image=picture2) label2.place(x=200,y=200,width=400,height=240) win.mainloop()

The relx/rely parameter sets the position relative to the parent window, and the relwidth/relheight parameter sets the relative size.

The application of 31 relx / rely and relwidth/relheight.

from tkinter import * win=Tk() win.geometry('600x400') picture1=PhotoImage(file=r"C:\Users\Administrator\Desktop\xingkong.png") label1=Label(win,image=picture1) label1.place(relx=0.1,rely=0.1,relwidth=0.8,relheight=0.8) win.mainloop()

4 November 2019, 19:24 | Views: 5199

Add new comment

For adding a comment, please log in
or create account

0 comments