Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Solution: Python3 Tkinter Jump from one window to another with back and next buttons

I've been studying tkinter in python3 and find it very hard to find good documentation and answers online. To help others struggling with the same problems I decided to post a solution for a simple problem that there seems to be no documentation for online.

Problem: Create a wizard-like program, that presents the user with a series of windows and the user can move between the windows clicking next and back - buttons.

The solution is:

  • Create one root window.
  • Create as many frames as you have windows to present to the user. Attach all frames to the root window.
  • Populate each frame with all the widgets it needs.
  • When all the frames have been populated, hide each frame with the grid_forget() method but leave the first frame unhidden so that it becomes the visible one. All the child widgets on the frame will be hidden with the frame.
  • When the user clicks on Next or Back buttons on a window, call a subroutine that hides other frames (with grid_forget()) and makes the one that is needed visible (with grid()).
  • When you want the program to end, use the destroy - method for the root window.

So you will be creating a single window and showing different frames on it.

(By the way, the best place to start studying tkinter is: http://www.tkdocs.com/tutorial/index.html)

Here is a sample implementation in Python3. It has 3 simple windows, each with a text label and two buttons to navigate through different windows.

#!/usr/bin/env python3
# -*- coding: utf-8 -*-
#

# Creates three "windows" that the user can navigate through using Back and Next - buttons.

import tkinter
import tkinter.ttk

def create_widgets_in_first_frame():
    # Create the label for the frame
    first_window_label = tkinter.ttk.Label(first_frame, text='Window 1')
    first_window_label.grid(column=0, row=0, pady=10, padx=10, sticky=(tkinter.N))

    # Create the button for the frame
    first_window_quit_button = tkinter.Button(first_frame, text = "Quit", command = quit_program)
    first_window_quit_button.grid(column=0, row=1, pady=10, sticky=(tkinter.N))
    first_window_next_button = tkinter.Button(first_frame, text = "Next", command = call_second_frame_on_top)
    first_window_next_button.grid(column=1, row=1, pady=10, sticky=(tkinter.N))

def create_widgets_in_second_frame():
    # Create the label for the frame
    second_window_label = tkinter.ttk.Label(second_frame, text='Window 2')
    second_window_label.grid(column=0, row=0, pady=10, padx=10, sticky=(tkinter.N))

    # Create the button for the frame
    second_window_back_button = tkinter.Button(second_frame, text = "Back", command = call_first_frame_on_top)
    second_window_back_button.grid(column=0, row=1, pady=10, sticky=(tkinter.N))
    second_window_next_button = tkinter.Button(second_frame, text = "Next", command = call_third_frame_on_top)
    second_window_next_button.grid(column=1, row=1, pady=10, sticky=(tkinter.N))

def create_widgets_in_third_frame():
    # Create the label for the frame
    third_window_label = tkinter.ttk.Label(third_frame, text='Window 3')
    third_window_label.grid(column=0, row=0, pady=10, padx=10, sticky=(tkinter.N))

    # Create the button for the frame
    third_window_back_button = tkinter.Button(third_frame, text = "Back", command = call_second_frame_on_top)
    third_window_back_button.grid(column=0, row=1, pady=10, sticky=(tkinter.N))
    third_window_quit_button = tkinter.Button(third_frame, text = "Quit", command = quit_program)
    third_window_quit_button.grid(column=1, row=1, pady=10, sticky=(tkinter.N))

def call_first_frame_on_top():
    # This function can be called only from the second window.
    # Hide the second window and show the first window.
    second_frame.grid_forget()
    first_frame.grid(column=0, row=0, padx=20, pady=5, sticky=(tkinter.W, tkinter.N, tkinter.E))

def call_second_frame_on_top():
    # This function can be called from the first and third windows.
    # Hide the first and third windows and show the second window.
    first_frame.grid_forget()
    third_frame.grid_forget()
    second_frame.grid(column=0, row=0, padx=20, pady=5, sticky=(tkinter.W, tkinter.N, tkinter.E))

def call_third_frame_on_top():
    # This function can only be called from the second window.
    # Hide the second window and show the third window.
    second_frame.grid_forget()
    third_frame.grid(column=0, row=0, padx=20, pady=5, sticky=(tkinter.W, tkinter.N, tkinter.E))

def quit_program():
    root_window.destroy()

###############################
# Main program starts here :) #
###############################

# Create the root GUI window.
root_window = tkinter.Tk()

# Define window size
window_width = 200
window_heigth = 100

# Create frames inside the root window to hold other GUI elements. All frames must be created in the main program, otherwise they are not accessible in functions. 
first_frame=tkinter.ttk.Frame(root_window, width=window_width, height=window_heigth)
first_frame['borderwidth'] = 2
first_frame['relief'] = 'sunken'
first_frame.grid(column=0, row=0, padx=20, pady=5, sticky=(tkinter.W, tkinter.N, tkinter.E))

second_frame=tkinter.ttk.Frame(root_window, width=window_width, height=window_heigth)
second_frame['borderwidth'] = 2
second_frame['relief'] = 'sunken'
second_frame.grid(column=0, row=0, padx=20, pady=5, sticky=(tkinter.W, tkinter.N, tkinter.E))

third_frame=tkinter.ttk.Frame(root_window, width=window_width, height=window_heigth)
third_frame['borderwidth'] = 2
third_frame['relief'] = 'sunken'
third_frame.grid(column=0, row=0, padx=20, pady=5, sticky=(tkinter.W, tkinter.N, tkinter.E))

# Create all widgets to all frames
create_widgets_in_third_frame()
create_widgets_in_second_frame()
create_widgets_in_first_frame()

# Hide all frames in reverse order, but leave first frame visible (unhidden).
third_frame.grid_forget()
second_frame.grid_forget()

# Start tkinter event - loop
root_window.mainloop()
like image 940
Mikael Hartzell Avatar asked Nov 25 '22 21:11

Mikael Hartzell


1 Answers

As you've taken the liberty to post an answer as a question. I'd like to post a comment as an answer and suggest that perhaps you should contribute this to TkDocs (click their About tab and they talk about contributing to the site).

I think it'd be better if that site were to improved with more examples than to turn this site into a cookbook. I think you can also contribute to the Active State recipes, and they seem to be the carriers of the torch for Tcl/Tk, so Tkinter stuff makes a lot of sense there too.

like image 186
John Gaines Jr. Avatar answered Dec 06 '22 18:12

John Gaines Jr.