I can't figure out how to put buttons on top off my background picture, I've tried many forums, but none off the answers worked

Question

So I am making a \"HUB\" for my game, and I got my background there, but I can\'t display the buttons over the background. I\'ve searched up on many forums and none off the

Answer 1

I have adapted your code to work on my side.. just a few tweaks will make what I think you wanted as a result :-)

You may want to document on columnconfigure and rowconfigure, and the sticky parameter of the grid method.

from tkinter import *    
root = Tk()
root.geometry("1280x640")
root.title("Choose level")

# Let's assume we are not using your frame.
#topFrame = Frame(root, width=1280, height=640)
#topFrame.grid(row=0)

background = PhotoImage(file="HUB_BG.png")
background1 = Label(root, image=background)

# adding a column to use columnconfigure and rowconfigure...
# using sticky so the image stays expanded in your widget
background1.grid(column=0, row=0, sticky='nsew')
# Below will stick your background label so it doesn't resize with your widgets
root.columnconfigure(0, weight=1)
root.rowconfigure(0, weight=1)

# replaced topframe with background1.
level1 = Button(background1, text="Level 1")
level1.grid(row=0)
level2 = Button(background1, text="Work in progress")
level2.grid(row=1)

Answer 2

The simplest solution for using a background image is to use place to add the image as a background. place won't change anything about the size of the parent or the layout of any other widgets in the parent, and other widgets can be added on top with grid or pack like you normally would.

Note that it's important that you create the image widget before you create the other widgets so that it is lower in the stacking order. Alternatively, you can call the lower() method on the widget to move it to the bottom of the stacking order.

Example:

background1.place(relx=.5, rely=.5, anchor="c")