简体   繁体   中英

How to align different widgets in frame inside a window

I am creating a little student database system and I have to put labels, entries, buttons all of these things in it but seems like aligning widgets is not easy.

Also my radiobuttons disappeared while trying to align those below entries. Please help.

Please see this screenshot

I want to align all the labels and entries and buttons on the other side.

Here is the code

import tkinter
from tkinter import *
from tkinter import ttk

mainwindow = Tk()
mainwindow.title('Student Database')
mainwindow.config(bg='#4d4d4d')


#centering the main window on screen
def centrewindow(w, h):
    ws = mainwindow.winfo_screenwidth()
    hs = mainwindow.winfo_screenheight()
    x = (ws/2) - (w/2)
    y = (hs/2) -(h/2)
    mainwindow.geometry('%dx%d+%d+%d' % (w, h, x, y))
centrewindow(900, 500)

#Creatiing Main Frame of our GUI
mainframe = Frame(width= 500, height= 350, bg= '#d9d9d9', bd= 0.3, relief= SOLID)
mainframe.pack(pady=150, padx= 250, fill='both', expand=True)


#Creating Tab Control here
tabcontrol = ttk.Notebook(mainframe)


#Tab1 for Regiratation for new students
tab1 = ttk.Frame(tabcontrol)
tabcontrol.add(tab1, text='New Student')


studentnamelabel = Label(tab1, text='Enter Student Name:', font=('Open Sans Semibold', 12))
studentnamelabel.grid(row=0, column=0, padx= 50, pady= 10)
studentnameentry = Entry(tab1, width= 70)
studentnameentry.grid(row=0, column=1, padx=300, pady= 10)

rollnolabel = Label(tab1, text='Enter Rollno:', font=('Open Sans Semibold', 12))
rollnolabel.grid(row=1, column=0, padx= 100, pady= 10)
rollnoentry = Entry(tab1, width= 70)
rollnoentry.grid(row=1, column=1, padx=300, pady= 10)

genderlabel = Label(tab1, text='Select Gender:', font=('Open Sans Semibold', 12))
genderlabel.grid(row=2, column=0, padx= 20, pady= 10)
genderradio1 = Radiobutton(tab1, text='Male', value= 1)
genderradio1.grid(row=2, column=1, padx=100, pady=10)
genderradio2 = Radiobutton(tab1, text='Female',value= 2)
genderradio2.grid(row=2, column=2, padx=10, pady=10)




tab2 = ttk.Frame(tabcontrol)
tabcontrol.add(tab2, text='Tab no. 2')
l2 = Label(tab2, text='Hello Its Tab 2')
l2.pack()

tabcontrol.pack(expand=1, fill='both')
mainwindow.mainloop()

Aligning widgets is not so easy as it seems. To align a widget we have three different methods(pack, grid, place), where you have used the grid method which I also prefer. You have used padding with a large value which has changed its alignment to worse. Try adjusting the padding and grid on your own. If still, you have a problem you are welcomed to reach me and I will provide you with the code with a nice alignment, but try approaching it on your own else if you are unable to comment me.

在此处输入图像描述

"place" instead of "grid" can be used for those radiobuttons;

genderradio1 = Radiobutton(tab1, text='Male', value= 1)
genderradio1.place(x=700,y=100)
genderradio2 = Radiobutton(tab1, text='Female',value= 2)
genderradio2.place(x=750,y=100)

You can change x-value for both if you want to relocate (I think i managed to locate buttons on to y axis correctly. But you can adjust if it's not convenient for you). Please remember that decreasing x-value will locate buttons to the left hand side and vise versa and simalarly, decreasing y-value will move buttons on top and vise versa. Please check below;

import tkinter
from tkinter import *
from tkinter import ttk

mainwindow = Tk()
mainwindow.title('Student Database')
mainwindow.config(bg='#4d4d4d')


#centering the main window on screen
def centrewindow(w, h):
    ws = mainwindow.winfo_screenwidth()
    hs = mainwindow.winfo_screenheight()
    x = (ws/2) - (w/2)
    y = (hs/2) -(h/2)
    mainwindow.geometry('%dx%d+%d+%d' % (w, h, x, y))
centrewindow(900, 500)

#Creatiing Main Frame of our GUI
mainframe = Frame(width= 500, height= 350, bg= '#d9d9d9', bd= 0.3, relief= SOLID)
mainframe.pack(pady=150, padx= 250, fill='both', expand=True)


#Creating Tab Control here
tabcontrol = ttk.Notebook(mainframe)


#Tab1 for Regiratation for new students
tab1 = ttk.Frame(tabcontrol)
tabcontrol.add(tab1, text='New Student')


studentnamelabel = Label(tab1, text='Enter Student Name:', font=('Open Sans Semibold', 12))
studentnamelabel.grid(row=0, column=0, padx= 50, pady= 10)
studentnameentry = Entry(tab1, width= 70)
studentnameentry.grid(row=0, column=1, padx=300, pady= 10)

rollnolabel = Label(tab1, text='Enter Rollno:', font=('Open Sans Semibold', 12))
rollnolabel.grid(row=1, column=0, padx= 100, pady= 10)
rollnoentry = Entry(tab1, width= 70)
rollnoentry.grid(row=1, column=1, padx=300, pady= 10)

genderlabel = Label(tab1, text='Select Gender:', font=('Open Sans Semibold', 12))
genderlabel.grid(row=2, column=0, padx= 20, pady= 10)
genderradio1 = Radiobutton(tab1, text='Male', value= 1)
genderradio1.place(x=700,y=100)
genderradio2 = Radiobutton(tab1, text='Female',value= 2)
genderradio2.place(x=750,y=100)




tab2 = ttk.Frame(tabcontrol)
tabcontrol.add(tab2, text='Tab no. 2')
l2 = Label(tab2, text='Hello Its Tab 2')
l2.pack()

tabcontrol.pack(expand=1, fill='both')
mainwindow.mainloop()

Use sticky option from grid() for text labels to be aligned,

studentnamelabel = Label(tab1, text='Enter Student Name:', font=('Open Sans Semibold', 12))
studentnamelabel.grid(row=0, column=0, sticky=E)

and remove padx and pady . Set columnspan=2 on Entry.grid() and then sticky again for radiobuttons to be aligned,

studentnameentry = Entry(tab1, width= 70)
studentnameentry.grid(row=0, column=1, columnspan=2, padx=300, pady= 10)

and,

genderradio1 = Radiobutton(tab1, text='Male', value= 1)
genderradio1.grid(row=2, column=1, sticky=E)
genderradio2 = Radiobutton(tab1, text='Female',value= 2)
genderradio2.grid(row=2, column=2, sticky=W)

and remove padx and pady .

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM