Understanding parenting and frames in tkinter

in this part we are going to cover something slightly more advanced and that is frames and parenting frames are just another widget but you wouldn't really use them by themselves instead use them to create better layouts and for the better layouts you are going to need parenting let's talk about it so far for the parent we have always used the window itself but that is very often not what you want for example if we are going to create a menu you want to have every single menu item to have the actual menu as the parent or if you have a tab entry you want to have every single widget inside of the tab with the parent being the tab we're going to cover both of those cases in the next two parts so I'm going to go into a bit more detail but for both you need more control over what the master is what we're going to cover for this part is a complex layout or a slightly more complex one because what you can do is you can create a container widget and use that to organize your widgets and then you can place the container widget somewhere on the window the container widget here is going to be the frame this one is called ttk frame and this is an empty widget how you are going to use it is you are placing other widgets inside of it and then you place the frame that way you are placing all of the widgets inside of it as well which is really powerful to create more complicated layouts for now we're going to keep it fairly simple but in the next major section we're going to cover layouts in a lot of detail so don't worry about too much for now what you should take away from this part is how parenting Works once again here we are in the code if I run all of this we have an empty window that has a custom size 600 by 400 pixels what I want to start with is I want to create a frame this I want to store in a separate variable and this we create with ttk DOT frame this one like any other widget is going to need a master which in this case is going to be the window once we have that I can pack this thing and if I run it we can see that we can't see anything the reason being that frames are invisible that being said there's one way to visualize how a frame is going to look like right now the window has this certain size this I want to comment out if I run the code now we can see something like this we basically only have the top control buttons I can extend it but by default we have this size here this happens because tkinter or the window tries to have the size of the widgets inside which right now is an empty widget with no size so we get something like this but for a frame we can set the width let me go with 10 and we can set the height in here I want to go with 20. if I run this now we have a very small window I guess the numbers here are a bit small let's go with 100 and 200 that is looking a bit better we have a width of 100 pixels and we have a height of 200 pixels the numbers we get here and here another way you could visualize a frame which I think is even better is you could set a border with border with and this I'm going to go with 10. although by default you're not going to see anything also there shouldn't be a typo in there border with like so this is looking better now we have a border width but the Border has no color so it's invisible for that we have to set a relief and for the relief we have a couple of inbuilt options the one I'm going to use is called TK and Rich all in uppercase letters if I now run this we get the frame we have seen earlier except right now it has some kind of Border thingy the default for the relief is flat with this one you don't see anything besides that we have raised and we have sunken those look like this or like this it basically starts to look like a button another option is called Groove like so and this one I guess is even better let's stick with this one the relief option you're not going to use too often because most of the Styles here look quite outdated and later on we're going to learn better ways to style it now we can actually start the interesting bit and that is the parenting or I guess a more appropriate name in tikinder would be Master setting right now the master was always the window so the first argument we placed into any widget was always the window which we created all the way at the top this does not necessarily have to be the case what we could for example do is create another label or it could be any widget you create this always in the same way ttk label in this case and now for the master I want to set the frame other than that I want to have text and this I want to call label in frame you also still need to pack this label and if I run this now we can see a couple of things happened the first one is that we have the label inside of the frame however besides that the width and the height of the frame have changed we don't have something like this anymore instead we have well just this size here so what happened well the issue you have to understand here is that ttk primarily tries to set the size of a widget by its children in this case the frame only has one child and that is the label and that overwrites the width and the height if you don't want that there is an option to disable that you will get the frame again and the option is called pack and proper gate this is a method so we have to call it and then here we can either set faults or we can set true if you set true we are setting the size of the widget by its children if we set false we get the original size meaning we are using the width and the hive we have used for this tkinter widget you can also set multiple children inside of one frame for example I could create another button and this one is also going to have the frame as the master for the text I'm gonna go with button in a frame I want to pack the button and there we go now we have a button inside of it and you can't see we are cutting off the button a tiny bit meaning that TK enter constrains the size of these widgets quite a bit let me increase the width of this widget to 200 now this looks a bit better and that's kind of all you need to set the master to something other than the window you have created right now this doesn't seem too useful but let me demonstrate one instance where this could be powerful let's call this example I want to create another label let's call it label 2. this label is going to have the window as the parent and for the text I want to have label outside frame this label to I now want to pack and now we can see that the label is outside of the frame which is giving us quite a bit of space in here however now if I get the original frame and only pack it after label 2. if I run this now we can see we have the label on top and below that we have the frame itself with the widgets inside of that frame let me move it to the side this label here is all the way on the top and below that we have all of the other stuff this Frame here and all of the children of the frame what is even more powerful and what we are going to learn more about later let me return frame.pack to its original place so this thing is going to look like so again you can also inside of Pack set aside by default this side is always the string top but it doesn't have to be you could also set left for example let's see what this gets us and now we have the frame on the left side with the label outside of the frame being on the top this however we can also set to the left side and that gives us two widgets right next to each other with this system you can create pretty powerful setups and again we're going to learn much more about this later but for now this is all I want to cover for this bit Let's do an exercise and then we are done what I want you guys to do is to create another frame with a label a button and an entry widget and place it to the right of the other widgets pause the video now and see if you can figure this one out let's start by creating I'm going to call this the exercise frame this is going to be ttk and frame this one has the parent of window I am not going to pack it just yet instead I want to create a label a button and an entry widget since those are not going to be doing anything right now I am not going to store them inside of a variable I am just going to create ttk label the parent is going to be the exercise frame and the text is going to be label in frame 2. right after creating this I want to pack it as well I can copy this one now instead of a label I want to have a button the other arguments can stay identical and finally I want to have an entry widget this one doesn't have a text argument once I have all of those I want to get my exercise frame and pack it running this now we are getting a couple of other widgets all the way on the top right Adobe I realized the text here this one shouldn't be labeled this should be button in frame two let's run this again and this is looking pretty good although the last thing that we do have to do is that when I'm packing the exercise frame I want to set aside and decide should be left although this one has to be a string and now we have another widget to the right of it this one doesn't have a border around it so it looks a bit different but it's basically the same thing we have done in the original frame and this kind of system you can push quite a bit for example you could have one widget inside of a frame which is inside of another frame which is inside of the window but once again all of this we are going to cover in much more detail in just a few sections

Channel: Atlas

Views: 12,247

Keywords:

Id: pwUsdn-UdF4

Length: 11min 41sec (701 seconds)

Published: Sat Dec 10 2022