{"id":1785,"date":"2020-12-23T03:42:52","date_gmt":"2020-12-23T03:42:52","guid":{"rendered":"https:\/\/www.pythontutorial.net\/?page_id=1785"},"modified":"2020-12-24T03:42:42","modified_gmt":"2020-12-24T03:42:42","slug":"tkinter-toplevel","status":"publish","type":"page","link":"https:\/\/www.pythontutorial.net\/tkinter\/tkinter-toplevel\/","title":{"rendered":"Tkinter Toplevel"},"content":{"rendered":"\n

Summary<\/strong>: in this tutorial, you’ll learn how to create multiple windows in a Tkinter application using the Tkinter Toplevel class.<\/p>\n\n\n\n

Introduction to Tkinter Toplevel window #<\/a><\/h2>\n\n\n\n

In a Tkinter application, the instance of the Tk<\/code> class represents the main window<\/a>.<\/p>\n\n\n\n

When you destroy the main window, the application exits, and the event loop finishes.<\/p>\n\n\n\n

Sometimes, you need to create additional windows. For example, you may want to create a custom dialog or a wizard form.<\/p>\n\n\n\n

To do that, you can use top-level windows which are instances of the Toplevel<\/code> class.<\/p>\n\n\n\n

Unlike the main window, you can create as many top-level windows as you want.<\/p>\n\n\n\n

To show a Toplevel<\/code> window from the main window, you follow these steps:<\/p>\n\n\n\n

First, create an instance of the Toplevel<\/code> class and set its parent to the root window:<\/p>\n\n\n

window = tk.Toplevel(root)<\/code><\/span>Code language:<\/span> Python<\/span> (<\/span>python<\/span>)<\/span><\/small><\/pre>\n\n\n
The moment you create the Toplevel<\/code> window, it’ll display on the screen.<\/p>\n\n\n\n
Third, call the grab_set()<\/code> method of the Toplevel<\/code> window instance to allow it to receive events and prevent users from interacting with the main window:<\/p>\n\n\n
window.grab_set()<\/code><\/span>Code language:<\/span> Python<\/span> (<\/span>python<\/span>)<\/span><\/small><\/pre>\n\n\n
A simple Tkinter Toplevel Window example #<\/a><\/h2>\n\n\n\n
The following program displays a window that has one button<\/a>:<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
When you click the button, it’ll open a Toplevel<\/code> window. The Toplevel<\/code> window also consists of a button.<\/p>\n\n\n\n
If you click or press the Close<\/code> button, the Toplevel<\/code> window closes.<\/p>\n\n\n
import<\/span> tkinter as<\/span> tk\nfrom<\/span> tkinter import<\/span> ttk\n\n\nclass<\/span> Window<\/span>(tk.Toplevel)<\/span>:<\/span>\n    def<\/span> __init__<\/span>(self, parent)<\/span>:<\/span>\n        super().__init__(parent)\n\n        self.geometry('300x100'<\/span>)\n        self.title('Toplevel Window'<\/span>)\n\n        ttk.Button(self,\n                text='Close'<\/span>,\n                command=self.destroy).pack(expand=True<\/span>)\n\n\nclass<\/span> App<\/span>(tk.Tk)<\/span>:<\/span>\n    def<\/span> __init__<\/span>(self)<\/span>:<\/span>\n        super().__init__()\n\n        self.geometry('300x200'<\/span>)\n        self.title('Main Window'<\/span>)\n\n        # place a button on the root window<\/span>\n        ttk.Button(self,\n                text='Open a window'<\/span>,\n                command=self.open_window).pack(expand=True<\/span>)\n\n    def<\/span> open_window<\/span>(self)<\/span>:<\/span>\n        window = Window(self)\n        window.grab_set()\n\n\nif<\/span> __name__ == \"__main__\"<\/span>:\n    app = App()\n    app.mainloop()<\/code><\/span>Code language:<\/span> Python<\/span> (<\/span>python<\/span>)<\/span><\/small><\/pre>\n\n\n
How it works.<\/p>\n\n\n\n
Second, assign the command<\/a> of the Open a window<\/strong> button to the open_window()<\/code> method in the App<\/code> class<\/p>\n\n\n\n
Third, in the open_window()<\/code> method, create a new instance of the Window<\/code> and call the grab_set()<\/code> method so that it can receive events. The grab_set()<\/code> method also prevents users from interacting with the main window.<\/p>\n\n\n\n
Summary #<\/a><\/h2>\n\n\n\n
  • Show additional windows by creating instances of the Toplevel<\/code> class.<\/li>
  • Use grab_set()<\/code> method so that the Toplevel<\/code> window can receive events and prevents users from interacting with the main window.<\/li><\/ul>\n
    \n\t
    \n\t\t
    Was this tutorial helpful ?<\/div>\n\t\t
    \n\t\t\t\n\t\t\t\t\n\t\t\t\t\t<\/path>\n\t\t\t\t<\/svg>\n\t\t\t\t Yes <\/span>\n\t\t\t<\/button>\n\n\t\t\t\n\t\t\t\t\n\t\t\t\t\t<\/path>\n\t\t\t\t<\/svg>\n\t\t\t\t No <\/span>\n\t\t\t<\/button>\n\t\t<\/div>\n\t<\/header>\n\n\t
    \n\t\t
    \n\t\t\t
    <\/div>\n\t\t\t
First, define a class<\/a> Window<\/code> that inherits<\/a> from the Toplevel<\/code> window. The Window<\/code> will be closed once the Close<\/code> button is clicked.<\/p>\n\n\n\n
Second, add widgets to the Toplevel<\/code> window like you do with the frames<\/a> and main window<\/a>.<\/p>\n\n\n\n