Switching between Tkinter Frames with tkraise()

In this Tkinter tutorial we will explore how to switch between multiple Frames using the tkraise() method. This is a special method available to the Frame widget, which can be used to “raise” a frame over another. Lets take a look at how we can use this.


How to switch between Tkinter Frames?

First we need to create a few Frames between which we will be switching. We will create two new Classes, FirstWindow and SecondWindow which inherit from tk.Frame (which gives them the functionality of a Frame).

You can always create Frames using the normal way, but this is much better for managing separate windows, especially when you have alot of widgets.

class FirstWindow(tk.Frame):
    def __init__(self, parent):
        super().__init__(parent)
        tk.Label(self, text = "This is Window 1").pack(padx = 10, pady = 10)
        self.pack(padx = 10, pady = 10)

class SecondWindow(tk.Frame):
    def __init__(self, parent):
        super().__init__(parent)
        tk.Label(self, text = "This is Window 2").pack(padx = 10, pady = 10)
        self.pack(padx = 10, pady = 10)

Both Frames just have a single Label inside them, which lets us know which Frame we are currently looking at.

Now lets create our Main Window. This window will have a “frame list”, which contains a list of the Frames between which we will be switching. We have added the objects for FirstWindow and SecondWindow to this list.

class MainWindow():
    def __init__(self, master):
        mainframe = tk.Frame(master)
        mainframe.pack(padx=10, pady=10, fill='both', expand=1)
        self.windowNum = 0

        self.framelist = []
        self.framelist.append(FirstWindow(mainframe))
        self.framelist.append(SecondWindow(mainframe))
        self.framelist[1].forget()

We will also call the forget() method on the SecondWindow. This will make the SecondWindow disappear, because we only want one shown at a time. So at initialization, our Window will only show the FirstWindow.

We also have a variable called windowNum which tracks the currently displayed window. This will be necessary for when we swap between windows.

Next we need to define a function to help us switch between Windows. The switchWindows() function here will perform 4 operations in total whenever it is called.

    def switchWindows(self):
        self.framelist[self.windowNum].forget()
        self.windowNum = (self.windowNum + 1) % len(self.framelist)
        self.framelist[self.windowNum].tkraise()
        self.framelist[self.windowNum].pack(padx = 10, pady = 10)

First it will forget the current window. Second, it will update the value of windowNum with the index of the next frame. Third, using the new value of windowNum, it will raise a new Frame using tkraise(). This will pull it to the top of drawing order (above all other frames). Last, we need to pack() this new Frame (otherwise it won’t show).

We need to actually call this function somewhere though. This can be done in the Main Window. We will create a new frame, which exists below the mainframe, called the bottom frame. We will create a button in this frame, which triggers this function.

class MainWindow():
    def __init__(self, master):
        mainframe = tk.Frame(master)
        mainframe.pack(padx=10, pady=10, fill='both', expand=1)
        self.windowNum = 0

        self.framelist = []
        self.framelist.append(FirstWindow(mainframe))
        self.framelist.append(SecondWindow(mainframe))
        self.framelist[1].forget()

        bottomframe = tk.Frame(master)
        bottomframe.pack(padx=10, pady=10)

        switch = tk.Button(bottomframe, text = "Switch", command=self.switchWindows)
        switch.pack(padx=10, pady=10)

You can also choose to have this function executed inside one of the two Frames. Just pass in the function name (switchWindows) as an argument to any of them, and have it called when a button in that frame is clicked.


If you are interested in creating an actual “separate window”, (a second window), then check out the Tkinter TopLevel widget, which can be used to make additional windows. (Do not try to create additional windows using Tk())


The Complete Code

Here is the complete code, along with the output.

import tkinter as tk

class FirstWindow(tk.Frame):
    def __init__(self, parent):
        super().__init__(parent)
        tk.Label(self, text = "This is Window 1").pack(padx = 10, pady = 10)
        self.pack(padx = 10, pady = 10)

class SecondWindow(tk.Frame):
    def __init__(self, parent):
        super().__init__(parent)
        tk.Label(self, text = "This is Window 2").pack(padx = 10, pady = 10)
        self.pack(padx = 10, pady = 10)

class MainWindow():
    def __init__(self, master):
        mainframe = tk.Frame(master)
        mainframe.pack(padx=10, pady=10, fill='both', expand=1)
        self.windowNum = 0

        self.framelist = []
        self.framelist.append(FirstWindow(mainframe))
        self.framelist.append(SecondWindow(mainframe))
        self.framelist[1].forget()

        bottomframe = tk.Frame(master)
        bottomframe.pack(padx=10, pady=10)

        switch = tk.Button(bottomframe, text = "Switch", command=self.switchWindows)
        switch.pack(padx=10, pady=10)
    
    def switchWindows(self):
        self.framelist[self.windowNum].forget()
        self.windowNum = (self.windowNum + 1) % len(self.framelist)
        self.framelist[self.windowNum].tkraise()
        self.framelist[self.windowNum].pack(padx = 10, pady = 10)

root = tk.Tk()
window = MainWindow(root)
root.mainloop()

This marks the end of the How to Switch between Tkinter Frames with tkraise? Tutorial. Any suggestions or contributions for CodersLegacy are more than welcome. Questions regarding the Tutorial content can be asked in the comments section below.

Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments