将背景图像添加到根窗口并将标签放在背景图像的顶部

Question

我正在尝试将背景图片添加到我的根窗口，但它似乎对我不起作用。这是我的代码。我希望背景图像覆盖整个窗口，并将标签放在背景图像的顶部。

from tkinter import *
from tkinter import messagebox


top = Tk()
textButton = Frame(top)
textButton.pack()

img = PhotoImage(file="bk.gif")
img = img.subsample(1, 1)
background = Label(top, image = img, bd=0)
background.pack()
background.image = img

name_label = Label(textButton, text="Username")
name_label.grid(row=1, sticky=W)

name_entry = Entry(textButton)## the Entry will let the user entre text inside the text box
name_entry.grid(row=1, column=1)


password_label = Label(textButton, text="Password")
password_label.grid(row=2, sticky=W)

password_entry = Entry(textButton, show="*")
password_entry.grid(row=2, column=1)


top.mainloop

Answer 1

您必须使用background作为窗口小部件的父级，才能将它们放在Label的背景中。

我删除Frame以使其更简单。现在我可以使用weight自动调整窗口小部件周围的空行和列，以便它们位于中心。

import tkinter as tk

top = tk.Tk()
top.geometry('250x250')

img = tk.PhotoImage(file="hal_9000.gif")
img = img.subsample(1, 1)

background = tk.Label(top, image=img, bd=0)
background.pack(fill='both', expand=True)
background.image = img

# resize empty rows, columns to put other elements in center
background.rowconfigure(0, weight=100)
background.rowconfigure(3, weight=100)
background.columnconfigure(0, weight=100)
background.columnconfigure(3, weight=100)

name_label = tk.Label(background, text="Username")
name_label.grid(row=1, column=1, sticky='news')

name_entry = tk.Entry(background)## the Entry will let the user entre text inside the text box
name_entry.grid(row=1, column=2)

password_label = tk.Label(background, text="Password")
password_label.grid(row=2, column=1, sticky='news')

password_entry = tk.Entry(background, show="*")
password_entry.grid(row=2, column=2)

top.mainloop()

结果：

如您所见，小部件具有灰色背景，您无法删除。如果您需要没有灰色背景的文字，那么您必须使用Canvas create_text()（和create_window()来Entry）

用于测试代码的Gif文件（带HAL 9000）：

Answer 2

您可以使用place将图片用作其他窗口小部件的背景。 place不会影响其他小部件的几何图形，因此您可以将其与grid或pack一起使用。

要记住的主要想法是，您应该在创建其他小部件之前执行此操作，以使其在堆叠顺序中最低。那，或者一定要在其上调用lower，否则它将覆盖其他小部件而不是它们。

使用您的代码，只需删除background.pack()并将其替换为以下两行：

background.place(relx=.5, rely=.5, anchor="center")
background.lower()

您不需要更改任何其他内容。以上是图像的中心。如果你想让图像从左上角开始，你可以这样做：

background.place(x=0, y=0, anchor="nw")