Tkinter widgets going onto different frames?

Question

I am making a quiz based game and i can't seem to figure out why my widgets are being placed everywhere. I had my StartPage all good but then when i added Page Two widgets in the seperate frame they went on to all different frames.

import tkinter as tk
from tkinter import *

TITLE_FONT = ("Helvetica", 18, "bold")


class foodtechquiz(tk.Tk):

    def __init__(self, *args, **kwargs):
        tk.Tk.__init__(self, *args, **kwargs)


        container = tk.Frame(self)
        container.pack(side="top", fill="both", expand=True)
        container.grid_rowconfigure(0, weight=1)
        container.grid_columnconfigure(0, weight=1)

        self.frames = {}
        for F in (StartPage, PageOne, PageTwo, PageThree, PageFour, PageFive):

           page_name = F.__name__
           frame = F(parent=container, controller=self)
           self.frames[page_name] = frame


           frame.grid(row=0, column=0, sticky="nsew")

        self.show_frame("StartPage")

    def show_frame(self, page_name):
        #Show a frame for the given page name
        frame = self.frames[page_name]
        frame.tkraise()


class StartPage(tk.Frame):

    def __init__(self, parent, controller):

        tk.Frame.__init__(self, parent)
        self.controller = controller
        controller.geometry("600x500")


        label = tk.Label(self, text="Food Technology Quiz", font=TITLE_FONT)
        label.place(x=160, y=30)

        name = tk.Label(self, text="By Jett Townsend", font=("comicsansms", 15), bg = "white")
        name.place(x=220, y=410)

        button1 = tk.Button(self, text="Health",
                        command=lambda: controller.show_frame("PageOne"))
        button1.place(x=100, y=200)
        button2 = tk.Button(self, text="Hygiene",
                        command=lambda: controller.show_frame("PageTwo"))
        button2.place(x=275, y=200)
        button3 = tk.Button(self, text="Equipment",
                        command=lambda: controller.show_frame("PageThree"))
        button3.place(x=430, y=200)
        button4 = tk.Button(self, text="Safety",
                        command=lambda: controller.show_frame("PageFour"))
        button4.place(x=175, y=340)
        button5 = tk.Button(self, text="Food Preperation",
                        command=lambda: controller.show_frame("PageFive"))
        button5.place(x=350, y=340)

        banana = PhotoImage(file = "C:/Users/Jett/Downloads/banana1.gif")
        question_image = Label(self, image = banana)
        question_image.photo = banana
        question_image.place(x=70, y=85)

        hands = PhotoImage(file = "C:/Users/Jett/Downloads/hygiene.gif")
        question_image = Label(self, image = hands)
        question_image.photo = hands
        question_image.place(x=235, y=100)

        frypan = PhotoImage(file = "C:/Users/Jett/Downloads/frypan.gif")
        question_image = Label(self, image = frypan)
        question_image.photo = frypan
        question_image.place(x=400, y=100)

        safety = PhotoImage(file = "C:/Users/Jett/Downloads/safety.gif")
        question_image = Label(self, image = safety)
        question_image.photo = safety
        question_image.place(x=140, y=230)

        foodprep = PhotoImage(file = "C:/Users/Jett/Downloads/foodprep1.gif")
        question_image = Label(self, image = foodprep)
        question_image.photo = foodprep
        question_image.place(x=338, y=250)



class PageOne(tk.Frame):

    def __init__(self, parent, controller):
        tk.Frame.__init__(self, parent)
        self.controller = controller



class PageTwo(tk.Frame):

    def __init__(self, parent, controller):


        tk.Frame.__init__(self, parent)
        self.controller = controller

        hygieneheading = tk.Label(text="Hygiene", font=("comicsansms", 25), bg = "white")
        hygieneheading.place(x=235, y=30)
        question = tk.Label(text="1. Washing water with hot water kills more bacteria than washing with cold.", font=("arial", 10), bg = "white")
        question.place(x=85, y=100)
        truebutton = tk.Button(text="True")
        truebutton.place(x=60, y=300)
        truebutton.config(height=5, width = 32)
        falsebutton = tk.Button(text="False")
        falsebutton.place(x=315, y=300)
        falsebutton.config(height=5, width = 32)

class PageThree(tk.Frame):

    def __init__(self, parent, controller):
        tk.Frame.__init__(self, parent)
        self.controller = controller

class PageFour(tk.Frame):

    def __init__(self, parent, controller):
        tk.Frame.__init__(self, parent)
        self.controller = controller

class PageFive(tk.Frame):

    def __init__(self, parent, controller):
        tk.Frame.__init__(self, parent)
        self.controller = controller


if __name__ == "__main__":
    app = foodtechquiz()
    app.mainloop()

Answer 1

In your PageTwo class, you create widgets without defining their parent. To make sure that your widgets are placed in the right parent, you should specify this parent as the first argument in widget creation. For instance, in PageTwo's __init__() method, write:

truebutton = tk.Button(self, text="True")

to make truebutton a child of self (which within that method represents the PageTwo instance).

Introduction to Tkinter