Call Tkinter GUI Frame Class on Different Files

Question

I'm trying to build a frontend for an app.

I have main.py with my tkinter window class.

Now, using frames, I added a top, left, and middle frame.

• Top - Banner
• Left - Navbar
• Middle - working area

The middle frame shows different frames, depending on which button is clicked on the navbar. I want to move those frames to their own file, as they will become quite long, considering all the info they have to show.

Currently, my main.py looks like this:

import tkinter as tk


class App:

    def __init__(self, root):
        self.root = root
        self.top()
        self.left()
        self.middle()
        self.pageOne()

    def top(self):
        self.top_panel = tk.Frame(self.root)
        self.top_panel.pack()

        self.logo = tk.Label(self.top_panel, text="LOGO GOES HERE", fg="Blue", width=40)
        self.logo.pack(fill=tk.BOTH, expand=1)

    def left(self):
        self.left_frame = tk.Frame(self.root)
        self.left_frame.pack(side="left", fill=tk.BOTH, expand=0)

        self.page_one = tk.Button(self.left_frame, text="Page 1", command=self.pageOne)
        self.page_one.pack(fill=tk.BOTH)
        self.page_two = tk.Button(self.left_frame, text="Page 2", command=self.pageTwo)
        self.page_two.pack(fill=tk.BOTH)
        self.page_three = tk.Button(self.left_frame, text="Page 3", command=self.pageThree)
        self.page_three.pack(fill=tk.BOTH)


    # Middle frame, working area
    def middle(self):
        self.right_frame = tk.Frame(self.root, bg="red", width=60)
        self.right_frame.pack(side="left", fill=tk.BOTH, expand=1)

    # Frames to open on middle frame
    def pageOne(self):
        self.page_one_frame = tk.Frame(self.right_frame, bg="yellow")
        try:
            self.page_two_frame.destroy() or self.page_three_frame.destroy()
        except AttributeError:
            self.page_one_frame.pack(fill=tk.BOTH, expand=1)
        else:
            self.page_one_frame.pack(fill=tk.BOTH, expand=1)

        # pageOne Contents
        self.label = tk.Label(self.page_one_frame, text="This is page one")
        self.label.pack()

    def pageTwo(self):
        self.page_two_frame = tk.Frame(self.right_frame, bg="blue")
        try:
            self.page_one_frame.destroy() or self.page_three_frame.destroy()
        except AttributeError:
            self.page_two_frame.pack(fill=tk.BOTH, expand=1)
        else:
            self.page_two_frame.pack(fill=tk.BOTH, expand=1)

        # pageTwo contents Contents
        self.label = tk.Label(self.page_two_frame, text="This is page two")
        self.label.pack()

    def pageThree(self):
        self.page_three_frame = tk.Frame(self.right_frame, bg="green")
        try:
            self.page_one_frame.destroy() or self.page_two_frame.destroy()
        except AttributeError:
            self.page_three_frame.pack(fill=tk.BOTH, expand=1)
        else:
            self.page_three_frame.pack(fill=tk.BOTH, expand=1)

        # pageThree contents Contents
        self.label = tk.Label(self.page_three_frame, text="This is page three")
        self.label.pack()

root = tk.Tk()
app = App(root)
root.mainloop()

What would be the correct way of "moving" those pageOne, pageTwo, pageThree methods to their own files, and calling them with the button commands?