I'm implementing a GUI with Tkinter following this topic: Switch between two frames in tkinter
Trying to adapting it to my problem:
This is the controller:
class App(tk.Tk):
def __init__(self, *args, **kwargs):
tk.Tk.__init__(self, *args, **kwargs)
self.title('VOICED/UNVOICED SPEECH DETECTION')
self.resizable(RESIZABLE, RESIZABLE)
self.geometry(str(WIDTH_WINDOW) + 'x' + str(HEIGHT_WINDOW))
self.configure(bg=BACK_GROUND_COLOR)
self.title_font = tkfont.Font(family='Helvetica', size=18, weight="bold", slant="italic")
# the container is where we'll stack a bunch of frames
# on top of each other, then the one we want visible
# will be raised above the others
container = tk.Frame(self)
container.pack(side="top", fill="both", expand=True)
container.grid_rowconfigure(0, weight=1)
container.grid_columnconfigure(0, weight=1)
self.frames = {}
for F in (HomePage, MenuPage, GraphicPage):
page_name = F.__name__
frame = F(parent=container, controller=self)
self.frames[page_name] = frame
# put all of the pages in the same location;
# the one on the top of the stacking order
# will be the one that is visible.
frame.grid(row=0, column=0, sticky="nsew")
self.show_frame("HomePage")
def show_frame(self, page_name):
'''Show a frame for the given page name'''
frame = self.frames[page_name]
frame.tkraise()
This is the home page that shows the lateral bar:
And the corresponding code:
class HomePage(tk.Frame):
def __init__(self, parent, controller):
tk.Frame.__init__(self, parent)
self.controller = controller
self.bg = BACK_GROUND_COLOR
label = tk.Label(self, text="This is the start page", font=controller.title_font)
label.pack(side="top", fill="x", pady=10)
# -----------ROOT WINDOWS-------------
self.configure(bg=BACK_GROUND_COLOR)
self.position = 0
# ----------Menu Bar-------------------------
self.menu_frame = tk.Frame(master=self, height=HEIGHT_WINDOW, width=50,
borderwidth=5, relief='groove', highlightbackground="black",
highlightcolor="black", highlightthickness=1, bg=BACK_GROUND_COLOR).place(x=0, y=0)
# Menu Button
self.menu_img = tk.PhotoImage(file='frontend/Widget/icons/menu.png')
self.menu_button = tk.Button(master=self.menu_frame, image=self.menu_img,
height=25, width=25,
command=lambda: controller.show_frame("MenuPage"),
bg=BACK_GROUND_COLOR).place(x=10, y=10)
# Back Button
self.back_img = tk.PhotoImage(file='frontend/Widget/icons/back.png')
self.back_button = tk.Button(master=self.menu_frame, image=self.back_img, height=25, width=25,
bg=BACK_GROUND_COLOR).place(x=10, y=46)
# Home Button
self.home_img = tk.PhotoImage(file='frontend/Widget/icons/home.png')
self.home_button = tk.Button(master=self.menu_frame, image=self.home_img, height=25, width=25,
bg=BACK_GROUND_COLOR).place(x=10, y=82)
When I click the menu button (the first in the lateral bar), I obtain the menu option (That I called MenuPage):
And the corresponding code:
class MenuPage(tk.Frame):
def __init__(self, parent, controller):
tk.Frame.__init__(self, parent)
self.controller = controller
self.bg = BACK_GROUND_COLOR
# --------------------------------------------------toolbar--------------------------------------
self.toolbar_frame = tk.Frame(master=self, height=70, width=WIDTH_WINDOW - 54,
borderwidth=5, relief='groove', highlightbackground="black",
highlightcolor="black",
highlightthickness=1, bg=BACK_GROUND_COLOR).place(x=51, y=0)
self.button_graphics_img = tk.PhotoImage(file='frontend/Widget/icons/graphic.png')
self.button_graphic = tk.Button(master=self, text='Test/Train',
image=self.button_graphics_img, height=25, width=25, bg=BACK_GROUND_COLOR,
command=lambda: controller.show_frame("GraphicPage")).place(x=75, y=5)
self.label_graphic = tk.Label(master=self, text='Plot Parameters',
height=0, width=12, bg=BACK_GROUND_COLOR).place(x=55, y=40)
As you can notice, when I click on the menu button the lateral frame disappears. This is because in the MenuPage there aren't the methods of the lateral bar, but trying to put it also in the MenuPage, the buttons (back arrow, home) don't work. So I don't get how to hold fixed the lateral bar for all my pages and make sure that the buttons do their job.
Any suggestions will be appreciated.
Thanks in advance
UPDATE:
By placing the sidebar in the Main Windows, I solved the fact that the sidebar disappeared when I opened the menu.
The other problem is:
How can I do with the back arrow to come back to the previous Frame? For Instance, if I open another page with a button in the MenuPage, and then I'd want to come back to from that page to the MenuPage, how should I do?
I've already tried to re-place the buttons in the page opened from menu changing the command to open the previous page (putting lambda: controller.show_frame("MenuPage")
) but doesn't works.