Up next in 10
Tkinter is Python's most popular Graphical User Interface (GUI) library. This topic explains the proper use of this library and its resources.
Python Tkinter: Geometry managers in Tkinter
Support the Channel šš:
Buy me a coffee ā : https://buymeacoffee.com/usandopy_
ā”ļø Connect with me on:
Instagram: https://www.instagram.com/pybeginners/
Twitter: https://x.com/joaofuti_
LinkedIn: https://www.linkedin.com/in/joao-futi-muanda-16b980175/
Website: https://www.usandopy.com/en
Thread: https://www.threads.net/@pybeginners
Show More Show Less View Video Transcript
0:00
hello guys welcome back to the channel
0:01
my name is W so today we are going to
0:03
learn about frames in tiinder so what is
0:05
frames so frame is something really
0:08
really important if you want to organize
0:10
your wiat or your layout of your
0:13
application properly okay so frame is
0:15
something very useful okay so that you
0:16
can organize things properly so uh to
0:19
use frames in t okay we use the class
0:22
called frame as we can see this is the
0:24
syntax okay so here in this example
0:26
we're going to learn how we can create a
0:28
frame okay how to display a frame inside
0:30
of a window and how to configure the
0:32
properties of a frame in TI okay so stay
0:36
with me and let's see what we can do by
0:39
using frames in t Okay so let's go to
0:42
the test editor so to use a frame okay
0:46
in int so we have we do something like
0:48
that okay we have a window okay we have
0:52
the main window okay so this is the main
0:54
window okay so inside of this window we
0:56
can organize or we can put a lot of
0:58
stuff for example even this my laptop
1:00
okay if I do that something like this
1:01
okay and this my laptop I have a main
1:03
window okay so in this main window I
1:05
have a browser which is showing this
1:07
document and also I have this guy here
1:10
okay so I have my test editor which is
1:12
inside of the main window so we can do
1:14
something like that also inside of the K
1:17
okay we can create a main window so
1:19
inside of that main window we can split
1:20
it in different section in different
1:22
areas so each area will be having
1:25
something different something specific
1:27
so the same thing is by using frame okay
1:31
so we use frame to organize the things
1:33
okay to organize the L to organize our U
1:36
uh U UI okay our user interface so to do
1:39
that we have to create a frame so a
1:41
frame is to create a frame we have can
1:43
do something like that okay see let me
1:45
see I will create one varable called
1:46
frame one okay frame one so this Frame
1:49
one will be equal frame okay so this
1:52
Frame okay is the one that you that is
1:56
used to create a frame so a frame it can
2:00
it must be placed inside of something
2:03
else it see a frame can be placed inside
2:06
of a frame itself or inside of the main
2:08
window okay so let's place this Frame
2:10
inside of the main window so then let's
2:12
do something like okay uh frame let's
2:15
give window okay comma okay so after
2:19
comma the options will come here the
2:21
option for this Frame okay so but to
2:23
place the frame properly inside of the
2:25
window we have do something like that
2:26
okay frame one dot okay let's use grid
2:30
okay grid okay I will open and
2:34
close okay for that me I like to use
2:36
grid to organize the frames which is
2:38
something very good and very useful okay
2:40
so let's say on row okay row equals z
2:45
okay comma and
2:47
column let's give an column zero Al okay
2:51
we know that this guy is the one which
2:52
is there so I can comment this one okay
2:54
I just comment comment this also comment
2:57
I save if I run this now we have a big
3:00
confusion here okay so the frame it's
3:03
here okay but it's background color is
3:07
the same color as the main window okay
3:10
so in order to for us to see this main
3:13
color we can do something like this see
3:16
uh we can do something like this okay we
3:17
can come here in our frame we can give
3:19
some options for the frame uh for
3:21
example we can change the background
3:23
color Okay BJ BJ equal let's say blue
3:28
okay blue I say and if I run boom so the
3:33
frame is there itself okay but the main
3:37
problem is that see it is something here
3:40
but it's too small so let's give some uh
3:42
width and height to the frame so that is
3:45
we can give us width and height inside
3:48
of the frame for the frame so we can do
3:49
something like okay width okay width uh
3:54
width equal okay uh so this width we can
3:58
say something like uh okay for example
4:01
100 comma and height okay height can be
4:05
equal for example okay let's say 100 100
4:08
okay now 100 is too much let's say 50 50
4:11
comma okay I save if I run this boom now
4:14
we can see our frame here okay so now
4:17
let's create something like this uh like
4:20
our exam example something like this
4:23
okay let's create now something like
4:26
this blue yellow green and red okay so
4:29
in order to create that something like
4:31
that okay let me delete those guys and
4:33
bye-bye so I'm I'm just going to copy
4:37
this guy okay come it down and I'll do
4:40
this again and again there are four if
4:43
I'm not wrong let me see four okay so uh
4:47
let me increase
4:49
Al let's give
4:52
200 200 200 and 200 and if I save this
4:58
and if I run boom okay uh that's too
5:02
small okay let's increase that so this
5:03
guy for them 400 maybe sh uh that is too
5:08
much if I run this okay this squad I
5:10
think is good and I think just a little
5:13
bit maybe 250 save and if I run yeah
5:17
okay 250 is enough so for those ones
5:20
also let's give the same configuration
5:22
I'll just copy this and I can come here
5:25
and boom paste this
5:27
Al paste and this
5:30
also paste saving if I run blue blue
5:34
blue blue blue okay this guy will be
5:36
blue no let's we have to follow blue
5:39
yellow the second one will be let's
5:41
change the name okay this stay for
5:44
two oh and this stay for
5:47
three this stay for four if I save if I
5:51
run Perfecto everything is they are
5:54
showing like that because they are in
5:55
the row zero row zero row Z row Z okay
5:58
so this guy guy H will stay in the row
6:02
zero if we say it okay is in the row
6:05
zero okay but in the column one come
6:09
column one I
6:11
save and if I run this okay perfect is
6:15
there itself okay now is this guy okay
6:18
so this guy is in the row
6:21
one okay and is in column zero perfect
6:25
this guy is also in the row one but is
6:27
in the color one okay save if I run boom
6:31
now we have all of them here okay
6:33
perfect so so in order to give those
6:36
gaps that we can see for this guy has
6:38
some kind of Gap here so we can do
6:41
something like that so I can just come
6:42
here I can come here okay he
6:46
down it inside the grid okay I can come
6:48
here down okay I'm just let me give you
6:51
comma comma and Comm oh sorry uh putting
6:55
those there okay give is comma space so
6:59
I can say something like that pad okay
7:02
pad y okay equal at least five I save in
7:07
if I run boom we can say now it's giving
7:10
space okay I
7:12
think that is not enough maybe it's 8
7:15
OR7 save if I run boom okay that one is
7:19
good okay then I can give also comma
7:24
then I can say p y okay the same the
7:28
same way that we have X X okay then we
7:30
have also y so X it give like a
7:34
horizontal space okay and Y it give like
7:37
vertical space okay so if I say p y
7:40
equal uh for example five save in if I
7:43
run boom we have some kind of space
7:46
something like that okay good this is
7:49
what we this is what we want so now
7:52
let's change the colors of those guys
7:54
okay of this those frames so to change
7:56
the color of those frames okay we can
7:59
come here okay for this one is blue uh
8:02
if I we check here okay it's yellow
8:05
byebye blue stay
8:07
yellow and uh oh okay red the second one
8:11
is
8:13
red I save and what is the next is green
8:17
okay the next one is
8:19
green bye-bye you stay green I save and
8:25
if I run this boom now we have the same
8:28
result okay so now let's decrease this
8:30
Windows which is too big to uh let's say
8:34
250 is good if I saving if I run
8:38
Perfecto and this guy let's close for
8:40
while let's say 500 safe and the Run oh
8:43
too small three save and run yeah
8:47
Perfecto we can see okay uh I think this
8:51
got for three
8:52
230 and if I save and I run boom now we
8:55
have the same thing
8:57
okay so now we have we have the same
9:00
result as the one that is showing here
9:03
okay so this is how we can use frames
9:06
okay so now we said okay inside of frame
9:08
we can start organizing all things so
9:10
let's say like for example this Frame uh
9:12
we want to use it like for how can I say
9:17
okay for we want to use this one just to
9:19
put some information there some normal
9:21
information there for example I can just
9:22
come here for examp uh let me create one
9:24
label
9:25
label okay so uh okay label label equal
9:30
class label okay open say let's say uh
9:35
it stay we want to place this label
9:37
inside of this Frame okay we can just
9:38
call this that frame okay let's say
9:40
frame one okay will be for example test
9:44
okay test will be equal name okay oh let
9:48
me put name sorry will name for name dot
9:55
sorry dot let's say my name which is my
9:58
name I save then let's place this label
10:02
okay let's say lbl okay
10:05
dot pack do p open and close sorry and
10:10
if I run this boom now we have this name
10:13
here inside of this label so inside of
10:16
this Frame okay so this is how we use uh
10:18
frames okay so frame is very good for us
10:20
to organize our layout and to create the
10:23
things properly okay organize the the
10:26
application okay UI user interface so
10:28
for if I copy this guy also copy come
10:32
come come stay here uh let's put it in
10:35
frame two no frame four frame four save
10:39
and if I run this boom now we have here
10:41
also name name okay this is how we use
10:44
uh frame to organize the we Gates boom
10:47
so guys we stay here okay in the next uh
10:50
tutorial next video we are going to
10:52
learn new stuffs okay so if you like the
10:54
video give a like and stay in the
10:56
channel subscribe for the for more
10:58
videos Okay so my name is bye-bye see
11:00
you in the next video bye