Home > OS >  How do I center widgets on tkinter?
How do I center widgets on tkinter?

Time:01-29

I'm really new to tkinter, and I've been trying to build a GUI that can add/delete users and put all the users inside a table. But I'm having trouble centering the add entry frame (where name,age,gender widgets are stored) and the delete entry frame (where id widgets are stored). I also want to fill the lower portion of the window with the table. I've been trying to use paddings to do this but to no avail. Here's my code:

from tkinter import *
from tkinter import ttk  

## GUI

root = Tk()
root.geometry('800x800')
root.resizable(False,False)

 # top frame
top_frame = Frame(root, bg= '#e3e6e4')
top_frame.grid(row= '0',column= '0',ipadx= '200')

## TABLE
user_columns = ('id','name', 'age', 'gender')
table = ttk.Treeview(root, columns= user_columns, show = 'headings', height = '6')
table.grid(row= '1', column = '0',padx = '20',pady= '20')

# heading config
table.heading('id', text= 'ID')
table.heading('name', text= 'Name')
table.heading('age', text= 'Age')
table.heading('gender', text= 'Gender')

## ADD ENTRY FEATURE
add_entry_frame = Frame(top_frame, bg='blue',bd='5')
add_entry_frame.grid(row= '0',column = '0',padx= '20',pady= '20')

    # Name
name_label = Label(add_entry_frame, text='Name:',bg= '#e3e6e4')
name_entry = Entry(add_entry_frame,width='20',borderwidth = '2')

name_label.grid(row= '0',column = '0')
name_entry.grid(row= '0',column = '1')

    # Age
age_label = Label(add_entry_frame,text='Age:',bg= '#e3e6e4')
age_entry = Entry(add_entry_frame,width='20',borderwidth = '2' )

age_label.grid(row= '1',column = '0')
age_entry.grid(row= '1',column = '1')

    # Gender
gender_label = Label(add_entry_frame,text='Gender:',bg= '#e3e6e4')
gender_entry = Entry(add_entry_frame,width='20',borderwidth = '2')

gender_label.grid(row= '2',column = '0')
gender_entry.grid(row= '2',column = '1')


    # Add Entry Button
add_entry_button = Button(add_entry_frame,text='Add Entry',width='10',bg= '#2a49a3',fg= 'white')
add_entry_button.grid(row='3',column = '1',pady = '10')

# Add Entry Message
add_label_message = StringVar()
add_message = Label(add_entry_frame, textvariable= add_label_message)

## DELETE ENTRY FEATURE
delete_entry_frame = Frame(top_frame,bg='yellow',bd='5')
delete_entry_frame.grid(row = '0', column = '1',padx= '20',pady= '20')

    # ID
id_label = Label(delete_entry_frame, text='ID:',bg= '#e3e6e4')
id_entry = Entry(delete_entry_frame,width='20',borderwidth = '2')

id_label.grid(row= '0',column = '0')
id_entry.grid(row= '0',column = '1')

    # Delete Entry Button
delete_entry_button = Button(delete_entry_frame,text='Delete Entry',width='10',bg= '#2a49a3',fg= 'white')
delete_entry_button.grid(row='1',column = '1',padx= '20',pady= '20')


root.mainloop()

Below is the output that I have and the output that I want (I set the frames in different colors so it can easily be distinguised from each other).

The Output that I have

enter image description here

The Output I need enter image description here

CodePudding user response:

You need to change from .grid to .place to make it more easy This is the code:

from tkinter import *
from tkinter import ttk



root = Tk()
root.geometry('800x800')
root.resizable(False, False)

top_frame = Frame(root, bg='#e3e6e4')
top_frame.place(rely=0.1, relx=0.5, anchor=CENTER)


user_columns = ('id', 'name', 'age', 'gender')
table = ttk.Treeview(root, columns=user_columns, show='headings', height='6')
table.place(rely=0.5, relx=0.5, anchor=CENTER)


table.heading('id', text='ID')
table.heading('name', text='Name')
table.heading('age', text='Age')
table.heading('gender', text='Gender')


add_entry_frame = Frame(top_frame, bg='blue', bd='5')
add_entry_frame.grid(row='0', column='0', padx='20', pady='20')


name_label = Label(add_entry_frame, text='Name:', bg='#e3e6e4')
name_entry = Entry(add_entry_frame, width='20', borderwidth='2')

name_label.grid(row='0', column='0')
name_entry.grid(row='0', column='1')


age_label = Label(add_entry_frame, text='Age:', bg='#e3e6e4')
age_entry = Entry(add_entry_frame, width='20', borderwidth='2')

age_label.grid(row='1', column='0')
age_entry.grid(row='1', column='1')


gender_label = Label(add_entry_frame, text='Gender:', bg='#e3e6e4')
gender_entry = Entry(add_entry_frame, width='20', borderwidth='2')

gender_label.grid(row='2', column='0')
gender_entry.grid(row='2', column='1')


add_entry_button = Button(
    add_entry_frame, text='Add Entry', width='10', bg='#2a49a3', fg='white')
add_entry_button.grid(row='3', column='1', pady='10')

add_label_message = StringVar()
add_message = Label(add_entry_frame, textvariable=add_label_message)


delete_entry_frame = Frame(top_frame, bg='yellow', bd='5')
delete_entry_frame.grid(row='0', column='1', padx='20', pady='20')


id_label = Label(delete_entry_frame, text='ID:', bg='#e3e6e4')
id_entry = Entry(delete_entry_frame, width='20', borderwidth='2')

id_label.grid(row='0', column='0')
id_entry.grid(row='0', column='1')

delete_entry_button = Button(
    delete_entry_frame, text='Delete Entry', width='10', bg='#2a49a3', fg='white')
delete_entry_button.grid(row='1', column='1', padx='20', pady='20')


root.mainloop()

The output is this

Mohammed Maged;

  •  Tags:  
  • Related