{"id":1493,"date":"2020-12-04T07:29:21","date_gmt":"2020-12-04T07:29:21","guid":{"rendered":"https:\/\/www.pythontutorial.net\/?page_id=1493"},"modified":"2025-04-03T04:28:39","modified_gmt":"2025-04-03T04:28:39","slug":"tkinter-object-oriented-window","status":"publish","type":"page","link":"https:\/\/www.pythontutorial.net\/tkinter\/tkinter-object-oriented-window\/","title":{"rendered":"Tkinter Object-Oriented Window"},"content":{"rendered":"\n<p><strong>Summary<\/strong>: in this tutorial, you&#8217;ll learn how to apply <a href=\"https:\/\/www.pythontutorial.net\/python-oop\/\" target=\"_blank\" rel=\"noreferrer noopener\">object-oriented programming<\/a> in Tkinter to make the code more organized.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id='defining-a-tkinter-object-oriented-window'>Defining a Tkinter object-oriented window <a href=\"#defining-a-tkinter-object-oriented-window\" class=\"anchor\" id=\"defining-a-tkinter-object-oriented-window\" title=\"Anchor for Defining a Tkinter object-oriented window\">#<\/a><\/h2>\n\n\n\n<p>The following simple program creates a root <a href=\"https:\/\/www.pythontutorial.net\/tkinter\/tkinter-window\/\">window<\/a> and displays it on the screen:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-1\" data-shcb-language-name=\"Python\" data-shcb-language-slug=\"python\"><span><code class=\"hljs language-python\"><span class=\"hljs-keyword\">import<\/span> tkinter <span class=\"hljs-keyword\">as<\/span> tk\n\n\nroot = tk.Tk()\nroot.mainloop()<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-1\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Python<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">python<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>When the program is getting more complex, you can use an <a href=\"https:\/\/www.pythontutorial.net\/python-oop\/\">object-oriented programming <\/a>approach to make the code more organized.<\/p>\n\n\n\n<p>The following program achieves the same result as the program above, but use a <code><a href=\"https:\/\/www.pythontutorial.net\/python-oop\/python-class\/\">class<\/a><\/code> instead:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-2\" data-shcb-language-name=\"Python\" data-shcb-language-slug=\"python\"><span><code class=\"hljs language-python\"><span class=\"hljs-keyword\">import<\/span> tkinter <span class=\"hljs-keyword\">as<\/span> tk\n\n\n<span class=\"hljs-class\"><span class=\"hljs-keyword\">class<\/span> <span class=\"hljs-title\">App<\/span><span class=\"hljs-params\">(tk.Tk)<\/span>:<\/span>\n    <span class=\"hljs-function\"><span class=\"hljs-keyword\">def<\/span> <span class=\"hljs-title\">__init__<\/span><span class=\"hljs-params\">(self)<\/span>:<\/span>\n        super().__init__()\n\n\n<span class=\"hljs-keyword\">if<\/span> __name__ == <span class=\"hljs-string\">\"__main__\"<\/span>:\n    app = App()\n    app.mainloop()<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-2\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Python<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">python<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>How it works.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>First, define an <code>App<\/code> class that inherits from the <code>tk.Tk<\/code> class. Inside the <code>__init__()<\/code> method, call the <code>__init__()<\/code> method of the <code>tk.Tk<\/code> class.<\/li>\n\n\n\n<li>Second, create a new instance of the <code>App<\/code> class and call the <code>mainloop()<\/code> method to display the root window.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id='another-example-of-an-object-oriented-window-in-tkinter'>Another example of an object-oriented window in Tkinter <a href=\"#another-example-of-an-object-oriented-window-in-tkinter\" class=\"anchor\" id=\"another-example-of-an-object-oriented-window-in-tkinter\" title=\"Anchor for Another example of an object-oriented window in Tkinter\">#<\/a><\/h2>\n\n\n\n<p>The following class represents a <a href=\"https:\/\/www.pythontutorial.net\/tkinter\/tkinter-window\/\">window<\/a> that consists of a <a href=\"https:\/\/www.pythontutorial.net\/tkinter\/tkinter-label\/\">label<\/a> and a <a href=\"https:\/\/www.pythontutorial.net\/tkinter\/tkinter-button\/\">button<\/a>. When you click the button, the program displays a <a href=\"https:\/\/www.pythontutorial.net\/tkinter\/tkinter-messagebox\/\">message box<\/a>:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-3\" data-shcb-language-name=\"Python\" data-shcb-language-slug=\"python\"><span><code class=\"hljs language-python\"><span class=\"hljs-keyword\">import<\/span> tkinter <span class=\"hljs-keyword\">as<\/span> tk\n<span class=\"hljs-keyword\">from<\/span> tkinter <span class=\"hljs-keyword\">import<\/span> ttk\n<span class=\"hljs-keyword\">from<\/span> tkinter.messagebox <span class=\"hljs-keyword\">import<\/span> showinfo\n\n\n<span class=\"hljs-class\"><span class=\"hljs-keyword\">class<\/span> <span class=\"hljs-title\">App<\/span><span class=\"hljs-params\">(tk.Tk)<\/span>:<\/span>\n  <span class=\"hljs-function\"><span class=\"hljs-keyword\">def<\/span> <span class=\"hljs-title\">__init__<\/span><span class=\"hljs-params\">(self)<\/span>:<\/span>\n    super().__init__()\n\n    <span class=\"hljs-comment\"># configure the root window<\/span>\n    self.title(<span class=\"hljs-string\">'My Awesome App'<\/span>)\n    self.geometry(<span class=\"hljs-string\">'300x50'<\/span>)\n\n    <span class=\"hljs-comment\"># label<\/span>\n    self.label = ttk.Label(self, text=<span class=\"hljs-string\">'Hello, Tkinter!'<\/span>)\n    self.label.pack()\n\n    <span class=\"hljs-comment\"># button<\/span>\n    self.button = ttk.Button(self, text=<span class=\"hljs-string\">'Click Me'<\/span>)\n    self.button&#91;<span class=\"hljs-string\">'command'<\/span>] = self.button_clicked\n    self.button.pack()\n\n  <span class=\"hljs-function\"><span class=\"hljs-keyword\">def<\/span> <span class=\"hljs-title\">button_clicked<\/span><span class=\"hljs-params\">(self)<\/span>:<\/span>\n    showinfo(title=<span class=\"hljs-string\">'Information'<\/span>, message=<span class=\"hljs-string\">'Hello, Tkinter!'<\/span>)\n\n<span class=\"hljs-keyword\">if<\/span> __name__ == <span class=\"hljs-string\">\"__main__\"<\/span>:\n  app = App()\n  app.mainloop()<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-3\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Python<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">python<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>How it works.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>First, create a label and button in the <code>__init__()<\/code> method of App class.<\/li>\n\n\n\n<li>Second, assign the <code>button_clicked()<\/code> method to the command option of the button. Inside the <code>button_clicked()<\/code> method, display a message box.<\/li>\n\n\n\n<li>Third, move the application bootstrapping to the <code>if __name__ = \"main\"<\/code> block.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id='summary'>Summary <a href=\"#summary\" class=\"anchor\" id=\"summary\" title=\"Anchor for Summary\">#<\/a><\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Use an object-oriented programming approach to make the code more organized.<\/li>\n\n\n\n<li>Define a class that inherits from the <code>tk.Tk<\/code> class. Always, call the <code>super().__init__()<\/code> from the parent class in the child class.<\/li>\n<\/ul>\n<div class=\"helpful-block-content\" data-title=\"\">\n\t<header>\n\t\t<div class=\"wth-question\">Was this tutorial helpful ?<\/div>\n\t\t<div class=\"wth-thumbs\">\n\t\t\t<button\n\t\t\t\tdata-post=\"1493\"\n\t\t\t\tdata-post-url=\"https:\/\/www.pythontutorial.net\/tkinter\/tkinter-object-oriented-window\/\"\n\t\t\t\tdata-post-title=\"Tkinter Object-Oriented Window\"\n\t\t\t\tdata-response=\"1\"\n\t\t\t\tclass=\"wth-btn-rounded wth-yes-btn\"\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tfill=\"none\"\n\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t\tclass=\"feather feather-thumbs-up block w-full h-full\"\n\t\t\t\t>\n\t\t\t\t\t<path\n\t\t\t\t\t\td=\"M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3\"\n\t\t\t\t\t><\/path>\n\t\t\t\t<\/svg>\n\t\t\t\t<span class=\"sr-only\"> Yes <\/span>\n\t\t\t<\/button>\n\n\t\t\t<button\n\t\t\t\tdata-response=\"0\"\n\t\t\t\tdata-post=\"1493\"\n\t\t\t\tdata-post-url=\"https:\/\/www.pythontutorial.net\/tkinter\/tkinter-object-oriented-window\/\"\n\t\t\t\tdata-post-title=\"Tkinter Object-Oriented Window\"\n\t\t\t\tclass=\"wth-btn-rounded wth-no-btn\"\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\txmlns=\"http:\/\/www.w3.org\/2000\/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tfill=\"none\"\n\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\tstroke-width=\"2\"\n\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\tstroke-linejoin=\"round\"\n\t\t\t\t>\n\t\t\t\t\t<path\n\t\t\t\t\t\td=\"M10 15v4a3 3 0 0 0 3 3l4-9V2H5.72a2 2 0 0 0-2 1.7l-1.38 9a2 2 0 0 0 2 2.3zm7-13h2.67A2.31 2.31 0 0 1 22 4v7a2.31 2.31 0 0 1-2.33 2H17\"\n\t\t\t\t\t><\/path>\n\t\t\t\t<\/svg>\n\t\t\t\t<span class=\"sr-only\"> No <\/span>\n\t\t\t<\/button>\n\t\t<\/div>\n\t<\/header>\n\n\t<div class=\"wth-form hidden\">\n\t\t<div class=\"wth-form-wrapper\">\n\t\t\t<div class=\"wth-title\"><\/div>\n\t\t\t<textarea class=\"wth-message\"><\/textarea>\n\t\t\t<input type=\"button\" name=\"wth-submit\" class=\"wth-btn wth-btn-submit\" id=\"wth-submit\" \/>\n\t\t\t<input type=\"button\" class=\"wth-btn wth-btn-cancel\" value=\"Cancel\" \/>\n\t\t<\/div>\n\t<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>In this tutorial, you&#8217;ll learn how to apply object-oriented programming in Tkinter.<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":1232,"menu_order":41,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1493","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/pages\/1493","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/comments?post=1493"}],"version-history":[{"count":1,"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/pages\/1493\/revisions"}],"predecessor-version":[{"id":7396,"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/pages\/1493\/revisions\/7396"}],"up":[{"embeddable":true,"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/pages\/1232"}],"wp:attachment":[{"href":"https:\/\/www.pythontutorial.net\/wp-json\/wp\/v2\/media?parent=1493"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}