Tkinter - Switch Frames
HTML-код
- Опубликовано: 21 июл 2024
- I'll show you how to switch frames in a Tkinter application.
The example will be a Settings window that shows content based on what the user selects in a treeview widget.
Switching frames is a useful technique that you can use in your Tkinter applications.
0:00 Intro
0:37 Demo application
1:15 Start code
1:48 Treeview class
3:42 Settings view class
4:25 Illustration of plan
5:39 Pages dictionary
6:20 Page class
10:35 Grid row/column configure
11:53 Create treeview frame
13:05 Treeview select binding
16:06 Create page frame
17:11 Show page method
19:51 Add page method
24:29 Add pages to dictionary
25:54 Debug code
27:08 First demo
27:22 Apply Ttk styles
28:35 Final demo
29:01 Why use Page class
30:28 Closure
#tkinter #pythongui #python3 #pythonguitutorial 
Наука
Please continue making more videos. Tkinter is such a vague but incredibly powerful library. There need to be way more videos to help people learn it.
You explain things well and the video is clearly outlined.
Your channel is very underrated, keep it up and I bet more views will come.
Thanks for your kind words! I have more videos planned.
YESSS... I have been waiting for this thanks bro
This is the 4th or 5th of your videos that I've watched about Treeview and they all have been SOOOO GOOD. The others were about a page of code, and I could easily understand the whole piece. This one tho... I think I understand each function, but I'm having a hard time understanding how the program works as a whole. I'm and *old* C coder (not C++) and the nuance of OO more than a little boggles my tiny mind. I'll study it more and figure it out more. Please keep up the great work!
Thanks! I'm glad you're enjoying the videos.
Bro. This video was SUPER helpful. Please don't stop making videos!
Thanks!
Nice Work. Really Appreciate for sharing it with us all
I was looking all over the web for something simular. I want to create an object oriebted menu page where the right frame should differ dependable on the setting.
I am sure youve covered my concern. Havent tried it yet but will watch your video again.
Good explanation with your drawings. Its a confusing subject.
However I wouldve understood it more from a onchange run explanantion. I am a visual learner.
However, I can still do this when i recreate the scenario and run the app as the changes are made.
Anyway, hopefully im a step closer to what i want to achieve.
Thanks man. Good video!
or if you created three different versions and working on a fourth of a program and want to combine them into one for an effective testing environment, i just thought that up, anyway, great video, i think i am going to use it to learn how to use classes more effectively in my code
I think the correct alignment would be 'wns' instead of 'ens'
For those who want to start with a visible page, they can start the program by selecting the first item in the treeview:
first_idd = settings.treeview_settings.get_children()[0]
settings.treeview_settings.focus(first_idd)
settings.treeview_settings.selection_set(first_idd)
Yes, you're right. The correct sticky value is actually 'wns'. Thanks for the correction and for the tip about starting with a visible page!
Thank you this helped alot❤🔥....
I'm glad it helped!
Would it be nice to show the pages in a separate tab? Are you able to give an example adding top menu and left the treeview and right are pages with different tab. Thanks for the sample.
The ttk Notebook widget can be used for showing a different frame in each tab.
Fantastic, excellent tutorial!
Would it be possible for LanguagePage to interact with SettingsView ? example: If in the main frame (SettingsView) there was a status bar. And in LanguagePage there was a button. How to send text from lbl_title in LanguagePage to a label in SettingsView status bar? How to do this, interact between separate file classes?
because I can't import SettingsView in the LanguagePage class file. Something like:
from settings_view import SettingsView
Thanks for your comment. To pass data from one object to another, you can pass a reference to a object as a parameter in the __init__ of the class. For example, in SettingsView, you can make it accept the object of 'statusbar' in the __init__ constructor. Then your SettingsView will always have access to that status bar using self.statusbar. I have a video that covers this topic a little bit. I may upload a video in the future to explain this more thoroughly. ruclips.net/video/cMl-xLvdKZM/видео.html
@@jobinpy In the suggested video, the first window sends information to the second window when creating this second window.
But how would the second 2nd frame change the content of the first 1nd frame that is already on the screen?
I do not understand.
When you have free time to make a video on this subject, I think it would be interesting for the channel. How an action performed in the second class (2nd frame) changes the content of an already created first class (1st frame) . The two classes in separate files.
Would it be possible to pass parameter to the classes of the settings pages? I tried like this, but there was an error:
settings.add_page(image_path='language.png', setting_name='Language', page=LanguagePage(param='test'))
You could add a new parameter to add_page() and use that new parameter to send it to LanguagePage or some other page. For example:
settings.add_page(image_path='language.png', setting_name='Language', new_param="Test', page=LanguagePage)
Then inside the add_page method, the dictionary line will look something like this:
self.pages[setting_name] = page(master=self.frame_page, new_param=self.new_param)
Then in the Page class, accept a new parameter (new_param) and use it in the Page class.
def __init__(self, master, new_param, **kw)
I hope that helps.
Thanks.
Thank you for sharing the video. I was testing it and it seems to me that the title label in the AudioPage and LanguagePage is always in the center of the frame. i cannot use pack(side=tk.TOP) to put it to the top. It seems that pack() for the label here is not the same as what you have shown in Pack and Grid video. What have I done wrong? How to make title label at the top of the frame?
I made the code with no errors but it doesn't run at all, can u help?👉🏼👈🏼
How about insert new frame as title frame then pack that label to the frame
to make it perfect, i think the majority of us ask:
1. how to imp[lement a menu/buttons in top of treeviewframe, while each button selected calss/binds differnt treeviewframe?
2. how do i implement a scrolleedframe class i have developed, into the audio page?
please, please help us, becuse unfortunately I'm stucked with it for 2 months already,
if I want use messagebox switch frame, how to do that? for example:if event happen, and then go to nextpage
It would be the same concept as shown in the video. For example, you can use the show_page() method to show a specific page. This part in the video explains it: ruclips.net/video/4hamShRNxgg/видео.html
Would it be possible to add Menubar on the top of the treeview frame?
Do you mean something like a File menu? Not that I know of. Menu bars are typically added to the top of the window. However, you could try using a Menubutton widget. That might give you the result that you're looking for.
hi please help me, im trying to copy your code one by one, and i found a problem in show_page method, the problem is, i cant do .pack on self.pages[setting_name]. how to fix it?? please help me
when i asked chatgpt, it said, it's because i show .grid on self.create_frame_treeview().grid so i cant use .pack on self.pages[setting_name]. Is that true?
in create_frame_treeview
self.treeview_settings.bind("", self.on_treeview_selection_change)
AttributeError: 'SettingView' object has no attribute 'on_treeview_selection_change'
Hi, how can I solve this error?
Hi, you might be missing the letter 'd' at the end of the method name. You have 'on_treeview_selection_change' instead of 'on_treeview_selection_changed' (with a 'd' at the end). Maybe that's where the error is. In the code from the video, I used 'on_treeview_selection_changed'.
wow... totally amazing !! amazing how you listening to your followers .. amazing how you explain so difficult issues so simply to understand.
and how can i switch frame1 from file1.py to frame2 in file2. py white both frame shown as one unit and not separatable? thanks you a lot..
Thanks for your comment. Switching frames from different .py files works the same way as in the video. For example, let's say you have main. py (which shows one active frame to the user), and file1. py (contains frame1) and file2. py (contains frame2). Inside main .py, import both frames like this:
from file1 import frame1
from file2 import frame2
So now in main .py, you'll have access to frame1 (from file1 .py) and frame2 (from file2 .py).
Or maybe I'm not understanding your question. Thanks.
@@jobinpy And in this situation how does file1.py access and modify main.py widgets?
@Mrkalvin Bs I will make a video about modifying widgets from different classes and different files (I'm not sure when, but I'll add it to my list of videos to make). Thanks.
@@jobinpy
I think this video is most hard & important on tkinter. Please consider to add this video an example for multiple pages by seperated file1.py for page1 and file2.py for page2.py, add to page1 ttk.notebook and modify (like bg, fg, text etc.) all widgets by file3.py. anyway, i always follow your videos and can't wait for all your future videos. 🙏🙏🙏
settings.pack(fill=tk.BOTH, expand=True)
say
cannot use geometry manager pack inside . which already has slaves managed by grid
That error means that pack() and grid() can't be used together in the same parent.
Try stepping through your code line by line to find the issue. The example code in the video should work fine.
I waited long time for this kind of video.. can we download this code from your github ?
I'm glad it was helpful, I don't currently have the code on github. Thanks for watching!
@@jobinpy I actually finally succeeded to do it it's incredible, but my image_path hide setting_name- how can i fix it?
@@bentsionben-david2769 Hi, I would need to see a screenshot to get a better idea of what the issue is, but it sounds like you may just need to increase the width of the image column? Maybe try that and see if it helps.
@@jobinpy
YOU ARE GENIOUS!!!!!
i never believed in myself that i will ever succeed with it!!
thank you !! thank you !!
i fixed the "add_Page":
img = img.resize((20,20), Image.ANTIALIAS)
@@jobinpy
Your videos creates huge ideas, such as:
1. in class AudioPage(Page):
how to insert notebook?
how to insert scrollbar + frame that moves up/down by mouse?
2. in style for treeview:
how to align text in columns in treeview?
how to change size/bold in font in each rows in treeview?
how to change border and relief in each rows in treeview?
thanks :))
Source code ?
any git hub repo
Hi Affan Ahmed, I don't have the code on GitHub. Thanks for watching my videos.
holy shit my man, this is a really not beginner-friendly tutorial.... so many explanations you are skiping. Goddam,
Thank u for this hardwork,i did what u did and i got no error but it doesn't run, please please help🥲
It really doesn't run with zero errors,and I've been trying 2 days to figure out but with no benefits