Screen switching / screen transition with Tkinter

Screen switching with Tkinter

Super simple code introduction. Another article (here) has become long due to OpenCV related code, so I will summarize it briefly. It should work if there is a pillow.

code

main.py

# -*- coding: utf-8 -*-
import tkinter as tk
import PIL.Image, PIL.ImageTk

class App(tk.Tk):
    #incantation
    def __init__(self, *args, **kwargs):
        #incantation
        tk.Tk.__init__(self, *args, **kwargs)

        #Decide the window title
        self.title("Tkinter change page")

        #Determine window size
        self.geometry("800x600")

        #Make the window grid 1x1
        #If you comment out this process, the placement will shift.
        self.grid_rowconfigure(0, weight=1)
        self.grid_columnconfigure(0, weight=1)
#-----------------------------------main_frame-----------------------------
        #Create main page frame
        self.main_frame = tk.Frame()
        self.main_frame.grid(row=0, column=0, sticky="nsew")
        #Title label creation
        self.titleLabel = tk.Label(self.main_frame, text="Main Page", font=('Helvetica', '35'))
        self.titleLabel.pack(anchor='center', expand=True)
        #Button to move to frame 1
        self.changePageButton = tk.Button(self.main_frame, text="Go to frame1", command=lambda : self.changePage(self.frame1))
        self.changePageButton.pack()
#--------------------------------------------------------------------------
#-----------------------------------frame1---------------------------------
        #Create destination frame
        self.frame1 = tk.Frame()
        self.frame1.grid(row=0, column=0, sticky="nsew")
        #Title label creation
        self.titleLabel = tk.Label(self.frame1, text="Frame 1", font=('Helvetica', '35'))
        self.titleLabel.pack(anchor='center', expand=True)
        #Button to return from frame 1 to main frame
        self.back_button = tk.Button(self.frame1, text="Back", command=lambda : self.changePage(self.main_frame))
        self.back_button.pack()
#--------------------------------------------------------------------------

        #main_Display frame at the top
        self.main_frame.tkraise()

    def changePage(self, page):
        '''
Function for screen transition
        '''
        page.tkraise()

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

Rough commentary

The point is the command tkraise. tkraise brings the specified frame to the foreground. The frames are stacked and the frame on the back is brought each time the button is pressed. The buttons are super simple without any decoration.

Illustrated

Such an image

Detailed explanation

Most of the things are written in the comment out in the code, but for the time being,

First, create a mainframe (main_frame) and a destination frame (frame1). Place two frames at coordinates (0,0) using grid method It can be stacked by using grid. Nothing to say about the title label. The button widget specifies the changePage function in command. The changePage function takes a frame name as an argument. By the way, when specifying a function that takes an argument (self does not count) in the command of the button widget, command = lambda: function Must be.

end

I made the code quite short so it's easy to understand. The shortest I've ever seen. Of course, there is a way to show and hide the page each time without using tkraise, but I think tkraise is the easiest.