All right, welcome to the video. My name is
john elder from coding Comm. And in this video, we're going to start to talk about graphical
user interfaces with Python specifically using kinter, or t kinter. As it's, I guess, called.
And that's a module that comes built in with Python that allows you to create gooeys graphical
user interfaces, relatively easy and very, very quickly. So we're going to start to look
into that in this video, I'll show you the very very basics This is going to be a series
of videos so you can follow along and, and learn all about it. So before we get started,
if you like this video and want to see more, be sure to smash the like button below, subscribe
to the channel. And be sure to check out Cody comm where I have dozens of courses with hundreds
of videos that teach you to code, Use coupon code YOUTUBE to get $20 off membership. That's
all my courses, videos and books for a one time fee of just $27, which is pretty insane.
But check that out if you're interested. So let's get right into it. Like I said, Python
comes built in with T kinter or kinter, as some people call it, I'm probably going to
call it kinter I kind of dropped the T it's silent. If I call it T canter you know what
I'm talking about. So I'm gonna assume you already have Python installed on your machine.
Now this should work on Windows, Linux or Mac, I'm on a Windows computer. So just sort
of keep that in mind. But I'm going to assume you already have Python installed. If you
don't, you can go find another video to install it. I'm going to assume you already sort of
know how to use Python. So you can run a script and make it work without me having to show
you how to do that. So let's just jump right in here. Here. I have the Sublime Text Editor,
you can use absolutely any text editor that you want. I like sublime, it's free. It's
pretty cool. So I've just got an unsaved file open right now. So to start, we need to import
kinter. And it's really easy. We just go from lowercase t k i n t r t Kenter. And then we
want to import everything. Alright, so right away, let's go ahead and save this file. Let's
first view, I want to say syntax, we want this to be Python. Okay, so bops up. Let's
go ahead and save this. And I'm going to navigate to my C directory, you
can save this anywhere you want, wherever you just, you'll remember it, I created this
GUI, graphical user interface directory. And this is where I'm going to save all this stuff.
So let's just call this one Hello. And go ahead and save it. Okay, so says hello.py
is the py file, Python file. Okay, so pretty straightforward. We're just going to import
this module TK, enter, import everything. Now, this allows us to use everything in TK,
enter. There's some other ways you can import this. But this is sort of the main way that
you do it. And I'm not going to talk about any other ways, because this is what you're
gonna want to use 99.9% of the time. So in kinter, everything is a widget. There's button
widgets, text widgets, frame widgets, everything's a widget. And the first thing you create is
sort of the root widget. It's Think of it like the window. Any graphical user interface
program on your computer has like a window, if you're on a Windows machine, it's the windows
window. If you're on a Mac or Linux, it's the same kind of, you know, boxy window thing.
So we need to create that before we do anything else. So we call it the root. It's the root
widget, and we just set this equal to a T k. And that's it. So this has to go first,
this has to happen before anything else in your program. When you're working with TK,
enter. So just right off the bat, just make it the first thing that you always do. So
for the rest of this video, we're going to create just a very, very simple window, sort
of a Hello World window, and, and run it. So we want it to like say some text, right.
And the text will just be whenever we want hello world or whatever. So we need to create
a label widget. Now throughout the course of this series, I'm going to talk about all
the different widgets, we're going to talk about them all in great detail. And we'll
get into that in the future. For this video, we're just gonna use the label widget, I'm
not going to talk about it in great depth, because it's very simple. I might talk about
it in more detail a little bit later on. But to create anything is in kinter is really
a two step process, you have to define the thing and created and then you have to put
it up on the screen. So it's two steps always. So the first step, we're just going to create
a label widget. So I'm just going to call this my label, labor. And then set this equal to it's a label widget.
So we have this label function, right. And then we want this to go in our root widget,
right? And then for the text, we want it to go Hello world. I can type correctly. Alright,
and that's it. So we've now created a label a label widget. Now we have to put that widget
into our root widget into our root window, right. So that's a two step process I was
talking about. Now there's a couple of different ways that you can put things on the screen
with TK enter The first one we're going to look at is pack, we're just gonna pack it
in there. And when you think of pack, think of just like packing, you're just shoving
it in there at the first available spot, right? It's just sort of, it'll be the size that
it is. It's very unsophisticated, we're just shoving it in there. And that's what I'm going
to use it for this video, because we haven't learned anything else. Primarily, you're gonna
use the other method to put stuff on the screen. And we'll talk about that later, probably
in the next couple of videos. But for right now, we're just going to pack this thing in
there. So what we do is we take our widget, which is my label, and then dot pack. That's
it. So here, we're creating a, let's just call it a text. It's a label called a label,
widget. And then here, we are shoving it onto the screen. Right. So that's it. So now the
last thing we need to do is create an event loop. And what an event loop is, when you
have a graphical user interface, when you have a program running, it's always looping
constantly. And that's how it figures out what's going on. So as it's looping, you might
move your mouse cursor, right, since it's looping, it notices, oh, the mouse is here.
Now it's here. Now it's here. Now it's here, because it's continually looping. If you go
to click a button, you know, it loops sees you moving towards that button as it's looping,
looping, looping. So it's a constant loop. So you have to create that loop. And normally
when a program ends, is when that loop ends. Now, if you're familiar with programming of
any time, you're familiar with loops, they keep going until something happens, right.
And in this case, they keep going until the program is and then the end. So to do that,
we want to create a route. This is our root widget. And then we want to call it main loop,
because this is the main loop of the program. Right? And that's it. So let's go ahead and
save this. Now, this is ridiculously simple. We've just created a graphical user interface,
actually actual program that will run and visually, you know, Cool, well, it's not that
cool. We'll see in a second here, but it works. And it's like, what is this 12345 lines of
code? That's ridiculous. That's very, very simple. Now, granted, this is a very unsophisticated,
easy program. But I think you can see right away how simple it is to use this key Cantor
is no more complicated than this. Right? If you have a bigger program that you
want to create Sure, there's going to be more lines of code. But everything is a widget.
And this is how easy it is to create a widget, you just define it, and then pack it in there
somehow. That's it. So it's not that hard to use this d kinders, which is really cool.
So let's go ahead and run this and see what we got. I'm pulling up, I have this Git Bash
terminal, I downloaded this, you can just google Git Bash, if you want to use this when
you absolutely don't, you can use any terminal that's on your computer or any way that you
already use in the past to run Python programs. Windows has a command prompt, it has the PowerShell
installed, you can use either of those, if you're on a Mac or Linux, you could use your
regular terminal, whatever. So I'm going to change directory into C. gooey. And just to
make sure our Hello file is there. It sure is. So let's just run this file. So I type
in Python. And then Hello dot p y. And oh, something happened. object has no
attribute main loop. What did we do? Oh, the l must be lowercase joy. Alright, so go ahead
and save this. pull this back up again. Run it again. And here we have it's on my other
monitor. So let me drag it over. And there we have it. Put it up here. So this is it.
So let's pull our code back up as well. Okay, so here it says hello world, because we typed
right here, hello world. And this is the little t kinter icon is a fav icon. We can change
that. And we'll talk about that later. You can see this program has a minimize button
that works. It has a maximize button that works and an X button that works so when we
click that it ended automatically so we can run this again, just for fun. Let's pull this
over. Now we can resize this and it kind of resizes things automatically. In a future
video, I'm going to show you how to explicitly resize it. So when you started it doesn't
start small like this. But in this case, we use pack and pack says you know pack this
in just as as big as the stuff inside is in our text widget is only you know what is this
1012 characters so it's only That big hole widget is only that big. So the window is
only that big. Pretty cool. So that's it. That's how easy it is. And check it out. I
mean, this is a full on Windows window, right? has all the things you would expect, minimize
maximize a little x. Very cool. And see this x, right here. What you're doing when you're
closing this window is you're disrupting this main loop, this root loop. And that causes
the program to end. So we'll look at all this in more detail in the next few videos. Alright,
in the last video, we did our Hello World program. And we position the stuff on the
screen using Pac, which is a very, very simple and easy way to position things, but doesn't
give you a whole lot of control. In this video, I want to talk about the grid system, it's
a better way to position things on the screen. And it's the way you're going to use most
of the time. So let's take a look at our code from last time. And remember, we use this
pack now first thing I'm going to do is I'm just going to save as let's save this as a
different file, I'm going to call this grid.py. And let's pull up our terminal real quick
and just run this program grid dot p y. And remember, I'm in C for slash GUI, the director
and created for all of our files here. And we can pull this over. And you can see here
it is just a very basic program hello world. Now the thing to remember about this is, look
what happens when we resize this, it stays in the middle. And we can play around with
this all we want. And this stays right where it is. That's one of the nice things about
Pac, it keeps it exactly where it's supposed to be. But it doesn't give you a whole lot
of control. So going further in this video, we're going to go ahead and look at the grid
system. Now, the grid system is exactly like it sounds, it's a grid. So think of all of
your programs as a grid grids have columns up and down. And they have rows left to right.
And just visualize that in your head. And you pretty much understand the grid system.
Now, we we deal with the grid system using numbers. So you would say row zero to put
it in the very top row, row one to put in the next row row two, row three, row four.
Same thing with columns, column zero, it all starts with zero. Computers always start with
zero, right, so column zero, column one, column two, column three. That's really all there
is to it. Now, there's a couple of little tricky things you have to know. And we're
going to talk about those in this video. But really, it's not too bad. So let's come over
here and let's modify this code. So we have my label, I'm just going to copy and paste
these. And let's call this one my label one. And this one, my label two. And we'll keep
this one the same. And then for this one, let's just change it to my name is john elder,
right. So instead of packing these things in, we want to use the grid system. And it's
really very simple. We just type in my label my label one, and then dot grid, right. So
instead of dot pack, it's dot grid. And same thing here. Let's go my label to dot grid. Now, inside of this parentheses
inside of this function, we need to just tell the program where we want these things. So
let's go row equals zero and column equals zero. So I'm just going to copy these down
to here. And let's change this to row one and column zero. So they're going to be in
the same column, one will be on top and one will be on bottom. Right? Pretty simple. So
go ahead and save this. And let's run this and see if it does what we expect. Pull this
over, it's hard to get a grasp on it. There we go. So here we go. Hello world. And directly
below it is My name is john elder. Now you'll notice that the program itself is still just
as big as the text. So it hasn't expanded any. We'll talk about that later. But here's
the thing to see, check this out. If we resize this, this stuff doesn't automatically resize,
it stays right where it is row one column a row zero, column zero, row one, column zero.
So that's one sort of thing to keep in mind. Let's go ahead and close this. Now let's play
around with this a little bit more code backup. So let's say we want let's just change this
to column one. See what this looks like. So if we save this back here, and I'm just pressing
up on my keyboard, it pastes in the last command. Okay, so now if we pull this over, we can
see and let's pull up our code to There we go. So, row zero column and row one. So this is row
zero left to right. This is row one. Remember the rows and the columns all start at zero
and Column zero. So right here, up and down. And this is column one right here, up and
down. So pretty straightforward. And one thing you have to realize about this, that kind
of stinks is that this is all relative, their relative to each other. And what I mean by
that is look at this, if we change this from column one, my name is john elder, let's change
it to column five. Now, if we save this, and pull this back up, first, we need to close
this now rerun it again. Pull it over, and Oh, look at that, it's the same as the last
time, even though we put column five, oops, come back, come back, it's still just, it
looks like it's in column one, the second column over why we're telling it column five?
Well, because it's relative, there is nothing in column 123, or four. So kintra just ignores
it, right. So if you wanted something there, you would have to go something like, let's
go, let's just copy this, and call it my label three. And we might just put like nothing, right. And
then we could come down here, and let's just copy and paste. Level three, and we could
go, you know, to one doesn't matter, if we save this, and let's close this. And now,
not gonna be a whole lot better. You can't, you can't really tell because it's just nothing
there. So there's, there is another column in between these two, it's kind of hard to
tell. But there's nothing in it. If we went, you know, something like this, and saved this
and ran it. Well, now you can really see the difference, right.
So that's sort of a hacky way to do it. And there's lots of other ways to do this. And
as we go forward. throughout this series of courses are the series of videos, I'm going
to show you all kinds of tips and tricks on how to position things around using the grid
system. In this video, I just wanted to show that sort of like a talk, sort of show you
that the grid system exists, give you the very basic fundamentals of it, so you can
start playing around with it. Now one last thing I want to talk about before we end this
video, let's just close this. And let's get rid of this and get rid of this. Now, Python
is object oriented. And you can do object D type things with Python. And even though
this is kinter, it's still just Python, right? So we don't have to write our code like this.
I always do because it's easier to sort of keep track of things. Remember, in the last
video, I said, doing everything in kinter is a two step process. First, you create the
thing, then you put the thing on the screen. So here, we're creating the things. And here
we're putting them onto the screen, right? Sure. That's really what you're going to want
to do. But you don't have to since Python is object oriented. This dot grid is basically
just an object II sort of thing you can do. So instead of this, you can just slap this
on the end. Same thing here. Right? If you're familiar with Ruby programming,
we do a lot of stuff like this in Ruby. But you can do in Python, too, because it's object
oriented. So you can just slap this on the end, put a dot grid. Now if we save this,
Come back to our terminal. run this again, we get the exact same thing as we would expect.
It's just we don't have to do it in two steps. We can do it in one step. That's great, right?
But you know, this is a very, very basic widget we're creating right here. And it's already
pretty big, right? You really want to make it even bigger, even harder to read by doing
stuff at the end. Probably not, maybe sometimes you do. I like cleaner code. And to me doing
it in two steps like this just seems cleaner. It's really a personal preference. But I would
recommend you doing it this way. In the future. I just wanted to show you that that's possible
just to kind of blow your minds a little bit and give you a little something to think about.
Doesn't really matter what kind of program you're building what kind of graphical user
interface chances are, you're going to need a button for something probably lots of buttons.
So that's what we're going to look at in this video. So in the last video, we looked at
the grid system, how to position things around. So I'm going to come up here to our grid.py
file. I'm just going to rename this, and let's just call this buttons.hi. Okay, so let's
play around with this a little bit. Let's just get rid of all of this. Let's get rid
of this to you. Okay, so to create a button in kinter is pretty simple a button like everything
in Cantor is a widget. So we want to create a button widget. So let's just call this one
my button, I guess. And we just call a button. And this function right now, inside of here,
we need to tell it, you know, where we want this. So we want it in root, and then what
text right, so let's say, click me, right, so like everything, in kinter, once we define
the thing, now we have to actually put it up on the screen. So let's just go my button,
that pack but just pack it in there, just for example purposes. So go ahead and save
this. And let's head over here to our terminal. And remember, I'm in C forward slash gooey.
It's just the directory I created, you can, you know, save these anywhere you want. So
let's go Python. And then buttons, dot p y, pull this over my other monitor. And we see
there it is click me now when we click on this thing, it doesn't do anything because
we haven't told it to do anything yet. So before we do that, I want to show you one
more kind of cool thing. Right up here, when you're defining this thing, you can put a
state, so state equals, let's call this disabled, right. So if we save this, come back here
and hit reload, and drag this guy over, you can see now the button is disabled, it won't
even click right, it's sort of grayed out a little bit. So that's kind of cool. One
other thing we can look at, before we learn how to actually have these things, do something,
let's get rid of this, we can sort of change the size of these. So we can pad x, and we
can pad y First let's look at pad x. So let's say 50. Right, sort of an arbitrary thing,
come back here and reload this guy. Let's pull this over. And you can see now the button
is wider, right? x, think of like an X Y axis, right? So the X is sort of horizontal and
the Y is vertical. Y is up and down. And x is left and right. Right. So that's cool.
So we could change this to any size we want. I just put 50. Next, let's go had y equals
50. Just to see what this looks like, save this, and run it. Pull this over. And so you
see now we have a big square button. And hard to tell. See, if I click it, there we go.
Right. So that's kind of neat, right? Um, let's see, just for fun, let's get rid of
the pad x, see what this looks like, save it and run it. So okay, so it's a tall skinny button, I don't
know why you would ever want to do this, say the truth, you're probably never going to
want to resize the button anyway. But you may just for you know, aesthetic reasons sometimes
need to make your button a little bigger or smaller. So that's how you do that. So we
can change the size with pad x and pad y we can disable and enable with the state. Now
we need this to actually do something how do we get a button to do something in kinter?
Well, let's close this, it's actually very, very easy. What we do is create a function,
any old function to do anything you want. So let's say we're creating a function here.
So we go define my click. And then it's just a function like any other function in Python.
And inside of here, you can have a do absolutely anything you want. So let's create, remember
my label. And let's call this label. Whoops, there we go. And we want it to be in root.
And we want the text to say, oops, if I could type, there we go. Look, I clicked
a button. Okay, so we've created a label, now we need to put it on the screen. So let's
just go my my label dot pack. And I know grid system is better. But this is just for example,
we just want to throw this up on the screen anyway. So that's good to go. So as you know,
with a function, it doesn't get executed until it gets called. And that's not a kinter thing.
That's just a Python thing. It's really just an object oriented programming thing. So you
know, the program starts here executes this line, it executes this line, it sees this
and it doesn't actually execute it, it reads it into memory. So then later on, if you want
to run it, you can call it and it'll run, but it doesn't actually do anything. And we
can prove that by saving this real quick and we can run this and let's pull this guy back
over. And so you know, when we click here, nothing actually happens because we're not
telling it to execute yet. So to actually tell us execute is really, really simple.
We just go let's go command equals and then name the function my click So if we save this,
come back here and run this guy one more time. You click this, oh, look, I clicked a button,
it appears actually, if we keep clicking, it keeps putting it up on the screen. That's
a discussion for another time. But yeah, it really doesn't matter what you want the button
to do. Right? If you're, if you build a form, right, and you've got a submit button to submit
the form via email or something, right, same thing, we're just going to create a function.
And then in the function, you'll write different code to do whatever you want to do. But just
that simple. So it's this command. And now here's something to sort of keep in mind.
Also, let's pull this guy back up again real quick, and close it. Now normally, when you
call a function with Python, you call it with those things like right here, we're calling
this pack function, right? And we put the parentheses when we did the grid stuff, we
were going my button dot grid. And then given that, right, so anytime in Python, when you
call a function, and you call the parentheses like that, it's just normal. But here, you
don't if we save this and run it, I don't think this is gonna work. My, No, it doesn't.
Let's pull us over. When the program starts, it ran it automatically. So it already has
it up there. And we're going to click the button, it doesn't execute it again, like
it did in the last little bit we did. So you're gonna forget and do that. Because what you're
doing here is calling this function. And whenever you call a function as a programmer, as a
Python programmer, especially, you know, you need to put these little parentheses. So if
you do, you'll get an error, well, you won't get an error just won't work, right, as we
just saw. So just remember to keep those off of there when you're using the command buttons.
And that's pretty much it. Now, I think you can also change the color of buttons. It's
been a while since I've done this, because who changes the colors? But I think it's fg
foreground color. I could be wrong. So let's try. Let's change this to blue. I'm not even
sure this is going to work. I don't even remember. But since we're playing with buttons here,
no. So let's see, what we need to do is put this in parentheses, maybe. Let's save this
and run it should have been more prepared and actually tried this. Yes. So here we have
now the text is blue. Right? So that's kind of cool. Now that's f g for foreground color.
We can also do I guess BG for background color. And let's go red. It's gonna be pretty ugly,
I think. Yeah. Pull this over now. So now the
button itself becomes red. And I don't know why you would want to do that. But if you did, you could do that. And and
the colors. You can use just you know any old color. I'm not sure. Let's see. Let's play around here. I don't
know if we can do like hex color codes. See this? That is, so we got to close this program
first. And then run it again. Yeah, it looks like that worked. Is that a white button that
looks white to you? The background color? I think that's why Yeah. It's the only hex
color code I can remember off. What's another one? fff. fff. Whoa, boy, I don't know. What is 000000? Is that black? I can't remember. I think I might be black.
Yeah. That answers that. Yeah, you can use hex color codes in there. So that's handy.
So if you're a web developer, and you're, you know, doing CSS and you're used to using
hex color codes, or whatever that is, it's hex color codes, those color codes right there
with a little hashtag in front of them. You can use those in this fg and bg. So that's
pretty much all I want to talk about with buttons buttons are pretty simple and straightforward.
As we you know, continue on with this tutorial, we'll use buttons a lot in the coming videos.
And we'll use a lot more complicated functions than this my click function that we use right
here. Obviously, this is just for example purposes, to show you how to call a function
from a button. But yeah, pretty simple. In this video, we're going to talk about input
boxes, how to input data into your program. Let's just run this real quick to refresh
our memories. And just pull this over. So we get this little button If we click it,
it puts some text up on the screen. So that's kind of cool, but we want to expand on this
and put a little like input box, sort of like a webform you know where a box you can type
stuff into and then we want to do stuff with Whatever we type into that thing, so that's
what we're going to do in this video. So let's go ahead and close this, pull our text our
stuff back up. And to do an input box and kinter, we use not an input widget, which
is what you would think they would call it. But it's called an entry widget, we're entering
data, right, so let's go up here to file and let's save this as entry.pi. So we want to
create a entry widget, right? So I'm just going to call this E, E for entry. So E equals
entry. This is the entry widget. And we want this to be in route. Now there's a whole bunch
of other stuff we can put in here, parameters and things. And we'll talk about that in just
a minute. So instead of doing that, let's just e pack this guy in here. And go ahead
and save this. So this is entry.py. So I'm gonna pull up my thing here, and let's run
entry.py. Remember, this is just the terminal that I use, you can use any terminal, I'm
in C forward slash gooey, which is the directory where I'm saving all of these files for this
course. Okay, so pull this over. And we see, you know, we've got this box, we can type
stuff in. If we click here, it doesn't do anything with this. This is from the last
episode, the last video we did. So okay, we've got an input box, that's kind of cool. Before
we go on, let's talk about some of these parameters. So we can immediately change the size of this
thing. So we can go with equals, we've seen with before, I think, and I'm just going to
call this 50. So if we save this, come back and run it. You can see now our input box
is quite a bit bigger. So whatever size you want, you can do that. Pretty simple. Let's
see what else we can do. We can change the color in the same way that we change the button
color. Remember fg and bg. So if we want to go BG equals, you know, I don't know, blue,
right? Save this, come back here and hit reload. Now the boxes blue, and stuff we type is black,
it's kind of ugly, but you know, whatever floats your boat, we can also do foreground
color. And let's change this to white, for instance. There we go. Save this, run it.
And we get the same ugly blue, but now the text inside is white. Okay, that's kind of
cool, I guess. Still a little goofy. So let's get rid of that. Because that is just ugly.
We can also change the border width. So let's say I don't know, five. So
if we save this and run it as a big enough, can you tell if you see the border as sort
of a raised kind of thing to it? I don't know why you would want to do that. But if you
did, you could do that. That's kind of cool. So those are sort of the there's other parameters
you can play around with. And I'm not gonna really talk about them because they're, they're
not as cool. All right. But I guess you could Google if you're really interested. But now
we want to talk about Alright, what, what can we do with text that's been entered into
this form, or into this input box into this entry widget? How do we actually do stuff
with it? Well, what we want to do is, we can pull an E dot get, and this get function gets
whatever you've typed into that, that thing. So let's, let's use this with our button.
So we've got this button that says Click me. Instead, let's change this to enter your name,
right? And we want when this runs, we want this my click function to fire. So we've got
the command right here, command equals my click. And now so when we click the button,
it'll execute. So what do we want to happen? When we click the button? Well, let's go.
Let's just change this my label instead of the text. Let's just type in that e dot get
function. Alright, so let's save this and run it and see if that works. This over. Alright,
enter your name, john. Boom, john. Right. So it's kind of cool that we can do sort of
pythonic things with this if we want. If we want to get crazy, we can type in you know,
hello. And then a plus sign to concatenate it. And this is just pure Python. This is
not a kinter thing, right? We know how to concatenate concatenate, you know, smush,
two things together with Python. So we can do that. So let's run this. Somebody is texting
me like crazy. So type in john. Hello, john. Right. So that's kind of cool. We can also
sort of looking at This, this area right here is getting a little crazy, right? So right
up here, we're really anywhere in center function, if we want, we can say, we can call a Hello
variable, right. And we can say hello equals, then the text Hello. And then we can concatenate
II dot get, just like that. And then down here, we don't really talk to this about this in
the past, but you can type in variables for your text fields, as long as they're not.
Let's see in quotation marks, or if you put them in quotation marks, it's just a string,
and it's going to treat it as a text string. But if you're like this, it's a variable.
So now if we save this, and run it, see, enter your name, john. Older, fancy, let's do the
last name. Hello, john elder, right. And if we keep doing this, cool. So pretty simple,
pretty straightforward. That is how you do that. Now, one last little thing that I didn't
talk about. We can go, he dot insert. And then now we want to give us an index number
zero, we'll need to talk about that. There's only one, there's only one box, it's the zero
with box. And we can now give this a default value, we can say, enter your name. Right.
So we save this, what this will do is this will put some default text inside of the text
box, right? So you know, a lot of times if you go to like a web form, it'll say, you
know, email inside the little box where you're supposed to type in your email, or whatever
it'll say username inside the box. If you want to do something like that. You can run
this. And then here it says, enter your name, right? So then you would want to do that. Hello, john. So pretty, pretty simple, pretty
straightforward. Pretty easy. As everything has been so far in TK, enter. So now, all
right, we can create a program, we can have input boxes, we can enter data in, we can
click a button, we can now do stuff with that, you know, programmatically behind the scenes,
we can then output based on what we typed in. So we've got really the basis, the fundamentals
of almost any program, like what does any program do except for taking data, do stuff
with it, and then output it. And here we have everything you need to know to do that with
kinter and a graphical user interface using Python. So very, very simple, very straightforward,
is less than 20 lines of code. And we've got a fully functioning program that actually
does something now it does something stupid, it just enters a name onto the screen. But
hey, you know, you can take just this and really make any kind of program you want,
right? So you want to create a stock quote, program, well enter the stock quote, right,
we could just change this to enter your stock quote, right, we save it, run it again. Enter
your stock quote. So if I type in, you know, Facebook, and then click the button, it says,
Hello, Facebook. But how easy would it be programmatically behind the scenes to instead
of just print hello, Facebook on the screen to take that Facebook stock, quote, connect
to a third party API, get the stock quote, bring it back in put, put the current stock
price on the screen, it'd be pretty simple to do that. In fact, we're going to start
doing things like that in the next few videos, we play around with this. That's really, really
cool. And just so just that easy to create really cool programs with this. In this video, we're going to put everything
we've learned so far, sort of together and create a very, very simple calculator. This
is the calculator we're going to create in this video. And you can see all it does is
add so we can go four plus two equals six. It doesn't subtract, multiply divide yet,
we'll do that in the future. In this video, I just want to do the very basics, get the
graphical user interface, this stuff here going on, just do a simple addition, and things
like that. So we may finish this whole thing in this video, we may have to break it up
into a couple which we'll have to see. And you can see this is just a very, very basic,
we're using buttons here. Like we've learned a couple of videos ago, it's not fancy looking.
We've got an input box with some raised borders, like we learned how to do in the last video,
you know, just very simple but it's it's a program we can build it and should be cool.
So I'm going to go to the program we made yesterday and let's just save this as calculate
tour. Okay, so right off the bat. We haven't looked at this yet, but you see up here As
simple calculator, that's the title. Let's go ahead and close this. And to change that
on any program, we just type in root, and then dot title. And then just type in whatever
we want. So we go simple calc later, right? let it work. Okay, so right off the bat, we
can start to use some of this stuff we've already used in the past, to get rid of this
pack stuff, we're not going to be packing anything anymore, we're going to be using
a grid system. So let's just use this this entry text box that we used in the last video,
and just sort of expand a little bit. Now, I want to make this with 35. And let's give
this a border with with equal to five. Okay, so now we want to slap that up on the screen.
So let's go e dot grid, we already know how to do. And we want this in the very first
row, and column. The very first column, and now we're gonna
do a couple of things, we want to give this a column all span of three. And that's because underneath
this input field, there's gonna be three buttons, and each button will be in a column. So we
want this column, or we want this text field, this entry field to span all three of those,
right? And I'm not sure if we talked about that in the last video or not. But you can,
you can do that like that. Now let's give this some padding, we want to go pad x equals,
let's go 10. And let's go pad y equals 10. Okay, so let's save this. And let's just run
this real quick. Just to see if it worked Python calc, you
later.pi pull it up. And so far, so good. It says simple calculator. It says enter your
name. That's from the last video, we'll we'll take that off here. Alright, so so so far,
so good. Let's look at this. Let's just get rid of this. There we go. In fact, we can
probably just comment this out, we really don't need that. Okay, so now, we need 12345678,
at least nine buttons, right? So let's get rid of this. Okay, so let's go, let's call
them button, underscore one. And each button will be button to button three, button four
is easy way for us to keep track of that. And so we want this to be a button. And we
want it to go in route. And we want the text of the button to say one. All right, now we
want to make the button bigger. So let's go pad x. And let's give this a 40. And let's
go pad y and give this a 20. You can make these any size you want. Now, we're going
to have to give this a command. And let's call this button ad. Right. So we need to create a button
ad so let's go deaf button underscore ad. JOHN. Let's just put that for now. Okay, so that
will work. So let's just we need nine of these right? Well, 10 actually, because we need
a zero, so 234-567-8910. Okay, so we'll just come through here and this will be button
to button three, button four, button five, and six button seven. Very exciting, right,
but Nate and buttons zero. And same thing, go through here and change them 23456789 and
zero. Okay, so we've created our buttons. Pretty simple. We also need, let's see, we
need a plus button and an equal to button and it clear the screen button. But we'll
work on those in just a bit. First, let's start slapping these up onto the screen. Now,
I'm going to pull up just a regular calculator that comes with the computer. And you can
see regular calculator start with 789456 and then end with 123. So we want to do sort of
the same thing. So and let's come out here and say, put the buttons
on the screen. Right? And up here. Maybe we'll go define buttons. So it's good to comment
your code. I'm very lazy at it as you can see. Okay, so let's go button underscore whoops,
two, two T's button underscore one dot grid. And now We want this to go row equals column
equals, and we'll fill these in in a bit. So button 123456789. All right, so let's just go 23456789. And I guess we need
one more. Zero. Okay, so where do we want these to go in the
road grid system, right? Well, button 123. Those go on the bottom. Let's start at the
top here. So the very top row is button Seven, eight, and nine. So 789, that'll be a row
one, row one and row one, right on the same row, and then column, column zero, column
one, column two. In fact, all of these can go 012012. Okay, so four, or five, six, those
are in the middle, the next row down. So that's row two, two, and two. And finally, the last
row is button one, two, and three. So that's 433, and three, finally, then we want row
four, and then column zero. So let's save this and run this guy and see how that looks.
We got an error. My click, that's something from the old. Let's pull this back up. Where
does it say Mike? Oh, this old button, get rid of that. Alright, save this. And run this
guy again. Okay, so it's looking pretty good. The buttons don't actually do anything yet,
but they look like buttons, starting to look like a calculator, right? Not bad. So what we want now is to, let's say, We want
a clear the screen button. And we want a equals to button. And we also need an addition button.
So let's go ahead and create those real quick. Let's go back up here. And let's create button
underscore add, then I'm just gonna copy all this. And so we want this to have an addition
sign in it. And actually, we need to change the padding because
it's a symbol, the width is a little bit different. So it's 39 instead of 40. So that works. Let's
see. Next, we need a button, underscore equal. And I'm going to do the same thing. But for
the text, I'm going to put an equal to sign. And we want to make this long button. So we're
gonna go 91. And we'll take a look and see what that means in just a second. So we have
an addition button, we've got an equal to button. Now we need a button underscore clear.
And paste this in to equal two signs. And we want this to say clear. And we want this
to be long as well. But 79 will do the trick there instead of 91. Because when it was 91,
we just had one thing now we've got all of these characters. So taking that into account.
We'll put this at 79. You can put this any size you want. Make it look however you want.
So let's head back down here. And let's go. So we want LET'S GO button Clear button. Add button. dot what was the other one add clear oh and
equal? Right? dot grid. Actually, copy this. Boom, boom. Okay, so now where do we want
these to go? Well, we can go. Let's see the button dot add. We want this on row equals
five column equals zero. And then right next to it. We want what? button equal maybe. So
let's go row equals five, column equals one. And then here below, we want row. What are
we on row three? row four. Want to clear in row four, I guess. And then column equals
one. All right. I think that's right, sir, I'm starting to lose track here. Let's close
this and run it again. Oh, that absolutely is not what we want is gone wrong here. So
zero, clear. Plus and equal are on the same. So let's see what I did here in the code.
So zero, and what do we say zero and equal are on the same? Let's run it again. I've
lost track. So zero and clear go together. Let's just do that right now. So zero and
clear. are both on row four, that seems right. And then add an equal or both on row five.
That seems right. Add an equal at an equal Hmm, what has gone wrong here? Oh, I know.
Since these buttons are spanning two columns, we need to put call spans of two into each
one. So where are we up here, we use this column span we need to do the same thing for
the see the clear and the equal to so clear, needs a paste the same columns man to and
what was the other one equal to an equal equals cost of entry as well. So okay, save this.
Let's run this again. And hopefully, that will do the trick. Boom, awesome. So now,
we've got this thing, it looks okay. But none of these buttons actually do anything. So
let's go ahead, close this. And let's look through here, here we have button add, let's
change this from button add, we want this to be a button click right, that makes more
sense to me, or what I was thinking. So just oops, go through here, change these real quick. Um, um, um, um, um, um, okay, so and then
up here, we need to change this button, add button, click. Okay, so when this gets clicked,
we want something to happen. Now, let's pass a parameter through here. And let's, let's
just call this number. Now to pass a null, pass a parameter into a function. Normally,
you would just go like this, and then you know, and then and do that, right. But you
can't because we can't use these parentheses. If you remember back, when we first learned
about buttons, you can't pass parameters with these buttons like that, but you can't do
it, it just takes another sort of thing. So what we need to do is something called a lambda,
we use a lambda, so it's a lm, B, da, and then lambda and then a colon. And then you
can do your thing, right? Like that. So let's go through here, and change each of these
to that. Little bit new here, but more. Now what we want to pass into each one of
these is what the button number is, right? So for button one, we want to pass in one
for button, 223456789 and then zero. And then these will deal with later. So now, let's
just take what we've passed through here. And then just First things first, we want
to delete what's already in the box. Right? And then we want to insert so he dot insert,
and I had to do this the other day, whatever that number was on to the thing, right? And
I think that's all we want to do. So let's save this and run it and see if that worked.
So we have 78922135. So now if we want to do like a bigger number 55 that becomes a problem, right? We can only sort of enter one thing at a time
this way. So we need to take that into account with our code here. So it's pretty simple.
Instead of deleting what was already in there, we can just go. We could just leave it like
this, save this and run it. It's not ideal may not even work, I'm not sure. Let's see.
So 587, see what's going on here. Say I want to put in the number. Let's close this and
run it again. Say I want to put in the number 108 108. Well, it says 801. Right. So we need
to fix that, hit back over to our code. And we want to look at button click, and, oops,
come back. And what we have here is, we need to insert the number plus whatever's already
in there. So let's create a variable. And let's put, let's call it current, the current
thing that's in there. And we'll put that equal to e dot get. Remember, we learned how
to do this few videos ago. All right, so now, we can kind of combine these. So we want the
current one to be listed first. So we'll go current, and then plus number. Now, this gets
tricky, because the plus will concatenate, but it also adds right, so if we're talking
about numbers here, we need to make sure that these are strings and not integers. So I'm
just gonna go I'm going to call a string function. And we can make sure that this is a string
probably already is, but this one, we want to absolutely make sure as a string, because
we're passing it in as an integer. If you come down here, you can see these numbers,
these are numbers. If we were passing it like this, we can leave it like this. And we wouldn't
have to convert it to a string because that is a string. So however you want to do this,
I'm going to leave it like this, and just put it like this. So let's go ahead and do
this. Now. Let's save this and run it, but there's going to be a problem. And you'll
see what that is right away. So if we go, say we want 15, one, five, it becomes 151.
If we do seven, now it's 1517151. Because it's not deleting what's in there first, which
we need to do that before we then put the new number on. That makes sense. So to do
that, what we want to do is after we make this current variable, and we don't really
need to create a variable for this, we could have just put a dot get right here. And that
would have worked. But I like to do it this way. Before we do that, we need to sort of
do a delete thing. So let's go e dot delete. Oops, we want to delete if I could type. There
we go. We want to delete everything that's in there. So we've done this before we just
go zero and then call it end. So this should work. Let's run this again. Let's run it. Hopefully this will do it. So 105. Right,
105875. Okay, so that seems to work. So what do we want to do next? Well, let's clear button.
It would be nice if that works. So let's just knock that out real quick. This is really
simple. And in fact, we already did this right here, right? So we just need to put this in
a function. So let's come down here to our Clear button. And right now it's calling button
clicks. Let's change this to button. Clear, right. Now we need to create this function.
Let's just do this up here. Let's go define button clear. You don't need to pass anything
into it. Let's make some space here. And all we need to do is e dot delete. So let's save
this and run it just to make sure that worked. So we're getting 555896 clear. I didn't work
at all huh? Your button object is not callable. Oh, you
know what? We really don't need lamda this thing. We can just go command equals player.
Let's try this. See if that works. zoop pull this over. 5058 clear 666985 there. Okay, so that seems to
be working well Let's clear the screen. Okay. So what do we want to do next? Well, let's
I guess the only thing left to do is really dive into these two. Now this gets a little
bit tricky. It's not bad. But there's a lot of different ways you could do this. And,
to tell you the truth, I didn't put a whole lot of thought into it, I just did with the
very first thing that I could think of. So you could probably do it more elegantly. But
we'll do it this way, just to see. So what we need to do is come down to our Add button.
And right now we're doing button clicks. So let's change this to button dot add. Alright, so we need to define button underscore,
like you call it dot underscore, add, and write that. Now. Here's the process, like,
let's run this thing again. Just to sort of talk about my logic here. So let's say we
want to add two plus two, right? Well, when we do that, when we click the two, it needs
to read that into a memory of some sort. So it needs to remember that we put two in there,
right. And when we click this, it needs to clear this so that we can type in the next
number, right. And then when we hit equal, it has to take whatever we've written in the
second time, and add it to that thing that it remembered from the first time. That makes
sense. So if we enter a two and click here, it has to remember to, because then when we
add four to it, then it has to take the four and add it to that first thing. And since
we're dealing with functions here, variables can't really be passed from function to function,
we're calling two different functions, the add function and the equal function. So how
do we pass those numbers? Well, we can use a global variable. So that's what I'm going
to do. So to do that, we would just come on over to our source code, go come back. There we go. So our button add. One thing we need to do is pass a number,
let's call this the first number is the first number somebody types in, right. So over here,
in button add, we need to pass e dot get right. Or we could come up here and instead of passing that number,
we could just pull it ourselves. He get so I think instead, yeah, let's do that. We'll
be a little simpler. I'm just making this up as I go. Okay, so instead of this whole
thing, we don't even need the lamda anymore, because we're not going to pass anything.
We're just going to call the button add function. Okay, so let's call this first underscore
number and set that equal to e dot get. And then we need to make sure that it's a
number, right? So Well, we can do that in a bit. Right? Now, we need to create a global
variable, so we call global. And let's instead of first number, I'm just going to call this
f num first known for first name, right? And we need to then assign something oops, changed.
I mean, f underscore num. Stop doing that. Okay, so now we need to assign that something.
So let's go f, num equals, and let's call, we need to make sure this is an integer, and
it's called first number. All right, so now, f num is a global, we can use it outside of
this function. And that'll work right. So let's go ahead and then clear that text box.
Remember, we need to do that. So we'll do the same thing we've done before he delete
and then zero and end. Okay, so let's save this and run it. We won't be able to see if
it works, but we'll be able to see if it's working. Let's see, at least so if we go five
plus, okay, it disappears. Okay, so that's working. So now, the only thing that's left
to do is to do our equal to one right. So let's come down here to our lambda section.
So button equal right here and change this from button. Click to Buttons equal. And same
thing, I don't think we need to send anything through a lambda, we just call the button
equal function. So let's come over here and define button underscore equal. Okay, so what do we want to do? Well, first
things first, we want to grab a variable. And let's call this second underscore number,
and set that equal to e dot and get, right. So this is going to whoops, this is going
to pull in whatever's sitting in that thing in the text box, right? So now we need to
do we need to, let's go ahead and delete just to make sure. And that there's nothing sitting
in that box. Now we need to let's create a variable called answer. Well, we don't even
really need to do that Dewey. We can just sort of E insert, let's go e dot insert. We've
done this before. So same things zero. And now what do we want to insert? Well, we want to insert
the answer. And the answer is our F underscore num plus. Let's say make sure this is a variable.
Or an integer. Second number. Look, right? So if num is our global, from our button,
add, yep. And then second number is that now again, we could just do this he can get, instead
of putting into a variable by like, put it in a variable, it's easier to read, come back
later, we can figure it out easier if we forgotten. Okay, so let's save this and run it. I have
no idea if this is going to work, but it should. So let's go five plus two, it should be seven,
right? Let's, let's keep going plus three equals 10 plus eight equals 18. Clear? eight plus two equals 10.
Pretty cool. So again, this is a very, very simple calculators, just doing one stupid
thing, adding, if we want to multiply, divide, do all the other things subtract, it becomes
a little trickier because we have the same equal to button. And if we look at our code,
the equal to how does the equal to button know if you're subtracting or adding or multiplying?
How does it know? So now, when we go say five plus two, we hit
the equal to sign it as well, the equal to sign knows to add, because that's the only
thing to do. So we're saying just add, but we're going to build out different buttons
for division, subtraction, multiplication, and when that happens, so if we go two, times
five, for instance, and then hit equal, how will the equal to button No, we want to actually
multiply or divide or subtract or add or whatever. That's the real big thing we need to look
at in this video. And it's pretty easy. We've already sort of seen the solution. When we
use these Global's we're going to do the same thing, we're going to create a new global,
and we're going to pass addition, we're gonna pass multiplication, we're gonna pass whatever
is we're doing for each one. And then we'll do an if statement just to go through the
equal to button. And also, if it's addition, do this, if it's subtraction, do that, etc.
So before we do that, we need to build a bunch of more buttons. So I'm just going to copy
this ad. And let's just come down here and we need three more. So let's call one of them.
Subtract, and then more to apply. I can Lord what happened there, multiply and then divide.
And then up here, we need a new command, we need button, let's call it button, subtract,
and call this button multiply and call this button. Divide, right. Okay, so we need to
also change these so instead of the addition sign, we need subtraction. Let's use this
star for multiply and for divide that now let's go that that's the sort of divide sign
right. So Okay, that looks pretty good. So now we need to come down here to our grid
system. And let's see where were we button equal to that's row five. So it looks like
we need button underscore y Subtract maybe dot grid, and then we want row one, row six,
I guess. And then column equals zero, no column span. So I'm just going to copy this two times.
And instead of subtract, we have what? The next one, let's go. Multiply. And this one
will be divide. So row six, column one and column two. Okay, so let's save this. Oh,
wait, first we need to get an error. Otherwise, we need to create these button, subtract,
one multiply and button divide. functions. Let's just go button subtract. For now let's
just go return. And same thing here. Well, actually, we can just copy this whole thing.
Two more times, instead of subtract, we want multiply and hear what divide sounds about.
Right? Okay, so let's save this. Give this a run, just to see that, you know, oops, actually,
we need to close the old one ere we go. Run it again. Oops, button, subtract invalid syntax.
But it got the Define. It's Friday people. That's
how we that's how we do Friday here in Vegas. Alright, save. Now let's run this. All right.
So okay, this doesn't look great. This needs to be a bit bigger. Let's just do that. So
the subtract one needs to be a little bigger. So subtract, or we add, subtract padding,
let's go 40. Save this. It's just sort of what you do with kinter. You kind of mess
around. Okay, it's still not quite. So let's go 41. There we go. Save this. So run. Okay, so not great. And there's a lot of space there.
So let's add one and one to each of these. So instead of 39, let's go 40. And let's go
40 for this one to save this. Run it again. All right, that's looking much better. Things
are lining up mostly. Let's go one more for the divide one just to see, or anyone. lucky
number 41. So pull this up. Okay, that's looking pretty good. I think we'll
just leave it like this. Now these buttons don't do anything yet. We need to actually
build that functionality into it. So first, let's go up here to our button add right.
So here, let's create our new global we want to global, and we want to call it math. And
for button add we want math to equal, say addition. Right? So everything else pretty
much stays the same, right? So let's come up here. And let's just copy all of this to
our subtract. And here. Instead of addition, let's call this subtraction. But everything
else is gonna stay the same, right? I think so. Finally, not finally. But for multiply.
Let's go mall duplication. Right? And then for division. Let's call this division. Okay,
so I think that will work. Now, we need to sort of play around with our, what do we call
it? slick here button click. What do we got? What's the equal to button equal? So where
is our button equal? Err, it is. So here, this is what it used to be right? We just
take this number, which probably will stay the same. And then we delete, which probably will stay the same. And then we insert
the two numbers together f num, which is the first number and then whatever the second
number is, and before we just had this ad, right? Obviously, we can't do that anymore.
Because depending on which button is clicked division, multiplication, subtraction, or
addition, it will do those things. So how do we do that? Well, we need a basic if statement.
So very simple just if math equals Remember to equal to signs for conditional statements,
and then what's the first one? Let's call addition. And then, if that's the case, we
want to do what we did before, right? Just add the two together and then pop it up on
the screen. Right? So that seems to work. So let's just copy this a few more times.
Oops, there we go. 1234. Does that seem right? So addition? Let's call this one subtract.
subtraction, if I can type. More duplication, you can see how the text editors
filling this in, and vision. And we don't need this one too many. Okay, so subtraction,
we're going to subtract for multiplication, we're going to multiply, and for division, we're going to
divide. Alright, so is that gonna work? I think that'll work. Let's fire this thing
up and take a look. See what I did wrong. Almost certainly something. So let's go two
plus three equals five. Yes. Let's go two times five equals 10. Yes, that works. Let's
go 10 minus three equals seven. That seems to work. And let's go 10. pips, clear 10 divided
by two equals five. And notice it's 5.0. It's converting this to a float, which is kind
of weird, but necessary, because look, if you clear this and go 10 divided by three,
right? The answer is 3.33335. It's definitionally. a decimal number, so it converts it to a float
for us, which is kind of cool. So all right. I think that works. Right. Now, this is ugly,
right? I understand that we didn't put a lot of thought into making it look good. But you
can do that go through here, make the buttons, different sizes, different colors, you know,
I like to pull up the calculator that comes with Windows. Right? So maybe, as we haven't
talked about how to make menu stuff, and he will talk about that in the coming up videos
here. But maybe try and make it look like this if you can, for the most part, right?
See if you can do it. There. Look, there's other things here. There's square root, there's
percentage looks like fractions, all kinds of stuff. So maybe, as an exercise, see if
you can make yours look like this and act like this. That'd be kind of cool. All right.
So I'll leave that to you. I'm more of a coder guy, and not really a design guy. So mine
looks kind of stupid. But I think you understand the functionality, how to do these things
with the code. And this is a really simple way, there's probably lots of different ways
you can tweak this equal to button to work. But just off the top of my head, I was like,
Oh, just do an if statement. That'd be quick and easy, right? So that's what we did, created
our global and just kind of works. We're gonna look at icons, images and exit buttons using
kinter and Python. Okay, so we finished up our calculator app, let's create a new file.
And I just put the basic, you know, kinter startup code that we've always used. And let's
go ahead and save this. As What do we want to save this as doesn't really matter? Let's
just call it images. Okay, so first thing, you'll notice I put the title as learn to
code academy.com. put whatever you want. So now the first thing we want to do is add an
icon. And by icon, let's see, can we just run this real quick. So let's go Python will
recall this images.pi. So, right now, this little feather, that's an icon, right? That's
a little little image that's up at the top of every program you've ever seen. So here's
our GUI or terminal thing, there's a little icon up there. Here's our Sublime Text Editor.
There's a little icon up there, all windows type programs have little icons at the top.
So how do we do that? Well, I've taken an icon, which is an Ico file dot Ico, it's basically
a PNG file. That's usually like 16 by 16, and width and height, or 32 by 32 or 64. By
64. It's you know, it's a square thing. And usually you create them using Photoshop or
whatever, I'm not gonna talk about how to create them. In this video. I'm gonna assume
you have one and you're ready to use it. So how do you use it? Well, it's pretty easy.
Just right up here at the top. I like to put it right underneath the title. Let's just
go route dot, icon, bitmap, be it ma p So that's what we're calling an icon bitmap.
And then you just pass into the parameters, the location of the file. Now I'm going to
put this mine is in c, c, forward slash gooey, I put it in the same directory. And I called
it kotomi dot Ico. Remember, these are icon files. So if we save this, and run it, let's
pull it over. You can see now we have a little kotomi icon, this is the same icon that I
use on my Kodi website, on the website is called a fav icon. In real life using programs
like this, it's called just an icon. So very, very simple. Very, very easy to do. And that's
that. So what else do we want to do? Let's now very quickly talk about an exit button.
I'm not sure if we looked at this earlier. But it's really easy. Let's just create a
button like we've always done, I'm going to call a button quit. And it's going to be a
button, and we want to see where we go. And we want to put it on our route thing. And
then the text for this, I'm just going to type exit program. Alright, and now the command
is root dot quit. So root is obviously this root instance of this TK class that we've
created. Anytime we do anything we call root, right? You just throw a root dot quit Python
is an object oriented language. So we can do object oriented things like putting a dot
and then some other thing on it. That's how you do that. So now we can just go button,
quit dot, let's just pack it in there. Alright, so let's save this and run it. Boom, grab it and pull it over. So he says have,
you know just this one little button, and if we click it, boom, the program ends. Very,
very simple, very straightforward. So that's all I'll say about that. Let's push this down
to the bottom here. Now, I want to talk about using images and using images. At first, it's
a little tricky because you have to import some things, and you have to do some stuff.
So kinter has a built in system for using images. And you don't have to import anything,
you could just do it. But it only supports two image types. gif, gi F, which nobody uses
anymore. And some other thing that I don't even remember p n m or something like that
doesn't matter. It's an obsolete image, you're never going to use it. So to use real images
like JPEGs or PNG files, we have to import a whole other module, and then do some a little
bit of Voodoo. So the thing we need is called pi L and pi L stands for Python image library.
And it's old, and it doesn't really work anymore. So there's a new one called pillow, it's a
fork of pill that they improved upon. So we're going to use pillow, and we need to install
pillow, but we'll reference it here as pi L. I'm not sure why that is kind of weird.
So you would think it would be from pillow import. And then the thing but it's not. It
is from capital P capital I capital L. And we want to import image t k, capital T, lowercase
K, and also image image. Okay, so that's how we reference it. But we have to still now
install this on our system. So we do that on the command line. And we install this like
we install anything I'm gonna go pip install PIP is the Python package manager thing, right
comes with Python. And if this doesn't work, it means you didn't install Python correctly.
When you install Python. When you install Python, there's a little screen that pops
up right at the beginning that says Add Python to path and you need to check that box. If
you didn't, Pip won't work. If you did, Pip will work. So if this doesn't work for you,
you're gonna have to uninstall Python, go back and re install it and check that box.
Or you can google how to add Python to path windows. And you'll see a tutorial on how
to do it manually. So pip install and we want to install pillow p i ll o w capital P, I think Yeah, so I've already installed it. So I'm
getting a thing that says it's already been installed, you will get something else that
shows it installing a little thing will pop up on the screen like you know downloading
type deal. So we can make sure this has been installed by running Pip. Pip freeze if our
EEZ and if we look through here, all those things I have installed, there is pillow right
there. So okay, that seems to work. Let's clear the screen here. So now we've installed
it. We're referencing it from our program here. How do we actually use this thing? Well, it's
a little bit more complicated than normal, but just this is like one extra step. It's
pretty simple. So I'm going to create an image I'm going to call it image IMG Or let's just
call it my IMG, right. And it's going to be an image, TK, dot photo image, right. So that's
sort of similar things we've seen before. Like with button, we call the button. Here
we're calling the image TK, because that's this thing here. And then inside of that we're
calling dot photo image, right. So in here, we want to go image dot open, because we're
gonna open the image, and then just pass in, whatever your thing is. Now, I have a picture
called aspin dot png, and I copied it to our GUI directory. So if we pull this up, so this
is the directory, we've been saving all our kintra files and right, so here's that icon
that I saved, I saved it into this folder, and here's aspin, I saved it into this folder.
So since it's in this folder, I don't have to put this stuff on there. In fact, I really
don't need to put this stuff there either, I just did it to show you. So since it's in
the same file, or in the same folder as the program, we could just leave it like this.
So right? Usually, everything in kinter is a two step process, we define the thing, and
then we put the thing on the screen. So this is a three step three step process, we define
the image, and then we put the image in something else. And then we put that something else
on the screen. So you can add images to just about every widget in kinter, I think I think
you can add them like the buttons, make them the background of a button of a text box,
text box of anything. So I'm just going to use, I'm just gonna call this my label, create
a little label, and set this equal to a label, we've done
this before. And then inside of here, it's a little bit different. We're just gonna go image equals,
and then my oops, my image, right. So now we've sort of defined this label, now we need
to just put this label up on the screen, so we can go my, my label dot pack, pack it up
there. Okay, and that should work. So let's go ahead and run this guy. There we go. Now,
and it worked. Here, we, this is a picture of me and my Husky aspirin, she is hurricane.
That's pretty cool. So you, it's just that easy to add images to your In this video,
we're going to create this cool Image Viewer. And it's just it's a pretty simple Image Viewer.
But you can see we got buttons, we can scroll around through different pictures, we can
go forwards, we can go back, that button disables when we get towards the end. And it's pretty
cool. Okay, so I've created a new file. And this is basically just the code that we worked
on in the last video that shows one image up on the screen, the big change I made was
I created this images directory inside of our gooey directory. And the reason why I
did that is because we're gonna have a lot of images in this program. So when you have
more than one image, it's always a good idea to create a separate folder for those images.
And if we pull this up, we can see here it is just images. And I've put a bunch of images,
just random pictures in there, it looks like I've got five of them. And we'll take a look
at that in just a bit. So I come up here and let's save this new file as what viewer that
py. Sounds good. And let's run Python viewer.pi and see what we have. We just have it looks
like just that image. Looks like I forgot even to put the exit button there. So let's
go ahead and do that real quick. Well, we'll do that in just a minute. So in the last video, we just had one image,
right, so it's pretty simple to work with one image. And that's just this image right
here. Now we want a whole bunch of images. So I'm just going to copy this, and let's
go to three, four, or five. And I'm going to name them image 12345, just to make it
easier. And so the images are aspirin and aspirin one, aspirin two, and then me one. Me too. And me three, if I can type three. Alright,
so there's lots of different ways to sort of scroll through things. But in Python, a
really easy way is just to use a list. So that's what I thought we would do here. And
I'm just going to call this an image list. And then set this equal to and it's just going
to be a basic Python list. And let's go my underscore image one and I'm just going to
copy this and paste it 2345 times. Okay, so then we need to change this to 234, and five.
And you're probably familiar with Python lists. If we want to access an item in the list from
now on, we can just call image underscore list. And then the number of the thing and
remember, lists start at zero. So this is the zero with item. This is the first item,
second, third, fourth. So if we want, say, for instance, this one, that would be 012,
we would call image list two, right? So very easy way to sort of scroll through any sort
of list of things. That's why it's called a list. And this will make it a lot easier
for us to cycle through those, as we click the buttons, we'll just, we'll just access
the next item in the list. That'll be pretty easy. So okay, so we've got this my label
and it's my image is start out with my image one, since we changed the name of this. And
instead of pack we don't want to pack anymore. Since we're doing more than one thing, let's
create a grid. And let's go row equals zero, column equals zero. So we want this to be
the very first thing. And we want this to go columns span equals three. And the reason
why we're going to do that is because below the image, we're gonna have three buttons,
a back button, a quit button, and a forward button. And each of those buttons will be
on its own column. And we want the image to span all of those columns. So okay, that's
pretty good. Now let's create our buttons as well. We want to create our buttons right
here. Now, let's do the buttons. Down here, we'll see why in just a minute here. So what
do we need, we need a back button, and a forward button and an exit button. So
let's go button underscore back and set that equal to a button. We want it in route and
we want the text to equal what two backers think. Now we're gonna have a command for
this, but we're gonna put that in just a minute. So let's go this and this. So this, let's
call this middle one button, exit. And let's call exit program. And for here, we want the
command to be what route dot quit, we'll learn how to do this in a previous video. And then
for the last one, we want buttons change enabled us to forward. And we want this to have arrows going forward. And like
I said, these are going to have commands. But we'll mess with those in a minute. Now
let's put these on the screen. Let's go button back dot grid. And then what row equals one,
column equals zero, because our image is row zero, so below that is row one. And so button
underscore exit dot grid, that will be a row one column equals one. And then finally, button
underscore forward dot grid. We want this to be row equals one and column equals to
look right. Let's save this and give it a quick run. Make sure we didn't mess anything
up. We probably did. Because it's Friday here in Vegas. Okay, so we got exit program. I
don't really like that capitalized, we'll change that. Right now. Nothing happens, the
exit button works. So that's cool. So let's change this real quick to exit. Oops, maybe spelled right exit program lowercase.
So okay, we've got the framework here. Now we need to start kind of building in the functionality
of the buttons. So what we're going to do is we're going to create a couple of functions
to handle the buttons have forward function and a back function. And actually, let's just
come up here. Where do you think we want these right under the label grid, let's say we want
these to go right at the top. So let's go define forward. If I could type, and let's
just return something and define back and call this return something. Okay, so we've
got these things. Now let's head over to our button. And let's add these commands. Man
equals now we're going to need to pass something through these buttons because every time we
click the Buy We needed to know that it's the next one. So we're going to start out
with, you know, a specific one, then every time we click the button, we need to add one,
and then pass that through. So let's go, we need to do a lambda, lamb da, we've learned
in the past, anytime you want to pass something through a button command, you have to do a
lambda. And this is the back buttons. So let's call this back. And we're going to pass something
or other we don't know what yet. And for the forward button, let's go command equals lamb,
lamb da, and then we're going to call forward, and then something. Okay, so what do we want
to pass through these things? Well, actually, the first time, we don't need to pass anything
in the back. So let's take out the lambda. And let's just call back. Why is that, because
when we fire up the program for the first time, it'll already be on the first image.
And we don't want to be able to click back. So we don't need to pass anything in that
first time. So we can just leave that like this. But the forward one, we want to pass
two, and we'll see why two and not y one in just a minute. But think it through like the
first one, the first image is image one, right? So we want to the back button, or we want
the four button to go to the second image. So we're just gonna pass two, right? So up
here in our function for four, let's start to build this out. So what do we want to call
this image? image number doesn't really matter what we call it. Now, we need to do things
in this function that work outside of the function. And we've done this in the past
using global variables. So we're going to do that again this time. So let's call it
global. All of our three things, we basically have three things my label, global, button,
forward, and global button, back, and we're going to do the same thing in our back functions.
So I'm just going to copy these in right away, right. So you'll see exactly why we do this
in just a second. So I want to explain it now the first thing we want to do when this
thing gets called is we want to take the image that's already there and get rid of it, right.
So when we click forward, the next image will show up. But right now, the last image is
still there. So they'll overlap, and we don't want that we want the first image to disappear.
And to get rid of that we use this grid underscore, forget, it's just an internal function that
the grid system can use to sort of get rid of something. So our images in my label, so
we're just going to sort of delete that from the screen. So let's save this and just see
if that worked real quick. So let's pull this up. So here's the first
image. If we click the button, boom, it disappears. So so far, so good. That seems to work. Now,
we need to tell the program what the new image should be. So that's my underscore label. And it's going to be we're just going to define
the whole thing all over again, right? So it's image equals now What image do we want?
Well, we need to reference something from our list of images, or image list list. So
that's this. But now which one do we want? Well, when we first click the button, we're passing
in the number two. So this image number is number two. But we don't want the next number
to be the same. We want it to be the next number. So that's plus oops, plus one. So
the image we want to show is the current image plus one, which in this case, is going to
be no it's going to be minus one, right? Yeah. Okay, so we passed into you would think we
want the second image, but don't forget that list, start at zero. So the second item in
the list, this thing is actually called the first item. So since we passed two in here,
we need to subtract one to get the one one if item, which is the second is very confusing,
but think it through it'll it'll make sense, right? Okay, so that works. Now. We need to,
strictly speaking, that should put the next image on the screen. So let's see if it does.
Let's call this Click the button. Boom did not work. Why not? Oh, because we defined
the label. But we didn't actually put it up on the screen yet, right? So we can just come
over here and copy this. It's going to it's going to always be the same, right? So okay,
so let's save that that should work. Let's run it and see why I like to run things as
we're coding. So you catch these little things. Boom. All right, that works. Okay, so far,
so good. Now, you'll notice when I click the Next button, again, it didn't go forward,
why not? Because we now need to update it, it's got the old one on there, the two, right,
so we need to update that. So let's do that right here. Let's call spacer button, underscore
forward. And that, oops, that equals what a button just redefined the
whole thing all over again, root. And we want the text to equal to put two forward arrows,
and we want the command to equal lamb. I can type lamb, da, there we go. Lambda, we want
to call the forward function. And we want it to be whatever this number was. plus one, why because it's the four button. And every
time we click it, we want the Next button to the next image to be sort of ready to go.
And then when you click it, boom, the next image will be ready to go in the button itself.
So okay, that seems to work. Now, we also need to do button underscore back, we need to update the Back button as well. So that's
route, the text is going to be two back arrows. And the command is going to be lambda MBDA.
For some reason, I can never remember how to spell lambda back. And then here, it's
going to be again, the image number. But we want the previous one, right. So instead
of plus one, it's minus one. Okay, that should work. Now, oops, we need to actually put those
guys on the screen. So I'm going to come down to see button back button forward. Just copy
these, because their position never changes. Right? back and button forward. Alright, so
let's save this and see if that worked. So Boom, boom, boom, boom, up. Last one, it disappeared.
So one thing we need to also do is, we need to do something to see Hey, is it the last
button is it the last image, if so disable it right, so that you can't click to the sixth
damage, because there isn't a sixth damage. So we're going to need to do that. Let's just
put this right in here don't really matter. Let's go if and then image underscore number
equals five. Image number is this image number that we're passing in the image number, right?
If that's the case, then we need our button, underscore forward to equal let's just define
this as route. And a text equals to forward things, and the state equals disabled. Alright,
so let's save this and run it. See if that worked. Boom, over, so first image, second
image, third image, fourth image, fifth image. And sure enough, it's been disabled. And we
can't click forward. So that works. So now we need to work on this button. We haven't
done anything for it yet. But it looks like our forward button is completely done. So
let's come over here and I'm just going to grab this grid forget because the same thing
with the Back button, we're going to want to delete whatever image is there before we
put in the new one. And I think we can just grab all the stuff from up here. And paste. We just need to make a few changes. So my
label that will stay the same right? I think yes. The button forward will stay the same
and the button back will stay the same and that Because let's see, let's look at our defined forward
what we're doing here with the Back button. We're taking whatever image number and subtracting
one. So when this starts, it's already subtracted one. Now, if we click it again, we need to
just subtract another one. But all that stays the same, I think. Yeah. All right. So then
we need to just put those things up on the screen like we've done before. So I can copy
this exact same stuff. Alright, let's save this and run it. See if that worked. We went through that fast, but right off the bat, this is not disabled, we
need to disable that off the bat. So we'll do that a second. So forward, back up, that
doesn't work. forward, back. Okay, so what has gone wrong here. Back image number nine. Back takes zero positional arguments, but one was
given. Oh, we forgot to put our image number in there, okay. And pass that that variable.
So let's run this again. So forward, back, forward, forward, forward, forward, back,
back, back. Okay, it seems to work. But when we do that, it starts at the end. So we need
to right off the bat, figure out how to disable that. So let's come down here to the very
beginning, when we very first created that back button. Let's just go state equals disabled.
Save this, run it again. So now, right off the bat, it's disabled, so it won't
go any further. And now this one's disabled. Now, if we come back here, back Back, back,
oh, if we scroll and go back, it's still enabled. So what we need to do is the same thing we
did up here, we just need to do it down here. So let's pull it right in here. And go if
image underscore number equals and remember, double equal to sign is what you use for a
conditional statement. And so if that number is one, which is the first one, then our button
back, equals, just find this thing again, root, the text
equals to fact things and the state equals disabled. Okay, so save this. Give it one
more run. This should do it. We hope. So it's disabled. Here we go. All whoops, where'd
you go? Come back. We got all the way to the end that wants to say, Well, if we go back,
boom, that one's now disabled. forward, back. Okay, well, that seems to be working. And
that's it. So we went through that very, very quickly, you might have to go back and watch
the video again, posit a bunch of times. But the the main things to sort of keep in mind
is we created all of our images into a Python list. And if you're familiar with lists, it's
just a normal Python list. There's nothing t kinter. about this. And every time we click
a button, we're just going to reference we're going to create a little counter and just
reference the next item in that list. Show it up on the screen. Forget the one that was
there. Previous we haven't looked at this before this is new. Everything else we've
done in this video is pretty much stuff we've already learned except for that little thing
right there. And then every time we click that button, we just need to update the buttons,
which is why we created these Global's so that these updated buttons will work outside
of the function. And that's it. Pretty simple. Pretty straightforward. Granted, this is a
pretty cheesy little app, but I think it's a nice little exercise, and yeah, pretty fun. And
this video, we're going to create this status bar here at the bottom that sort of updates
dynamically as we click the buttons. So the status bar is actually fairly simple. We're
just going to use a label. We've already used labels in the past lots of times we know how
to do that. But we're going to take a little twist to it. We're going to add a few new
things that you haven't seen before in order to sort of Make it look like a status label
in order to update it dynamically. And in order to sort of stick it to the bottom of
the screen like this. So to get started, let's just create a new label, I'm going to call
it status and set this equal to label. And then we want this to be in route and we want
the text to equal what image one of five. Okay, so let's go ahead and save this. And
what I've done here is I've just created a new file, and I just copied all the text from
our last video. If you didn't watch that video, go back and watch it to see where all this
code came from. So now we can save this. And we're just going to save it in our GUI directory,
and I'm going to call it status dot hot. Okay, so right off the bat looking at this, this
is not great, right? We're putting image one of five, how do we know there's five images?
Well, we know because we just built this. And we know there's five of them. But it's
conceivable that you won't know how many images there are, if your program has hundreds of
images or millions of images, you're not going to go through and count them all by hand.
That would be crazy. If it's dynamic, and you're adding more images as you go, you're
not going to know how many images so we need to figure out a way to do this programmatically
without just hard coding in there like this. So what we can do is we can call the Len function
le n, and that'll give us the length of a thing. And what thing Well, we can just take
our list here or image list and run a Len on it. So let's just do that, let's concatenate
and let's call the Len function. And then we just pass in image underscore list. Right?
Now, this will almost work but not quite, because this returns a number, because it's
counting how many images or how many, you know, items are in this list. And there are
five, well, five is a number and you can add a number to a string. And this is what that
is right there is the string. So we need to convert this to a string. So we can call the
str function, the string function, and just pass that in. Okay, so that should work. Yeah,
so let's throw this up on the screen and see if it worked correctly. I'm gonna go down
to the very bottom, and let's call status dot grid. And we want this to be in row one,
row two, and column equals zero. And we want this to span all
three of our columns. Okay, so let's save this and run it, make sure it worked correctly.
Close the old one. clear the screen. Okay, so python status.pi. pull this up. And okay,
so it's correctly calculated that there are five images. But you know, nothing happens
yet, because we haven't programmed it to. Also it's down here at the bottom, but it's
right in the middle. And it doesn't have a border or anything like that. So we need to
kind of fix that. So let's close this. And come back up here to the top where we've defined
this thing. And let's do some things. First, we want to create a background or a background
a border. So to do that, we can call the BD function of the widget and set this equal
to one, right. We also want it to sort of look like it's sunken down a little bit, because
status bars usually are sort of sunk in a little bit. So we can call relief, R e, l,
I E, F i before E, except after C, and we want this to be sunken. Right. So let's save
this and just give it a quick run and see if it worked. Okay, it's definitely got a
border and is definitely sunken. And one thing you'll notice it is there's some space between
these buttons. I forgot I did that. And I didn't tell you about it. So to get that I
just came down here to the very bottom of our program. And I found the last button button
forward and I added a pad y of 10 just to give it that little 10 pixels or whatever,
of space between there because otherwise we close this. And let's see, let's just take
this off real quick. Save it and run it again. You can see it scrunched right up there. So
we don't like that too much. So I'm going to add this back and save it. So okay, so
far, so good, but it's very small, and it's right in the middle. So how do we stretch
it all the way across the bottom? Well, we need to add something called sticky and
I'm not sure if I've talked about this in other videos yet, but the grid system impact
you for that matter has a kind of a navigational system them. And it's based on sort of a compass
north, south, east and west, right? So north is up South is down, East would be to the
right and West would be to the left. And so we can, we could tell this to stretch in any
direction. So we want to stretch left to right. So that's from west to east. So to do that, we go w plus e, right? Let's save this and run it. See what that did. Okay, so very cool. It's stretched all the
way across, but it's still in the middle. So how do we change that? Well, we come up
here to the label. And we can add a couple of things here, we can anchor this, underscore,
or lowercase a and CH, O r, we can anchor this in a direction, so we want it to be on
the right side. So we would anchor that east. So if we save this and run it, we can see, sure enough, now it's over here.
Very cool. If we wanted it over here, we could just change this to W for West, save it and
run it. Boom, now it's over here. Very cool. And pretty simple. So let's go ahead and exit
this. And I'm going to change this back. I like it the other way. So I put it on East.
Save it. Okay, so it looks good. It's where we want it to be, it's anchored in the right
spot. Excuse me. Now we need to create some functionality. So I'm going to copy this.
And what we need to do is whenever we click a button, either the forward button or the
back button, we need to update our label. So I'm going to paste this in here. I'm also
going to come down here to the bottom and grab this because we want this to update whenever
clicked button wanted to update on the screen. So we need to paste that in here. Okay, so
now we need to fix this thing right here. It's showing image one of whatever. Now this
part updates dynamically that already works. But this part does not. So I'm going to delete
this. And I'm going to put a quotation marks. And we want to concatenate a couple of things.
So what do we want to output? Well, we want to output whatever number that we're currently
on. And luckily for us, we already have that number, we passed it into this function at
the beginning. So whenever we click this button, we're already passing that number in. So I
can just copy this, and come down here and just paste that in here. But remember, again,
this is going to return a number an integer, and you can't concatenate and an integer with
a string. So once again, we need to convert this to a string using the str function. We
just passed that into that. Okay, so that should work. Let's save this and run it just
to make sure that it did. I make a lot of mistakes. So I like to run things often. So
okay, 25354555, and then we go back, it doesn't update. So we need to fix that, obviously. And to
do that, we just need to make the same change we just made to the forward button, just need
to make it on the back button. So I'm just going to copy this come down to the back function,
paste that in there. Give some space here. And if I was a good coder, I'd put some comments,
you know, update status bar or something, right. But I'm not particularly a good coder
when it comes to that sort of thing. So okay, let's save this and run it. And hopefully. So if we go forward, we're on image two, if we go back back to
image one, if we go all the way to the end, or on image five of five, if we then go back
4321. Alright, so seems to work. So that's at least one way to create a status bar. It's
probably not the only way. But it works really, really simply and really easily. The programming
to create the functionality of it is really straightforward. Really, the big thing that
we learned is this sticky, W and he and what else this border thing and the relief thing and the
anchor thing I guess those are sort of knew, but those are just basic label things really.
So very cool. I want to show you how to use frames with kinter and Python. Okay, so I've got a new file open
and I've just got the same sort of standard code that all of our projects start with and
let's go up here and save it. As What about frame.pi? Just frame. Okay, so frame.pi. Now,
what we want to do is create a frame. And a frame is just what it sounds like it's a
little like box has a border, you can have a label on it or not. And it's just sort of
used to just keep things organized in your app. So you might have different sections
that you want to sort of put together visually. And a frame is a good way to do that. So frames
are really easy to create. It's just a widget like all the other widgets, and we create
it mostly the same way that we create other widgets. So I'm just going to call this frame,
you can call it anything you want. And it's called the actual term is a label frame. Right?
So we want this in root. And let's say we want the text to equal. This is my frame,
I don't know, right? Now, we can also give this some padding, let's go pad x equals five,
and had y equals five. And we'll play around with these patterns in a minute to show you
exactly what they do. So now we want to put this on the screen. So let's go frame. And
let's just pack this in real quick here. And let's give this some padding. So pad x equals
let's say 10. And had y equals 10. And we'll see sort of exactly what this does, with the
padding. Why this is 10. And this is five in a little bit, once we get this thing built,
we play around with it a little bit. So let's see if we save this, I don't think this will
actually do anything, because we haven't put anything in the frame yet. But we can run
this to see, let's go Python. Notice I'm in my C four slash gooey directory where we've
been saving all our files so far, as call this frame.py. Run it. Yeah, so we pull this
over. It doesn't really do anything yet, because we haven't put anything in the frame. So that's
the next thing that we want to do. So we can do anything we want. Whenever we put anything
inside of this, we want just for purposes of showing you how to do this, I'm just going
to create a simple button. I'm gonna call it B. So button. This is a button widget.
We've done this a zillion times already. So we want not now normally, we would say put
this in root, right, our root container. But now we don't want it in route, we want it
in frame, which is this thing right here, we were saying put this in the frame, right.
So other other than that, it's basically the same, we could just go text equals, don't
click here, right. And then like anytime we want to add this to a thing, we could just
pack this in there. Okay, so let's save this, come back here and run this guy. And here
we go. Oops, drag this over. Here, we see this is my frame. And inside of it is a button
that says don't click here, the button doesn't do anything, because we didn't tell it to
do anything. But yeah, that's pretty much it. So notice this frame. That's kind of cool.
Let's close this and run it one more time. Now let's play around with this. Remember,
we had different paddings pad x and pad y for the frame itself. And then when we packed
it, we we gave it some padding. So look at this. Let's pull up the code again. pull this up here. You'll notice when we packed it, when we pack the frame
whoops, disappeared. We gave it 10 and 10 for pad x and pad wide. And we've done pad
x and pad y before it pads on the x axis and the y axis. And you notice that's on the outside
here, because this is 10. On the inside, we put five and you can see that's like that.
So let's let's play around with this. Let's go head x 100 and pad y 100 really make this
dramatic. So let's save this. I'm back here and run it again. And you notice, boom. You
have padding x and y as 100. So this, you know packs it inside of the the outside container
here, right? That's interesting. Or we could do the opposite. But that back and let's say
oh had x and pad y inside of let's just say 50 run this again. That's a little better.
Now we've put some padding inside of the frame. So that's really all you have to keep in mind
with this padding when you create it. Right when we create any widgets. It's always a
two step process. We create the widget and then we put it on the screen. So in this one
we created the widget. And when we do that, when we give that thing padding that goes
inside of the frame, and then here, we put it on the screen, and that pad x and pad y
goes outside of the frame. So just sort of keep that in mind. Now the last thing I want
to talk about when it comes to this, and this is kind of weird, right? So check this out.
Normally, we just pack things when, you know, we don't care, right? Otherwise, we use a
grid, and then we've positioned things. The thing about pack and grid is you can't do
them both, you can either do pack and pack or grid and grid. So you notice here, we did
pack here and pack here. Well with a frame, that's not necessarily true anymore, you can
do a grid inside the frame. So for instance, we can go grid, row equals zero column equals
zero, we save this. Now normally, we would get an error if we did this. But now we pull this over, and boom, it works. Now it's positioned
in the same spot, because there isn't another thing in there. But we can create another
button to show you just to prove one last time, so we could go, I don't know be too.
I'm just gonna copy this whole thing. And write, or here, don't click here or here.
Okay, so B to dot grid, we want rho equals one and column equals one. So we want down
and over, right. So if we save this, run it, boom, you see, sure enough, we can play around
with the grid system inside this frame. Even though for the frame itself, we packed it.
Very cool, very interesting, something to definitely keep in mind. Now, one last thing,
I said that that was the last thing, but we have one actual other last thing. And that's
this little label right here, this is my frame, we can actually get rid of that as well, just right here. remove it completely. And
if we do that and save it, we get this kind of a cleaner look, right? Very cool. So think
of frames, use them all that you're probably going to use them all the time. I mean, there's
always times when you have different sections of your screen that you want to sort of keep
separate, you might have all the buttons on this side and a frame and all the form things
on this side and a frame. And then you might have another frame where there's images or
who knows what, but sort of separating things out visually is always a good idea. And that's
how you do it with frames. In this video, I'm going to talk about radio buttons, which
are just these sort of round buttons with text next to them. They're used for forms
and all kinds of other things very useful. And they're a little bit trickier than some
of the other widgets we've looked at in the past. So we'll go ahead and take a look at
that in this video. And I've created a new file, I call it radio.pi, I saved it into
our GUI directory where we've saved all of our code in the past. And this is just the
basic sort of starter texts that we've used in all the other courses to create just a
basic, you know, framework with kinter. So what we're gonna use is a radio button widget.
And to do that we just call radio button. And then much like some of the other ones
we've done in the past, we will go route. And then for the text, we go equals. Let's
go option one. And here's where it gets a little bit different. We're going to create
a variable. And kinter has sort of its own variables, hinter variables, they're slightly
different than Python variables. And I'll show you exactly what the difference is in
just a minute. But we're going to assign a variable to each of these buttons, so that
we know if somebody clicks on the button that gets put into the variable.
So then we could take that variable and do stuff, you know with it in the future based
on which button or which radio button was clicked. So this will make sense in just a
bit. So let's call this our, let's call it our right, you can call it anything you want.
And the value. Let's put this as one. So this is option one. So when somebody clicks on
that we want the value to be one because it's option one, you can put anything you want,
but we'll just do one. So we're also going to need to do some other stuff to this, but
this is work just for now. Now I'm just going to pack this on the screen. Usually we do
two sentences or two lines of code one to create the thing and then one to put it on
the screen. But we've seen in the past that we can do this all in one line just by going
calling dot pack on the thing, and that should work Alright, so I'm going to just copy this
and create a second one. And we'll call this one, option two, and the value from this will
be two. And we're just going to pack this onto the screen. So let's see, I think that
is pretty much it. Now we need to sort of define this variable. So like I said, this
is going to be a kinter variable and kinter variables are a little bit different. They
look the same as that you just call them like you would a Python variable. But here, we
want this to be an integer, because the value we've assigned to it is either a one or a
two, and a one or two is an integer, right? So the variable needs to be an integer variable,
because we want to do number things to it, if we want to do number of things. So we're
going to call int variable. And then this function, and this function allows kinter
to keep track of changes over time to this variable. So when we click on a thing, it'll
know that, and I think we've looked at this in the past with other things, in order to
use this, we don't just call the our variable, we call our dot get, remember, we want to get whatever the variable
is at the moment. So if somebody clicks on a different radio button, we want to be able
to get that right. So that's why we're using these instead of just regular Python variables.
That's just sort of a function of radio buttons. So let's see, we have one, we have two this,
now we've done a one and a two here, right? If we wanted to pass a string into this, we
could call like this, right? And then instead of integer, it's str variable. It's a string
variable, right. But in this case, we want to do integers. And after I do this one, I'll
show you another way to do this, because there's a couple of ways to do it. And we'll see this.
So let's save this as radio.pi. Let's open up our thing here. And let's run radio.pi.
Oops, what have we done, name radio button is not defined that I spoke button wrong.
Oh, I did to be lowercase b. Alright, so save this, come back here and run it again. Okay,
hold this over. So you see, we have option one and option two. And this works, but it
doesn't actually do anything. And we can't really tell if we've done anything, right.
So we need to have this actually do something so that we confirm, confirm that we did this
correctly. So I'm going to create a quick label, let's just call it my label, and set
this equal to a label. And we want this on route. And we want the text to equal what
our dot get, oops, our dot get. Now we want to go my label dot pack. Okay, so let's save
this. And this shouldn't work yet. For a specific reason. And we'll see. Right off the bat,
we have zero, because we haven't actually set this yet. And we can if we want, so we
can close this, come back here. And we can go our dot set. And inside here we could say
to For instance, if we save this and run it, you remember these Python or these kinter variables, you
can set and you can get I think we looked at that in a prior video. Because see, now
it's two and two has been selected automatically. That's what happens when you set it. Alright,
so if we go here, this doesn't yet change because we haven't created a function to update
this thing if it changes, so we can close that and do that right now. So let's create
a function we'll define and let's call this clicked, I don't know, doesn't really matter. And now here, we want
to change this. Just paste this in here. And we want to pass no value. And now this will
be value. So what we need to do is when one of these is clicked, we need to pass that
into this function and then update our label. And we've seen this already in the past by
using the command. We use this when we create buttons and do that so we can go command and
we can go Alam de we've done this in the past. And so what do
we want here? We want to call clicked and we want to pass in here are our back Are you
but we need to get it. Right. So instead of here we go our dot get
and pass that. So then I think we could just copy this whole thing and paste it onto the other radio button as
well. Okay, so if we save this, hopefully I did that right? Certainly all get jumbled
together. Alright, so we see it's already on two, because we've set it to be two. If
we click on one, boom, one appears, we click on two, again, two appears. Very cool, pretty
easy. And we could do the same thing with a button real quick. Let's just throw a button
up here. And let's go, my button equals a button. It's in root, and the text equals
click me. And the command equals Actually, I'm just going to copy this whole thing. It's
exactly command that we want. That is, right. Yep, I'm just counting parentheses.
And then if we put this on the screen, my ups, button, hack parts, save this and run
it real quick. We see option one, if we click it, boom, it goes to one, two, we click it
to, okay, so either way this works. And that's how you do that. Now, in the future, anytime
we want to use that value of the radio button, we can by either calling our dot get, or if
it's inside of a function using, you know, whatever value we passed in whatever keyword
for that. So that's cool. So that's one way to do it. And this works, right. But these
are just two buttons, you may have like 10. And you may not want to do all 10 of these,
right. So in that case, we can sort of use a loop in order to do this. And so that's
what I'm going to do now very quickly, maybe not so quickly, it might take a bit. So I'm
going to go ahead, well, let's just comment out those. And leave this for now. So what
we can do now is create a Python list. And I'm gonna call this modes. And inside here,
this is just a Python list, I'm going to create some topples for the radio buttons that we
want to create. Alright, so let's create, oh, I don't know four of them. Okay, now inside
of here, we need to values on to, and I'm just gonna copy these and paste, paste. So
let's say we're creating a menu for a pizza place online or something. And we want to
select which type of pizza we want on which type of topping we want on our pizza.
So we might have pepperoni. We might have what cheese, mushroom. What's another type
of piece of pizza, onion, that a pizza. And then. So this is the thing that's going to
show up on the screen. This is the actual value that we're going to pass in here it
was this value right here, when we had one and two. And instead of numbers, that's this
time since we did numbers last time integers. Let's do strings this time. So I'm just going
to copy this, we want the value to be the same thing as the thing. Oops, copy, paste,
copy, paste, copy, paste, and modes. I called it modes because it's the it's a mode of a
radio button. You can call this anything you want. If you wanted to call it toppings you
could. I would call it something plural. And we'll see why in just a second. So now let's
get rid of this. And this from the old thing. Now, just like in the last time, we need to
set up a Python a kinter variable. So instead of calling it our What should we call, it's
called pizza. And this time, it's a string variable. str. think that'll work. Actually,
I think it's string variable string bar. Oops, pizza. Yeah, let's do that. And we want to
set the first one. That set we'll set that to what let's make the first one pepperoni.
Okay, so now we need to loop through all these things and put them on the screen. So I'm
going to go for it. text and mode. In modes, it's just a basic loop, right. And we want
to create a radio button. So let's go radio like we did last time. And then we want this
enroute, of course. Now remember last time we created a text, a variable and a value,
we need to do the same thing. So this time the text will equal text, because we're calling text. In our loop
we're calling on Well, this needs to be all capitalized modes. So we're going to loop
through modes, which is this, and we're going to take each of these values. So this will
be text and this will be our did we call this one text and mode. So this will be text and
this will be mode, this will be text and this will be mode, this will be text, and this
will be mode. So we want the first value. Right here, text equals to text, right? And
we want the variable to always be pizza. That's this thing right here, right? And we want the value in that variable to
equal mode, which is this thing, this thing, this thing in this thing, right? So okay,
now we can dot pack this. If I could type, there we go. And that should work. Right?
So let's just save this real quick. To see actually, we need to change this also. This
pizza, we did not get. Okay, so let's save this and see if this works. Oh, we got an
error. What did we do? A self option bubble blah. Oh, I misspelled a variable. What line?
I don't know. Let's look at this. area's very eligible. variable. There we go. Cannot type
today it's Friday here in Vegas. Can't type on a Friday. You kidding me? Okay, so now we see. We've got pepperoni, cheese, mushroom, and
onion. And the first thing is parrot pepperoni. Because we set that when we started, if we
click on this, it goes pepperoni. If we go cheese, I click boom, she's notice it's not
doing it when I click on this, because this time around, we didn't put a command. Like
here we did a command when you click on the actual button, we're not doing that this time,
just just to save time since we've already done it once. Now we're just doing it when
you click the actual button, right? So let's see. Let's just take this and go anchor equals
w. Let's close actually. See, these are all centered, right? We close
close this and run it again. All right, now they're all anchored to the west to the left,
looks better. And in fact, we can get rid of this pepperoni too, because we don't really
need it at the moment. So down here on our label. Like we can just get rid of this if
we want to right. That's the button label. Label. Alright, so save this, run it one last
time. So pepperoni cheese, click cheese mushroom, click mushroom, onion, click onion. So this
last time is just sort of a fancier way to do it. Just doing a simple loop. It's easier
than you know, creating four of these radio button things. We could have done that too,
that would work. This is just sort of a little bit easier. And like I said, I call this modes,
we could call this toppings. We just change this to toppings. Right? And instead of mode,
maybe we call it what topping topping in toppings. And we change it here to topping. Save this.
Give it a run to make sure I didn't screw something up there. Cheese, boom cheese mushroom,
mushroom, pepperoni, pepperoni. Pretty simple, pretty straightforward. on talking about creating
message boxes, okay, so I've created a new file, I call it message.py. And I've just
pasted it in the same starter code that we always have. So a message box is just a little
like a pop up box, right? And usually has a couple of buttons Yes or No? Okay, cancel
all that sort of thing. And, you know, you're gonna use these a lot for a lot. Different
things. So to get started, we have to actually import a module to use this. So we're going
to go from t kinter. Import, probably good idea to spell import correctly. And we want
to import message. Box, all one word. All right. So to do this, there's actually several
different ways we can do this. So first, let's just create a button. Let's go button. And
we want this in route and we want the text to be I don't know, pop up. And then let's
just pack this onto the screen. Okay, now, we actually want to call a command. So when
we click this, we want it to do something. And let's call this pop up. Right? So now we need to create a pop up function. So let's
go define pop up. Okay, so inside of this, we want to create a message box. Now, there
are several different types of message boxes you can create. And I'm going to go through
all of them. But for right now, the very first basic one is show info. And this one is an
interactive, I don't think it just, you know, puts up some text on the screen. So the first
parameter, this takes two or three parameters, and the first one is the title bar that you
want to show up. So I'm just going to type this is my pop up. Right. And then the next
one is the message that we want to show in the actual pop up. So let's just type hello
world. Right? And I think that will do it. So let's save this, head over to our C forward
slash gooey directory where we're saving all these files. And let's run this message dot
p y. o, invalid syntax. Oh, I'm in a big hurry today. forgot our parentheses. Okay, so save
this. I'm back here and run this again. That's clear the screen because he wants to look
at error messages. Oh, no. Okay, so what are we done here? button. Text, man. All kinds of errors this morning. Alright,
lowercase t in text. So let's save this. Try it one more time, clear this screen. It actually
finally worked. Okay, so we just have our little app here. Oops, it disappeared on me.
And it has a button pop up window and click this boom, here's our little pop up. And you
can see here's the title, this is my pop up. And then the actual thing itself says hello
world. And it's got this little icon next to it, because this is an info, showing info.
And if we click this, it disappears. Right? So that's pretty much it. And it's pretty
simple. So if we close this. Now, I mentioned there are several different types of boxes
that we can create. So I'm just going to paste in this comment. And these are the different
message boxes. There's the show info on the show warning, show error, ask question asked,
OK, cancel and ask yes or no. And to use each of these, we just changed this a little bit
right here. So instead of show info, we want to do a show warning. We can save this and
paste. So save this and run it we get a pop up. And then it says hello world. But now
we get this little ok message or we get this little warning thing. Now I'm going to turn up my volume. And if
we hit this again, did you hear that? We got that sort of error sound? here that that comes with a warning that didn't
happen with the show info on so Okay, let's close this. Take a look at the next one. So
show error. Copy this, paste it in, save it and run this again. Pull it over. Did you hear that? Brown? That's the error
warning and you get this big angry x right? So that's the error one. Close this. And let's
see ask question copy, paste, Save and Run. Boom. Pull this over. Okay, so now it just
says hello world. But we have now yes or no. Right? So if we click Yes, nothing happens.
If we click No nothing happens. I'll show you in a little bit what how to do things
based on whether they click yes or no or okay or cancel or, or any of that stuff just as
soon as we go through all of these. So that was asked question. And so now let's try ask
Okay, cancel, save, run. Oh, okay or cancel, right? And again, we'll
look at how to play with these buttons in a bit. Was that and what's less lat left finally asked Yes,
no. If we save this pace, Save and Run, we get yes or no. Okay, so that's cool. But now how
do we deal with these buttons? Close this. So what we can do here is take this whole
thing and just shove it into a variable. So we can call this variable, anything I'm going
to call response. And then we just set that equal to that. Now, we can actually print
out the response and see exactly what it is. And once we know what it is, we can do an
if else statement in order to you know, do stuff depending on that. So let's create a
quick label. And we want this and route. And we want the text to equal response. Now let's
just pack this on the screen. Okay, so we say this. And we've got the Ask Yes, or no
guy on there right now. So we can run this. Pull this over, see a pop up? Yes or no? So
let's click Yes. Boom, it returns one. That's kind of interesting, right? If we click No,
it returns zero. So what we could do is close this and pull up our thing. Now we know what
returns a one for yes or no, or zero for No. So we can go if response equals and you need
the double equal to sign to compare. We're not assigning we're comparing, then we can
just let's pull this. And for the response, let's click there. Let's type in. you clicked.
Yes. All right. We can go else. you clicked No. Let's save this and run it. And pull this over. So hello, world. Yes.
No. Oh, one you click Yes. Try it again. No, zero, you click No. So let's pull this back
up. This we can get rid of. Okay. So that's interesting. Now, that's for ask ask Yes,
no. All right. So I'm going to can't or I'm going to comment that out this stuff and undo
this. And let's just go through these all very quickly. So ask, OK, cancel. Save this. Run it again. pop up, okay, or cancel. So if we click OK, we get
one. We click Cancel, we get zero. So, okay, cancel also returns a one or a zero. Right?
What do we have asked question. Let's take a look at this one. Save it. pop up. Yes. No. If we click Yes, it returns
Yes. If we click No, it returns No. Right. So that's kind of cool. So now, if we want
to play with that one, down here, we have to change this to Yes. Right. In fact, let's just run this to make
sure that works. Save this, run it again. Zoom pop up. Yes. you clicked Yes. pop up.
No, you click No. Very cool. Okay. So very quickly, again, let's comment this out. comment,
comment, comment. And then let's look at the rest of the show air. Save and Run. I could
just tell you what each of these do. But I think this is a better way. Because in the
future. If you can't find documentation on this, you need to be able to figure out how
to determine what these things are returning on your own. And this is how you do it. So
if we click OK, it returns okay. So that's interesting. What else do we have? Show error
show warning. Save and Run This over hello world, okay, it returns Okay.
And then finally, we have show info, save it and run it, bring it over, pop up, okay,
it returns, okay as well. So very cool, very easy to create message boxes. And there's
like a zillion different reasons why you might want to create a message box for any number
of reasons. And that's how you do it. In this video, I want to show you how to create new windows
in your program. You know, up until now, we've just basically had one big window, we've had
message boxes and little things like that. But as far as like creating a whole new window,
we haven't looked at that yet. And likely, you're going to need to do that, in some point
in your careers, I created a new file called base.pi. And it just has the same, you know,
starter text starter code that we've used throughout this series. And so what we want
to do here is just create a new window. So how do we do that? Well, you notice up until
now, we've been using this root window, it just shows one big window on the screen. And
that's it. So you know, likely you're going to want to add a different type of window
or different window. If you click a button, if you do a drop down thing, whatever. How
do you do that? Well, you start just by defining it, I'm going to call it top and set that
equal to top level. And it's just this top level function. So if we save this and run
it, we get right off the bat pull us over, this is our main window, there's nothing in
it. And then also this second window. And you can tell the difference because the icon
is different up here, right? This is just the kinter default icon, whereas this one
has our little kotomi icon right. So okay, that's not that great. There we go. Come back. Close this. Now, anytime you want to do something
in here, you just do it inside, you just do it after this. So you know, if we wanted a
label, let's just call this label equals label. Now normally, we would put this in root right?
Well, now we have this top, we can put an ad so we can designate different windows that
way. And we can set the text equal to hello world, whatever. And then let's just pack
this on the screen. So let's run on this real quick. head back over here and run it. Oh,
no, ah typo already. There we go lowercase t i do that a lot, I think seems like at least
the second time in this series. I've done that. Okay, so now we have our main thing.
And then our second window. And the second window says hello world. So you can you can
put anything in there you want. For instance, we could put an image in there. Remember a
few videos ago, we use this image.tk thing. So we could go let's get rid of this. And
let's just say my underscore image set that equal to image TK dot photo, image. And then
image dot open, and then call the image now I think we had, we had a directory called
images that we set up and inside of there I had this assmann dot png picture. So we
could do that. And then create let's create a my underscore label e L and just set this
equal to a label want this to be in top and we want the image
to equal my image. And we need to pack this on the screen. Okay, so that should work.
So if we save this and run it real quick. Boom, we get our first normal window with
nothing in it. And then we have the second window. Man Aspen little yawning here. So
you notice it says learn to code academy.com which is the same title as this one, we can
change that to pretty simple. In fact, we can just copy these two things for the title
and the icon. And I'm just going to put this right under here. And instead of root here,
obviously we want top. Same thing here. Top. So if we save this, come back over here, run
it again. We get our main window and we get our second window and it has the
icon and it says learn to code Academy which is what it said before so let's change that
real quick to what we want. My second window All right. Very creative. Alright, so now
now we get this my second window. Right okay. So that's kind of cool, I guess. But chances are, you
don't want all these windows just fly open every time you open your program, you want
it to only open if you click a button or do a drop down or click a link or do something
you want to be able to control when they appear. Right. So how do we do that? Well, let's create
a button. I'm gonna call it button. And let's call button, we want this in route, we want
the text to say, open second window. And then we want the command to be what open. Okay, so now we need an open function, method,
whatever you want to call them open, fine, open that file. Now inside of here is where we want all this
stuff, right. So now, we have all this stuff over. Oops, go. That seems like it should
work, right? So it actually sort of will and sort of won't. I'll show you just now what
I'm talking about. So if we save this, come back over here and run it again. Oh, you know
what, once again, forgot to pack the button. Back, it's, we're having a day here in Vegas,
it's cloudy, kind of cooler than normal. My brain is just not woken up yet today. So save
this. Now we'll run it. Okay. So we get this main window. It has a button, I misspelled
window. All right, so we click this. Now the second window opens. But check this out the
image didn't load What's going on here? Well, what actually happened here is all of our
code. Right here, we're calling this my IMG variable. And we're setting it equal to this
image. But this is a local variable, right? We need this to be a global variable, because
for some reason, when you're in a function like this, with a second window, Python sees
this local variable, and it thinks it's garbage, it gets swept up in the Python garbage collection,
and it doesn't get displayed. So all we need to do is called Global for my image. And now
this should work. We save this, run it again, we get this guy, if we click it, boom, sure
enough, it opens. Very cool. And it's just one of those weird things. I'm not even exactly
sure why the mechanics of why it does that. You just, it just does. Notice when we did
this earlier, we had all of this stuff outside of this function, it worked just fine. Because
it's in the root, it's in the main window. So the local variable works in the main window,
it just doesn't work in the next one that you open this top level window. Alright, so
we can play around with this some more, we can go button to equals button. And we want
this to be in top. And let's go text equals close window. How do we do that? Well, we
want the command to equal top that destroy, I think we looked at destroy a few videos
ago. That's how you can close things. We just have to make sure and designate that we want
to destroy top not root. So save this, come back over here and run it. Oops, drag this
over. Alright, so open second window, ah, a third time, I've got to pack the button.
All right, that pack. I'm telling you, it's one of those days here in Vegas, cloudy Vegas
today. Alright, so now we have open second window. When we do that, we get the second
window, says my second window has the icon as our image as this button, we close it,
boom, it closes, we're gonna open it again. There it is, again, close it, like an open
it, he can close it, and on and on. And there we go. So that's pretty much it pretty simple.
You know, you don't want to run two versions of this TK function at the same time. Instead,
you want to call this top level. It's just what TK enter calls the second window that
you want to open and pretty straightforward. The only thing to really worry about is this
global thing. If you try something inside of here, and it doesn't work, try adding whatever
you're trying to do as a global variable, they'll likely fix it. But pretty simple.
In this video, I want to show you how to use the file dialog box to open files, no matter
what the file is anywhere on your computer. Okay, so you've got your program, you want
to open a file, maybe an image, maybe a PDF file, anything at all. How do you do that
with kinter? Well, it's really really easy. You just use something called a file dialog.
And we need to import this It comes with kinter but we need to import it. So from TK enter,
import file die Okay. And to use this, we just call route dot file name. Now I should
say this won't actually open a file, it'll just return the name of the file and the location
of the file. So let's say, you know, we've got these images in our gooi slash images
directory. So it'll return c, colon, GUI, colon, slash images slash Aspen, one dot png,
then when you have that location, then you can then open that file in your program programmatically.
So we'll look at how to do that. But first things first, let's just look at this dialog
box. So we go File dialog, and then dot ask open file name, right. And then inside of
here, we got to pass a whole bunch of different things. First, we need to tell it what directory
to start in. So when the box pops up, what directory Do you want to be showing, so you
go initial dir, and set that equal to whatever you want. So if you just want the C directory,
just do that, if we, for us, we want GUI for slash images. We do that right? So then we want title. And now this
is just the title of the box that pops up, it'll have a little caption title at the top,
and you can put anything you want. Let's go select a file. That's good. And now, we need
to tell it, which types of files to show. So, you know, you could just put all the files,
or you could specifically say just show the PNG files because we want to open a PNG file,
you may have PNG files, you might have JPEG images, you might have GIF images, GIF images,
or you pronounce that you might have bitmap images, whatever, you can designate that here.
So to do that, we just recall the C file types, plural, I spell it right file types, there
we go. And then set that equal to whatever you want. And inside of here, we can designate
a bunch of different file types if we want by putting them in parentheses, and then separating
them by print or by a comma. Right. So let's see, is that the right number of parentheses?
I think so. So let's just start out with we want, I don't know, PNG files. Yeah, PNG files.
And this first bit, is just a little description, and that'll pop up in a drop down box. And
we'll see that in just a second. So then we need to tell it, what type of file and PNGs
are started with Star dot png in the store is basically saying open any files with that
have a name of any kind star dot png, right? So that's it for PNG, if we want to then designate
say, for instance, all the files, we can go see, again, just type in a little description,
all files, and then a comma. And then the type of file. This is this just wildcard we
want all the files of all the different types. So we would go any name, dot, any extension,
right? Star dot star, and then that closes, and then Okay, I think that's right. I get
a little messed up with all the different parentheses, but I think we close them all.
So let's just save this real quick and run it. I should mention I named this file file.pi.
And I just started out with a basic starter code that we always start out with. You're
familiar with that already. So let's head back over here and run this guy. Oops, what
did I do? file? Diallo. I misspelled something. Of course I did. File dialog. There we go.
That looks better. Save it, run it. Pull it over. And when I did, it just automatically
popped up this box. And you'll notice we're in C four slash gooey, forward slash images,
because that's what we designated. And then we have all these PNG files. These are the
the images that we did when we made that image viewer several videos ago. So I'm just going
to reuse these. And now you look see it says PNG files, or all files that comes from this
little thing right here. png files and all files and we can type anything at all we want,
right? Let's see if we come back here. Your code. I'm back. Actually, there we go. If we click here for
all files, it doesn't really change because the only thing we have here are PNG files.
Right? So let's close this real quick. And let's change this to JPG and then let's change
the description to JPG files. Okay, so let's save this and run it again. And boom, it pops
up. And now there's nothing listed, because it's calling the default is the first one
he lists, and it's calling for the JPEG files. And when there are no JPEG files in this directory,
so if we click all files, boom, now they all pop up, right? So if we click this, it closes,
and nothing happens. So let's take a look real quick and see what what happens when
you click a thing what it returns. So we could just return this root file name thing in a
label. So let's just go I don't know my label, equals set it as a label, we want it in route.
And we want the text to equal just that. And let's just pack this on the screen real quick.
Save this guy, run it again. And okay, JPEG files, we want all files, let's call Aspen
two, when we do that, here's our main program, it just returns the location Aspen two, right.
So if you actually want to do something with that, if you want to, for instance, open that,
then you need to do that separately. But that's okay, because we know the location. And now
we can just open that location, we learned how to open images. several videos ago when
we looked at that image viewer app that we built. So we use proper code here is this
image thing here. So let's go all the way want my underscore, image equals image TK
dot photo image, I spell that right image TK dot photo image. There we go turn blue
there. And we want image dot open. And we want what do we want to open we want
to open this thing, whatever it is, root file name, right? So now we go my image label,
set that equal to a label. And we don't have to put it in route, we could just go image
equals my image, which is this thing. And we want to pack this on the screen real quick.
So let's save that. Run it. See if this works. And we get JPG all files. Let's open Aspen
two. Oh, image TK is not defined. thoughts that look weird? Oh, lowercase. Okay. All right. So let's save
this. One more time. Hold this over. Alright, so we want all files, we want to ask bend.
And when we do our main screen, pulls up this thing. It's also listed that because we have
that on there, and it's it works. So very cool. Now, one thing that you'll notice is
whenever I run this thing, it just pops up the file dialog box right away. And that's
probably not really practical. So let's play around with that a little bit. Let's create
a button. Let's go my button and set it equal to a button. And we want this in route. And
we want the text to equal open file. And we want the command to equal open. Now we need
to, we need to define an open method here function. And inside of here, I'm just gonna
put all this stuff right. And have all this over. Okay, so remember, when we open an image
in a function like this, we need to create a global for its variable. So my underscore
image that should work and our button we need to hack this guy. Okay, so let's save this
and run it. I almost certainly screwed that up somehow. Let's see how I did it. Your object has no idea. What do we do? Let's
see my button. Oh, we left it all out. All right, get rid of that. Save it. See I told
you. I screwed that up. All right, this is getting crazy. Let's clear this screen. Run
it one more time. All right, that looks good. So we pulled This over, we got the button
that says open file, we do that, and the little box pops up. We call all files here, open
Aspen and boom, it opens, it also puts this on the screen here, we don't necessarily have
to have that. That's pretty cool. So very easy, very simple to open any kind of
file. And in this video, we did images, because we've already worked with images before. So
we're already familiar. But you know, you can do a PDF file, you can do an HTML file,
you can do a Python file, if you wanted to open it and put its contents on the screen,
whatever you want to do, you can do with this open dialog, this file dialog thing. And it's
pretty simple. The main thing you have to remember is just that it's not opening the
file, the file dialog box is just returning the location, it's allowing you to click a
file and select it and then it just returns the location. Once you have that location,
you can open it in any of the ways that we've already learned how in the past for is opening
images or or whatever you could, you know, paste out the contents in a big label. If
you wanted whatever you want. You can do so pretty cool. Okay, so sliders, what am I talking
about? You know what a slider is a little slider that goes down at the bottom or on
the side of a program or something like on a web page, or like right here, you know,
you slide up and down. How do we do this when kinter and graphical user interfaces. So that's
how we're going to look at so I've created a file called slider.py, I have just the basic
starter text that we've used pretty much throughout this entire series. And so let's create our
first slider. It's very, very simple. We're going to use the scale widget, which is weird,
why don't they just call it the slider widget, I have no idea. But they've called it scale.
So you can designate vertical, up and down or horizontal, left and right and the default
is up and down for some reason. So we're just gonna do that one. First, I'm gonna call it
vertical. And we just create a scale widget. And we do it like we've done all the widgets
we designate, we want it in root. And now the only real thing you need to tell it is
where to start and where to stop. So you want your slider to go from zero to 100, from 50
to 1000, from 250 to 230, whatever you want whatever range, you have to designate that
right here. And we just use a from and to but the from needs a forum and an underscore,
and then you set it equal to whatever. Now, if we leave off the underscore, you can see
it gets really angry. And it realizes that's an error right away. So I have no idea why
you need an underscore, but you do. And then you need to designate the two. And notice
there's no underscore for the two which doesn't make sense. I mean, let's be consistent here,
people who built this. So let's, I don't know, let's go what 200, I don't know. And now we just go vertical dot pack to put
this guy on the screen. Now it's important that you pack it on its own line. You don't
want to come up here and go dot Pac like we have so often in the past, for some reason
that screws things up later on. And I'll show you why in just a second. Okay, so slider
dot pilot, save this, head over to our terminal and run it. And when we do that, we get this
slider, it goes from zero to 200 is not much to look at, but you can change the graphical
properties of it, change the color foreground border, all the stuff we looked at how to
do that for like labels and things. So you can do that in the same way. Okay, so that's
something I guess. So that's vertical up and down. That's the default, we can also go horizontal.
So let's do that real quick. Let's go horizontal. And that's going to be a scale. You know what,
let's just copy this whole thing. And right here, we just add another attribute,
we go orient, we're going to orient it on the screen. And we want this to be horizontal.
If I could spell horizontal, there we go. And likewise, we want to pack this guy on
the screen. So if we save this, come back over here. Run this guy again. Zoom, whoo, we get this horizontal widget. All right,
not that great. One thing I want to show you really quickly. We haven't I think we looked
at this once and it really talk about it. But up here we can designate how big we want
our original window to be. We just call route dot geometry. And then say if we want 400
by 400. We can do that. If we save this, come back here and run it again. You can see now
that the whole box is 400 by 400. It's a little bit bigger, gives us some room. I'll just
show you that real quick. Okay, so we've Got these sliders, they slide they return numbers.
But what do we do with them? Well, that's exactly what they're going to do, they're
going to return a number based on where they're slid to. And we can get that number. By calling
the dot get method. We've looked at that for labels, I believe in the past. So we would
go horizontal dot get, right. And if we wanted to slap this into a label, we could go I don't
know mine, or score label equals a label. splat, right LA, b, e, l, there we go. And
we wanted to route and we want the text to equal this. And we want to pack this on the
screen. So if we save this and run it, we see this zero label right here. Now if we
change this, it doesn't change automatically. So if we want to do that, we need to kind
of use a function or something. So instead of a label, let's create a button and let's
call it my underscore btn wants to be a button and root and the text is click me. And the
command equals what slide. And we want to pack this up here, let's create this slide function.
Boom. And inside of here, let's just copy this. Okay, so every time we press the button,
it'll update this. So let's look at that real quick. Just to make sure this is working.
Zoom, pull it over Zhou. So let's move this to 103. If we click me, boom, 103 188, boom,
188. And that's pretty much it. Now, whatever you want to do with that, that is up to you,
if you want to say, I don't know, let's say we want to resize this, right? We could do
that. It's kind of weird. Let's pull this up. Because we got this root geometry right
here, we could just bring this over here to our thing here. And instead of, say, 400,
we could just put in, let's see, horizontal dot get. This is an integer, and this needs
to be a string. So we need to wrap this whole thing in a string function. And that'll allow
us to then concatenate that into this. Okay, so that almost works. But we need to change
this, we need to tell we need to send this into our function here. So if we save this
and run it, this won't work. I don't think they pull it up and see here. So if we bring
this over here, if we click this, oh, it doesn't work like that. So it's changed the 138. horizontally,
vertically, it's still 400. Right? So if we go 179. And that works 200. All right. Cool.
So we can change this to let's see, 400. If we want to save this and run it, come back
here. Alright, we're at 400 by 400. If we change this to 200, boom, we can go back to
400. Boom. Right? That's kind of cool. We could do the same thing for this if we wanted
to, right? We haven't yet. But we could. Now what about just moving the slider and having
it update based on the slider, we can do that too. It's a little trickier. But let's take
a look at that. So instead of using the button, we want to just use the slider. So we'll stick
with this horizontal guy, we can send a command into that. And we could send that command
equal to say, slide. And then Okay, so that should work. Now, this will
not work. This is what I was thinking earlier. We need to pass something from here. We need
to pass whatever this is into here for some reason. So let's save this and run it just
to make sure but I don't think this is going to work. Like I said earlier. Yeah, we get
boom slide is not defined. Oh, that's not the problem. I was thinking I've the reason
why this isn't working now is because this function is below this. So if we copy this,
bring it up here. Okay, so now that error will go away, but it will get a different
error. I think this time, let's check and see. Yeah, so we got all these errors. So
whenever we're sliding this, it's sending the commission And, but it, it's not sending
what this is 147. And for some reason that our slide function won't pick up with the
dot get thing. So we need to be explicit when we do that, for some reason, just a weird
little thing I discovered. So how do we do that? We just come over to slide and let's
just call this Well, I don't know. Far very variable. I don't know, save this.
I think that's all we really need to do. Well, maybe not. run it and see. Um, yeah. See, look what happens when we're at
zero. is very touchy, right? Now, if we go 300, it's
okay. So as soon as we move it to something, it starts to resize. And that resizing makes
everything a little wonky. So this is not the best way to do things, right. Unless you
wanted to click it, and then use your arrow, you can't even use your arrow. So yeah, that's
not a great way to do it. I much rather use a button. But if you want to do that that
way, for some reason, you could by passing in, var value or any just any variable at
all, then this whole thing, the slider, output, I guess you would call it gets passed into
slide function. And that work. So I don't really like doing that. But you could now
we could, let's see, change our button to use both of the sliders. So we could go here
instead of 400. We could concatenate again call the string function. And inside of here
pass, what do we call it? vertical? dot get? Okay, I think that should work. We got to
close our program. Loop blows. Clear? Oops. There we go. Oh, on 18 horizontal dot pack.
What has gone wrong line 18 horizontal dot pack. Recall that pack. missing a lot that
got deleted. All right. So this should work. Now. I'm just playing at this point. This
is a hot mess this video but you know, so let's move this to 118 and 147. Boom, now
the whole thing gets resized, we could go back to 400. By 118, we could change this
to 200. And that works. need to change this to 400 I think so that
we could go back. But yeah, so that's how you do that. So sliders pretty simple. All
things to the contrary. You know, you can use these for all kinds of different things
are kind of fun play with, like I said, you can change the display of this, make them
bigger, make them different color, change the length of them. And all that stuff in
the same way we've done with labels and stuff in the past pretty simple. Okay, so checkboxes,
we've already looked at radio buttons, those are those like round buttons that like lets
us select from different things. checkboxes are square boxes, and they're more just like,
on or off, right. So very similar to radio buttons. But there's a couple of little tricky
things involved. And it's kind of a little bit weird. So we're going to take a look at
that in this video. So I've created a file, just call it check.py. I'm going to save it
in our GUI directory. And this is just the basic starter code that we've been using forever.
So first things first is we need to create a counter variable, just like we did with
the radio buttons and kinter variables are a little bit different. In order to get their
value. You don't just call the variable you call like the variable name dot get, if you
want to set the thing usually say the variable name dot set, you know, we've looked at these
before, so we're just gonna create one called var. And it's we just go var equals and then
just declare the kind of variable that you want. So we want this to
be oops, int var, right? So, you know, Kinjo variables, you could have integer variables,
or you could have, for instance, string variables, but in this case we want and we're going to
actually change this in a minute. But the reason why we want int is because when you
check box when you check a box, the value that you're assigning to it behind the scenes
is either a zero or a one and one I think means you've checked it and zero means you
haven't checked it. So those are one and zero are numbers. They're integers. So we use int
var here. So to actually build a checkbox, I'm just going to call it C for checkbox,
we just go check box button, I can spell. And the same thing as always,
we want to put it in route. And you know, put the text as anything you want. check this
box, I dare you. Right, now, we need to assign the value of the variable name that we're
going to use for this. And we're going to use our var variable, so we just type in a
variable equals and then set that equal to var. Now there's a couple other things you
can put on here. And we'll take a look at those in just a second. But just for right
now, let's go see dot pack, pack this guy on the screen. Now. I mean, we can save this
and run it. So let's go Python, check that high. Pull this over. And you know, we can
check this and that does stuff but it's not actually doing anything, right. So to actually
see what's going on behind the scenes, let's just create a little variable real quick here.
And what we call it, my are labeled and I said variable, label one label, and I set
that equal to label. And then what route as a text we want set equal to var dot get want
to get what's in that variable. And then we could just pack it on the screen. And I think
that will work. Okay, so if we save this, and come back here and run it, this is not
a great solution. But we can see right away it's unchecked, and it's zero. If we check
this, it won't update, we need to actually create some sort of function in order to do
that. So let's go ahead and do that real quick. Just to see. Let's back up. And what let's
just create a button, my button equals button and route and the text equals show selection.
Yes. All right. And then what we want this to have a command equals to show, let's just
come up here real quick and create a show function. And we can just change this to this.
Alright, so we click this button in a run this function, and it'll show this and update
it. So I think that will work. We need to pack this guy on the screen. always forget
that. All right, so let's run this and see. So check this box, I dare you show selections
zero if we check the box 11110. Okay, so that works. And that's how you do that. So that's
basically the functionality of the checkbox. Now we can get into some other weird little
things. And we will just now because why not, we're having fun here. But I mentioned at
the beginning, that we're using this int var, we can change this to string var. And if we
do, we can, the default is zero or one, we can change that if we want, we can have the
output be anything we want, we can change it to pizza, if you check the box, right?
It doesn't have to be one. If you don't check the box, it could be you know, john, like
whatever you want, you can assign. And you do that down here, when you create your checkbox,
or check button, whatever you want to call it, just by defining the on value. And then
let's just call it on or the off value equals off, right. So if we check the box, now, instead of it being
one, it'll be on. If we don't check the box. Now instead of it being zero, it'll be off.
Now on its face. This seems pretty simple, but we can't run into some problems. And let's
just see by running this. So we save this. Remember, we've up here we've changed this
now to a string variable. Why? Because this is no longer zero or one it's on or off. And
the words on and off are strings. So we need to change our variable to a string variable.
So let's go ahead and run this and see. We're going to get some problems here. First thing
right off the bat, you'll notice the box is checked by default. And before it wasn't checked
by default, I'm not sure why that is. Now if we click this, nothing happens. Right?
That's weird. Now, but if we uncheck it, and then click it now it says off. If we check
it again, now it says on so what in the world is going on here? Well, I don't know. This is a little glitch. I've discovered I
did a little research I couldn't figure out what what in the world is going on here. It's
all Printing something on the screen because there's space here, right? But I have no idea
why. And also this is and this is checked by default. And we don't really want that.
So the way that I find, as a workaround is to right up here at the top, when you first
define this thing, before you even pack it on this screen, we can use something called
the D select function, and it's just D select. Right, and that does exactly what it sounds
like it D selects it by default. So if we save this and run it, this over the first
thing, you notice that it's not selected by default, which is good. Now, if we click this,
it says off right away. So that works. Now, if we uncheck it, and click it is on right
away, there's no big space in here. So nothing weird is going on. And that works. And now
we can test it again, one more time. And this time, start off the bat by checking it. And
that works. So I have no idea why that is. But just is one of those weird little kinter
things you just got to sort of remember. So on off, that's pretty cool. Like I said earlier,
we could totally mess around with this and call the on value. Pizza. And the off value. hamburger? I don't know.
Great. Let's run this again. check this box, I dare you pizza amberger. You know, like,
Why in the world? Would you want to do that? Well, you know, come back over here. And let's
go. supersize. And then here, let's go. regular size. Right. So and then here are string are
redefined. check this box, I dare you. You could say, Would you like to Super Size your
order? Right? Check here? I don't know. All right. So have you got an app where you're
ordering food online, and you'd like to supersize your order, you could check this and boom,
now it's you know, it's supersize. It's not like that. So those are checkboxes, an awful
lot like radio buttons, but you know, with some little bit of differences, specifically
this D select thing and that weirdness around that. I have no idea why that's the case.
But it is. And it's a pretty simple workaround. So Alright, drop down boxes, what am I talking
about? Well think of like a webform, where you click the little drop down box box opens,
there's a menu you can select from, you pick the thing, and that's that, well, basically
the same thing, but with kinter. So a drop down box is basically something called an
options menu, an option menu singular. So to do that, let's go create a variable. And
this acts an awful lot like the checkboxes we looked at in the last video. So there's
a lot of things that are similar. So you'll notice that so it's just option, we need to
set this equal to option menu. And we want this in route. And just like with the checkboxes,
we need to assign a variable to this. So that you know, whatever we check in the boxes,
whichever box we select, which whichever item in the box we select, that will be assigned
to a variable. And we could call it var if we want, or we can call it clicked, whatever
you want. And that's that. So now, inside of here, the next thing is to sort of designate
the items in the menu. So we could go Monday, Tuesday. And you just separate these with
commas thurs day, and the most important day Friday. All right, so now we just dropped
dot hack onto the screen. Now, we've created this clicked variable, we need to actually
define this because just like with the checkboxes, this is a kinter variable. So it's a little
different. You set it and get it and you define whether it's a string variable or an integer
variable. In this case, our menu items are strings. So we're going to use a string variable.
So we just call clicked equals string var. And that's it. All right, so this will work.
And I should mention, I just use the same starter code we've been using. And I'm saving
this as drop down.pi. So this will work but it won't show a default value, as you'll see
here. And let's just run this and see. So right off the bat, pull this over, you can
see here's our menu, but there's no default items, but if you click on it, and then select
an item, it'll update, but that's not great. We need an actual default item. So how do
we do that? Well, it's pretty simple. You know, we've played with these variables, these
Kinjo variables before, and we can get and set. So in this case we want to set and then
we just pick which one we want to set So let's just call Monday here. So if we save this,
come back here and run it. Now, pull this over, boom, it says Monday right
at the beginning. Very cool, right? So, okay, so how do we get the selection and use it
to do stuff with? Well, just like the check boxes in the last video, we can just access
this clicked variable. So let's create a button, my button. And that's a button and it's in
route. And we want the text to say, Show selection. And let's give this a command equals show
just like we did in the last video. And then up here at the top, we can define show. And then let's go my label equals label. And
we want this and route and we want the text to equal. Now we're gonna want this clicked,
not in quotation marks clicked, dot get, right? And then we want to pack this on the screen.
And here our button, we need to pack that one too. And I'll always forget that. Okay,
so if we save this, this should work, I think. Okay, so show selection, boom, Monday, Thursday, Friday, wow. Okay. So that's how you do that. Now, once you've
done that, obviously, you can do anything you want with it, right? one little thing
I do want to show you down here, here, we're sort of designating what options we want to
show up in the menu, what items we want to show up in the menu. And that's okay, it works.
But like, you might have 100 things in your, your drop down that you want. And this is
already starting to get unruly. So instead of doing it like this, we can actually just
use a Python list. So let's create a list. It's called options. And it's just a regular
Python list. Alright, and I'm just going to print in and paste in these items. So here,
you know, I'm gonna put these one on each line, because that's what we like to do with
lists makes it easier to read. So here, we can, instead of putting all of these guys
in here, we can just pass in this list options. Now, one thing we have to do that's a little
different than not really intuitive, need to put a star in front of it. So all right
here, this looks good. Now here, when we set this, we set it equal to Monday, we can now
if we wanted to get really fancy, set the sequel to options, and then just pick an item,
right? We want the zeroeth item in our list. That's just a Python list, the zeroeth item
is Monday. So we'll just pass it in. Like that's a little nicer way to do that. So sort
of eyeballing this, everything looks good. So if we save this, back here and run it again,
it works the same exact way, right? It's just now it's been created as a list. Why would
you want to do this was just easier. So like later on, if we wanted to add Saturday, right?
Boom, we just do it like that. It's easy, you just go right to the list, it's easier
to read, it's easier to edit in the future. And then everything just works. So if we save
this and run it just to make sure we get boom, Saturday's there Saturday. So pretty simple,
pretty straightforward. This is very similar. Like I said to the checkboxes, we're using
the same hinter variables and the same sort of way. And we're showing them in the same
sort of way with the show function that we created and click get. This is a little different,
because this time, we're also setting it to begin with. So that's kind of fun. And that's
pretty much all there is to it. Okay, databases up until now, we've been having some fun with
kinter. But adding a database to any type of program vastly improves the sort of power
of that program, you can do a lot of stuff with databases we just can't do without. So
you know, likely whatever you build ever, you're going to need a database. So we're
going to start looking at how to use a database with kinter. So we're gonna use the sequel
lite three database, which comes with Python. So it's super easy to use, most people don't
even realize it comes with Python. And it's not very powerful. It's not like MySQL or
Postgres. But it's great for small projects, test projects, hobby projects, things like
that. And if you learn how to use it, it's really easy to learn how to use MySQL and
Postgres after that, so it'd be easy to sort of switch over if you need something more
powerful. So to use SQL lite with our counter program, all we have to do is import it. And
it's almost ridiculous how easy it is. To import this, all we have to do is type in
import, SQL lite three and boom, we now have SQL lite database in our program. Very cool.
All we have to do now is connect to it and start using it. So I've created a new file
called database.py, I have the same basic starter code that we've been using forever.
So the first thing we need to do is create a database or connect to one that already
exists. And the commands for both are the same. So let's go create a database or connect
to one. And to do that, we create a connection to the database. And so we just create a variable
called anything you want. But I'm going to call it con short for connection. And we're
going to set it equal to SQL lite three dot Connect. And then inside of here, we just
pass in the name of the database we want to connect to or create. So I think in the next
few videos, we're going to create a basic sort of address book app. Right? So let's
create a database called address underscore book. That dB. So this doesn't exist exist
yet, right? We haven't created it yet. Oops. But like I said, if it doesn't already exist,
This command will create it for us. And it'll actually save it in whatever directory we're
currently in. So we've been saving all of our code in these videos in the GUI directory,
so it will save address underscore book.db in the GUI directory, super easy, super cool.
So the next thing we need to do is create a cursor. And a cursor is sort of like the
little thing you send off to do stuff with the database. So anytime we want to execute
any sort of command, the cursor does that we send it off, and it does, it comes back
with the result. That's the cursor. And same thing we just create a variable I'm going
to call C for cursor, is tend to type it a lot. So I don't want to type out cursor every
time. So just call it C easy to type for all of you lazy people that are just as lazy as
me. So cursor. Okay, so this is a cursor instance, I guess. So let's go create cursor. Okay.
And anytime we make a change to our database, we want to commit those changes to the database.
That's just a common database thing. So to do that, we just go con dot commit. So let's
go commit changes. And then finally, whenever we're done, we always want to close our connection.
And we don't really have to, whenever the program ends, our connection closes automatically.
But it's sort of just the polite thing to do to explicitly close your database connection.
So we just go con dot close. And that is that. Okay, so we've got our cursor, we've got our
database created. Now we need a table, if you know anything about databases, you know,
a database isn't really anything, it's the tables inside that do all the work hold all
the data. And it's the table that we're always interacting with. And think of a table as
a spreadsheet, it has columns and rows, and we just need to designate what those columns
are. And then every time we add an entry, that becomes a new row, right. So things like
first name, last name, address, zip code, those are all columns in the database table.
So we need to create that table and designate those columns. And so that's what we're going
to do. Now, let's go create a table. Okay, so to do that, we use our cursor, we always
use our cursor. And usually when we do stuff to the database, we're executing some sort
of commands. So we always, almost always want to go execute here. And then inside of here,
we need to, you know, do some SQL, Structured Query Language, SQL commands to do whatever
we want to do. And in this case, we want to create a table now, usually, you just put
quotation marks, and then you type in your commands. But since we're creating a table
tables are kind of big, there's gonna be a lot of stuff for us to type here, I'm gonna
use these doc type, string things. And it's just six quotation marks instead, open and
close quotation marks. And like I said, this allows us to do stuff on multiple lines. Otherwise,
you could use single quotes and do it all on one line. So what we want to do is create
a table, right, and now we need to name it. So let's call our table addresses. Right.
Now, inside of these parentheses, we need to just designate the different columns that
we want. So let's go we want to first name. And now we need to designate the data type.
And so this is going to be text. Now, the cool thing about SQL lite is it only has five
data types. And those are text, which is just text, integers, which are whole numbers 1015
108, real, which are decimal numbers, 1995 2795, that sort of thing? No, which means
does it exist or does it not exist? And blob and blobs are like image files, video files,
things like that. So pretty simple. Databases usually have a lot more data types and it's
always kind of complicated, but you only ever use Here's a few write text and numbers basically.
So that's one of the cool things about SQL is we have first name, we want last underscore
name as well. And that'll be text, we want the address, and that's text. And you notice
I'm separating each one with a comma. And that's pretty simple address. Let's go city,
that's a text. Let's go state. That's text. And let's go zip code. And that's going to
be an integer. Okay, so that's the last one, we want to put a comma at the end of that.
I just sort of do this to make this look good. And boom, there we go. Now we could have used
single quotes and put all of those on one long line, it's really hard to read, this
is much easier to read. So that's why we use those triple quotation marks. Okay, so I misspelled
execute looks like xx, huge Toohey. And that was hard. Execute. There we go. Okay, so we
only need to run this, once we need to create our table one time, we need to commit those
changes, close our connection. So I'm just gonna save this, head over to our terminal
here. And we want python database.pi. If we run it, this box pops up. There's nothing
in here because we haven't done anything yet. So we can just go ahead and close it. And
now if I pull up a little thing here and go into my C drive and look at gooey, you see
now this address book, that DB database file exists it created for us inside of it, presumably
it has the table that we just created as well, we won't really know till the next video when
we start putting data in and see whether or not it worked to find out if it did work,
but I think it worked. That's pretty simple code right there. So in the next video, we'll
start to build out our kinter app with fields and stuff. So we can type in people and their
addresses to add to the database. And that should be cool. I should mention very quickly,
on my website, I've got an entire course on sequel lite with Python. So if you really
want to get into the nitty gritty of this, check that out is $29 for the course. But
of course, if you sign up for total membership, using that coupon code, YouTube, you get all
of my courses for just $27 In which case, you'll get this one for free. And it has it's
an hour and a half long, 22 videos, and it has all the stuff and in much greater detail,
we're not going to go into great detail in these videos right here, I'm just going to
show you some basic stuff. And you can learn more later if you want. But definitely worth
checking out if you're interested in all this database stuff. In this video, we want to
start to build out the graphical user interface, the things that allow us to type in entries
and save them into the database and all that good stuff. We got our database.py file from
the last video we've connected to our database created the database, we have our cursor,
we've created our table. Now we can comment out the table because we don't want to recreate
the table. Every time we run the program, we just need to do it one time. So now we
can add stuff to the table. And that's what we want to look at in this video. So the first
thing we want to do is create some text boxes that we can type information into. So we want
one for first name, last name, address, city, state and zip code. And we're gonna use entry
boxes entry widgets with TK, enter, enter. We've done this in previous videos, so you
should remember how to do it. If not take a look back at the older videos. So I'm going
to create one called first name. And let's call it's an entry widget. And we want it
in route and we want the width to be what say 30 ish, it's probably good. And we need
to now put this on the screen. So F underscore name dot grid. And we don't want to pack this
because we're gonna have a whole bunch of stuff here. So we don't want to really just
pack everything, we want to have a little bit more sort of options to place them exactly
where we want. So of course, we're gonna use the grid system. So we want this to be in
a row equals zero and column equals zero. And for this one, oh, first, let me just copy
this. And then for the first one here, I'm also going to put excuse me a pad x of say
20 just to patent a little bit. So now we need one for last name, address, city, state
and zip. So I'm just gonna copy and paste. So last name, address, city state zip. And
then just come through here and change these to L name. This one will change to address
and address. This is very glamorous work here. City, city and state and state. And finally, zip code
and zip code. Okay, so we probably want them in column one because we need to put text
next to them a little label to describe which you know boxes which so it's probably changed
this to one for each of these Now that I think about it, it's a good thing to think these
things through for our session of really. Alright, so the first one is in row zero,
the next one we want on the next line down. So that's row one, row two, row three, row
four, five. And that looks like yeah, so all right, we can put these all back together
here. And let's make a little comment, let's say create text boxes. Alright, so like I
said, we also want to create text box labels. And, let's see, let's just go let's call him
first name underscore label. And that's, of course, going to be a label. And we want it
in root. And we want the text to equal first name. And that should work. Now we want to
first underscore name underscore label dot grid. And we want this to be row equals zero,
and column equals zero. Okay, so same deal, we just need one now for last name, address,
city state, zip. And just come through here and change these again. So address label and
address label. City label, city label, state label, very exciting label as zip code, label, and
zip code label. And again, we want row 123 or, and five, and up here, we just need to
change these to last. And then again, address bear with me, city. The joys of Kansas State.
And finally, zip code. All right. These all together, I just put line spaces just so it's
a little easier to make sense of it as we're typing them. Okay, so now, we also need buttons,
right? So let's create, we want to create a submit button. Right? Okay. So let's call
this submit underscore button. And that's going to be a button. And it's going to be
on Route and the text is going to be what? Add record to database works. And we want this to have a command and let's
just call this what Submit. Good. Alright, so we want Submit button dot grid. And where
do we want this? We want this in row equals six, because under underneath there, and column
equals probably zero, right? And we'll probably want this to span across both columns. So
let's go column span equals two. And what else do we want, I probably want to put some
padding so pad y equals 10, let's say, and that'll put it down a little. And I want pad
X to equal probably another 10. That'll put it over a little bit. And I want iPad X to
equal 100. So want to stretch it out a little bit. Okay, so I think that will work. Now
we need to create this submit function. So let's kind of head up here, somewhere up here. Looks good. And let's go create submit function,
or database, I guess. So define Submit. And let's just return it for now. Actually, let's
clear the text boxes. So every time we enter stuff into the text boxes, and click the button
to submit it into the database, we want those text boxes then to clear so then we can afterwards
type in another record if we want. We don't want that information to just be sitting there.
So we can do that with F underscore name. Call the actual name of the entry widget dot
delete, and then give it a zero and n and we just do this for each one first name, last
name, address, city state zip. And one more time. Fun work of typing these and over and
over address. City. State and finally is zip code. Alright, so let's save this and run
it, pull up our thing here and we want database.pi. Pull it over, and it's looking pretty good.
So now if we type some stuff in here, and then click this button, boom, it disappears.
Alright, so far, so good. Not bad. So now, what do we want to do, we need to actually
create some code to submit the stuff that we type into the database itself. So the first
thing that's kind of weird, is you gotta connect to your database and create a cursor inside
of your function. When you use functions. I'm not really sure why that is, but it is
the case. So make sure these tabs over. And let's head down to the bottom here and grab
these two lines, we want to commit our stuff and close our connection, we need to do that
inside of our function as well have those over. Okay, so now, how do we actually submit
the stuff from our form? Right? Okay, so let's go insert into table. Right. And just
like before, when we had our C, ad execute, to add to create a table, we're going to again,
see that execute. And we almost always execute our cursors, just what we do. So we're going
to use SQL now to insert into, and we named the table that we want address says, right,
and the values of something, right. So before we use this doc type, string, thing, Doc string
doc type, whatever it's called. This time, I want to use placeholder variables, just
a different way to do it. And you do that by just creating sort of dummy variables,
and you start with a colon, each one starts with a colon. So I'm going to name these the
same as our text boxes, you can name them anything you want, but it makes sense to name
them what they're going to be. So first name, underscore last name, apps, we need a colon,
separate them each with commas, and then colon address, comma, colon, city, period, a co
comma, colon state, colon, zip code, okay. Now, at the end of this, we need to, oops,
there we go. Stick a comma, and then come down. Now inside of here, we need to create a almost
at Ruby dictionary, a Python dictionary. And it's just this. And Python dictionaries have
key value pairs, and the key will be this dummy variable. and the value will be whatever's
in our textbox. Right. That's how that works. Pretty simple. So let's go. f underscore name, and you separate them with colons. And then
remember kinter variables, we can get them and set them well entry widgets are like kinter
variables, we can get or set them. So that's what we're going to do. So let's go f underscore
name, dot, get, and then comma. And then just on the next line, we just go through and do
one for each of these last name, colon, l underscore name dot get very exciting work
here. Address, colon, address dot get. And then what city colon, city dot get. And then state, colon, State DOT get. And
then finally, zip code, colon, zip code dot get. And this is the last one. So we don't
have to put a comma. And remember, these things are these. So if you named these up here,
ABCD F, this column here would be ABCD. F, we just happen to name them the same as we
named our widgets, our entry widgets, just because that kind of makes sense. All right,
so now we can do some stuff here to make this look better. Okay, so if we save
this, and we can run this just to make sure it worked. Now, we're not going to be able to see if
it worked yet because we haven't created any functionality to output the stuff from the
database onto the screen, but at least we can see if we get an error. So let's go john,
Elder 10 West Elm. He's live on Tim West Elm in Chicago years and years ago, live in Vegas
now, but he's living very cold Chicago downtown. Pretty cool. So add record, boom, it disappeared.
And if we end it, we didn't get any errors up here. So we can assume that it added the
thing in, and we're good to go. Okay, so now we need to create a button to actually pull
whatever's in the database out and then put it on the screen. So we can see whether or
not this first part worked yet. So let's go down here. And let's just create a query button.
And we want to call this white query underscore button. And this is a button, we want it in root and we want the text to
equal what show records maybe that's probably good. And we want to give this a command of
what let's call this query, create a query function. And we want to query underscore
button dot grid this thing. And so we're on row seven now, column equals zero. And again,
we want to column span this guy to two. And let's go pad y equals 10. And pad x equals
10. And let's stretch this with an iPad. x equals 137, which I happen to know is, is
a very nice size. So if we save this real quick and just look at this, we can see up
name query is not defined, we got to create that function real quick. So whatever we call
it, query, let's head up here. And let's say underneath our submit guy, submit function,
let's go create query function. And let's go define query, qu, er y. And let's just
return for now. Alright, save this, to cancel that. run this again. Boom, now, what did
I, oh, I misspelled column span, I do that sometimes. Column span. That's ugly typo.
Alright, so save this, run it again. Third time's the charm, and boom, so that button
looks pretty good size compared to the other one. And of course, it doesn't do anything
yet. So we can close this, clear the screen. Okay, so querying the database, we haven't really talked
about this yet. But it's, it's fairly simple. Again, let's come up to our submit guy. And
let's copy, we still need to connect to the database again. And we still need to commit
and close. So grab that. There we go. Okay, so to query the database, it's pretty
simple. We just, again, use our cursor and execute like always, so it's that C dot execute,
as a function. So inside of here, we want to run some SQL SQL command, we want to execute
our SQL command. And the command we want is select. So we want to select and what do we
want to select want to select everything. So the star means everything. And we want
to select it from our addresses table. Right. So one more thing we want to do is, in most
databases, you have to designate and create a primary key for each record. And a primary
key is a unique record a unique number. So you know, every single entry you make, it's
a unique sort of ID number. And in SQL lite three, it creates it for you. So we don't
even need to do that ourselves, which is really, really cool. But it kind of ignores it, since
it creates it for you and ignores it, unless you specifically tell it to print that number.
And we kind of want to see what that number is. So we want to select everything. And the
O ID and o ID I'm not sure what that stands for. I don't even remember at this point,
original ID maybe? I don't know, but it's the primary key, right? So primary keys are
useful for a lot of different things. Specifically, later on. If you want to delete a record,
you don't want to delete john elder because there might be 20 records of somebody named
john elder, but each record has a unique ID. So you can delete record number 87, for instance,
and there are no other records that have the ID of 87. So that's what that's used for.
So, okay, so we can we create this this command here, want to select everything and our IDs
from addresses. We also need to then do something called fetch also see, fetch all and fetch
all does just what it sounds like it fetches all of the records. Now you can do fetch one,
and it will just bring back one record, the first record, you can do fetch many. And then
in here, say, designate how many records you want to fetch 50. For instance, we don't want
to do that we just want to fetch all. Okay? So normally, you could just print out, see,
well just print out this thing, right. But this is kinter. And print doesn't really work
with kinter. So we need to create a label and kind of print that onto the screen. But
first, let's just run this by actually doing that, well, actually, instead of using CDF
fetch all let's smash that into a variable so that we can then put that variable into
a label, as we've done so many times. So let's call this records and set that equal to that.
Now we can print out records, and it won't print it to the screen in our app, but it
will print it to the terminal after we close the app. So let's run this real quick just
to see what this record looks like that we've already put in and back over, run it again. And if we click Show records, nothing happens.
But if we then close it, we see boom, this record appears. And you'll notice these brackets,
that means that means that this is returning a Python list. And inside of that list, there
is a python tupple. And then inside of the tupple, you can access each of these things
by their index number. So john is zero if item in list and the tupple, 12345, and then
six. So that's the way it's returned. We can of course, do anything we want with this information,
this data, we can sort it out and put it on the screen however we want. So what exactly
do we want to do? Well, instead of only that print there for now,
in case we need to troubleshoot. But since we just have one record, let's go. Let's
create a for loop. Right, so let's go for what do we want to call this. So we've called
this one records. So let's call this for record, and records. Right. And then we want to let's
create a variable called print records. And we want that to plus equal out whatever is
in records. And since since it's a list with a tupple, inside of it, the zeroeth item of
the list is our tupple. So we can actually call the zeroeth item will change this in
a minute, you'll see why. But for the very first time we do this, since there's only
one record, we can do it like this. Now I want to sort of print out record, right, which is the item in the loop that
we're going to loop through. And we also want to concatenate and then put a line break. And the reason why I want to do this
is because we're going to create a label here. And we want each item that gets printed out
to be on its own line. So we have to put a line break in here. Now, this is a problem
because record the thing we printing out, you can see one of these a couple of these
things are integers. And you can't concatenate a string with an integer. So we actually need
to convert this whole thing to a string, which is not too hard, we can just wrap this whole
thing in the string function. Okay, so now, outside of this loop, we want to create a
label. So let's call this the query label. So we're making a query and set that equal
to label. And then it's in route and the text we want
to be print underscore records. Right. Now, we actually need to before we start looping,
we need to create that variable and set it equal to nothing since we're not function
here. And that's how that works. So let's go loop through results. So finally, we need
to query underscore label dot grid this thing out, and I think we're in row eight. Now, down here and look. So row seven is the last thing we did. So
now we're in row eight, and we want column equals zero, and we need to column span this
thing out to be equal to, and I think that will work. So if we save this and run it again.
Pull this over, click Show records, boom. On each line, we get an item in that tupple
john elder, and we could do whatever we want with these things. Okay, so that works with
one record, but we're going have more than one record. So let's create
another one real quick. Let's go Bob Smith. He lives at 20. East, cedar, cedar street? I don't know. St. Louis, MO, Missouri. What's the zip code? Is there
six to 901? Who knows? Okay, so now we add this to the record, boom, it disappears. If
we click here, nothing happens. Why? Well, let's close this. And we can see, whoops,
it looks like this has been added twice. What's going on there? Oh, that's from the first time we click the button.
disregard that. Okay, so look, when we call this loop, we're calling the zeroeth item
in our list, which if we pull this back up, here's our list. And there are two items in
it. Item one is this tupple. And then there's a comma. And then here's item two. So we're calling
item one, or item zero, which is this item zero with item. So that's the only thing it
prints to the screen. We don't really want to do that. So let's just take this off, and
just print out everything. Alright, so if we save this, and run it, let's clear the
screen, run it again, pull this over show records, boom, now we get each tupple printed
on its own line. And it has, you know, everything inside of there. That's in our records. Then
we see the last thing is the ID the primary key the O ID. So there's one, there's two.
Very cool. So now this is tumbles, we know from just regular Python, how to do stuff
with tupple. So we can format this any way we want. And it's still printing this out
on the screen. So I think now we can get rid of this print thing right here. I'll just
comment it out. And in case you want to reference this code later, but down here, let's see
in our for loop, we can tell this to print out anything we want. So each record is an
item now is a tupple. And inside of that it has item numbers tupple numbers, right. So
the zeroeth item of each of these records is the first name. So if we just do that,
and save this and run it now, we will get first names printed. JOHN and Bob. Right.
Very cool. So you know, we can do anything we want. With this, we can concatenate some
more, let's put in a space, and then concatenate again. And then let's just grab this whole thing and paste it and then concatenate the line
break again. This guy needs a quotation mark. Okay, instead of record, the zeroeth item,
let's call the first item, which is this the last name, excuse me, save this, run it again. Hold on over show records. JOHN elder Bob
Smith. Very, very cool. If we add another person, Tina Miller, I don't
know. She lives at 89. Apple Street. And I don't know what's a good town, New York,
New York 1092. I have no idea what the zip code is there. If we add this boom, that disappears.
If we click this button again, boom, Tina Miller pops right on up. So like I said, you
could format this any way you want. I'm going to leave that to you. I'm just showing you
the basic functionality of how to do these things. There's 1000 ways you can create reports
and things and output data however you want. That's the beauty of Python and kinter. So
I'll leave that to you. I think in the next video, we need to build a thing in here to
delete a record, if we want to remove Bob Smith. There's no way to do that yet. So we'll
do that in the next video. In the meantime, if you're interested in this database stuffs,
specifically the sequel lite database, head over to my website, coding me calm, I just
released a course not long ago. And SQL Lite. This is just pure SQL lite and Python. And
it's 20 videos hour and a half long, and cost $29. Of course, you can sign up for total
membership using that YouTube coupon code I'm always going on about and you'll pay just
$27 for all of my courses, including this one, which is better than one course for 29.
So if you're interested, definitely use that coupon code. Some people don't understand
it. And you'll learn all of this stuff in great detail really go in in more detail than
I'm going to go into in this series. I'm just going to show you some basic stuff right now.
Like I said, if you're interested take a look at that course to learn, you know in depth
stuff about sequel light. In this video, we're going to take a look at how to delete a record
from our database. Let's just run this real quick and show you what we have so far. So
here Our database, we can add things in here, click the Add button, it adds it, we can show
them. And we have john elder Bob Smith and Miller, we can, you know, configure this to
output any of this stuff that we want. But just to make it easier, we've just put the
first and last name, I think right now let's go ahead and add the user ID number, that
o ID number that we talked about earlier, because we're going to need that in a minute
to delete records. And I'll go into why that is. So let's pull our code back up. And go
to the C query section here. And down here, where we're outputting. The result on the
screen, we have first name, which is this record, the zeroeth item of the list, I guess,
the tupple. And then the first item is last name, I believe the the ID is the sixth or
the fifth. So let's just go ahead and continue concatenating. And let's add another space,
and it got catenate again, and here, we just want to copy all of this. In between these,
just paste this in. And I'm not sure if it's the fifth or the sixth. Let's try the sixth
and see. So let's save this, run it again, real quick. Hold on this over show records. Okay, that was right. So now
we're getting this number next to these. And that's cool. That works. Let's see, we can
get a little crazy if we want. And this might not work, but let's add another plus. And
then inside of here, we can put a Backspace, a backslash T stands for tab, if we want to
tab that over a little bit. So let's save that. And give it a look. This may or may
not work, it'll definitely work. But yeah, okay, because sometimes if these don't line
up correctly, the tabs go over a little bit too much or not enough. So okay, so we now
we have the first names, last names and the ID at the top here, we could put a little,
you know, a thing that said first name, last name, or a little field that says name, and
then a little field that says ID number or something, we'll just leave it like this for
now. Um, let's see, I'm seeing this right up here. This is bothering me, it's shoved
right up to the top, let's push this down a little bit, we can add some padding to this.
So we just want to do this first name in this text box here real quick. I'm just going to
scroll down to the text box section. So here we have, here we go text boxes. So first name,
here, I'm just going to add a pad y and set that equal to no we haven't done this before,
you can add a tupple here, if you only want to add padding to one side. So I just want
padding on the top. So that's I'm going to add 10 to the top. And then I can go comma
zero, and I want to put no padding below. So we'll do that. And we could just copy this
whole thing. come down here to the label, I want to do the same thing to the label.
That's right there. There we go. So let's save this and run it just to see what we have
here. Playing around at this point, because it's fun. Okay, that looks a little better.
It's pushed down a little bit, and they still all line up. So okay, now we want to talk
about how to delete records. So if we click the Show records, we have these records, right,
john elder Bob Smith and Tina Miller. And we want to delete them. Now there's a couple
of ways to delete things you can say, you can look for a specific record, and then say
delete this record. But what we search for is important. So if we said search for john
elder and delete that record, that will work. But there may be four or five john elders
in our database, common name, right John's a common name elders, fairly common, you know,
Bob Smith, there might be 50 Bob Smith's in your database. So if you say delete Bob Smith,
that command will go through and delete every single Bob Smith in your database. And you
probably don't want that. So we need to search by this o ID, this primary key number is user
number to delete things because each record in our database only has one specific unique
ID number. So if we say, you know, get rid of Tina Miller, she's number three. If we
say delete number three, we'll just lose Tina Miller, which is what we want. So how do we
actually go about deleting things from a SQL database? Well, it's pretty simple. And we
can come up here and let's just come somewhere up here to the top of our thing, and let's
go create function to delete a record. Alright, so let's define our function and let's call
it What? Delete? probably good. Now inside of here, we want to do all the
same things that we've done in the past, which is connect to our database and create a cursor.
We can do that and then commit our changes and close We can just paste these in here.
And inside of here, let's go delete a record. So how do we do this? Well, it's pretty simple.
It's just like everything we've done, we use our cursor, and we execute a command, as we've
always done. And the command that we want is delete from and then name the table that
we want to delete from. And if you remember our table, his address is right. And then
now we want to use something called the where clause, and it's just a sequel clause. So
DELETE FROM addresses, where, and here you designate the column that you want to search.
And so we want the O ID column, where the O ID equals and then what? What do we want?
Well, let's put placeholder here, for now. All right. Now I'm seeing this does not look
right. So we need to wrap all of this in quotation marks. Okay. That's right, delete from your
database table addresses, where ID equals placeholder. Now we can do the same thing.
We could go where f underscore name equals, and then put quotes. Well, we need single
quotes. JOHN, right, we could do that. But like I said, that'll
give us the problem where it will go through and delete every single john in our database.
So we don't want that. Of course, what we want is Oh, ID equals place, holder. Now we'll
create we'll change that placeholder in just a bit. So what we need now is in our app,
we need a box where you can type in the number of the ID number that we want to delete, and
we need a button to actually delete. Let's go do that real quick. And let's just come
down here, create text boxes. underneath here, let's go create. Well, see, we have some more down here. Yeah, let's just
go down right here. And let's go create a delete button. And let's just copy all of
this. And paste it in. Instead of query button. Let's call it delete button. Anything here,
delete button. And this is not row seven. This is what we're on. There was a row eight
here. So I think we're on row nine, maybe, let's try that we're in row nine column span
is to add extra pedway. I have no idea what this is going to be. But the command we want
here is delete, right? Because that's the funk function we created. All the way up here,
just now this delete function, right? Okay. So let's change this to delete. Record. So
let's save this and just run it real quick to see if the formatting is correct. It's
probably not. Okay, so this buttons a little bit bigger, so I'll probably knock off what?
Let's go 135 on the iPad. x, save this, run it again. This is just for show basically.
Okay, that's pretty close. Let's add back one more. So 136, save that. Run it. Okay, that's pretty, pretty good. Now we need
probably what above this. We need a little label and a box that says, you know, ID number
or whatever. So okay, let's do that. So I'm gonna add these think right here. So let's
go delete. Let's start with the box itself. Right here. Let's go delete. underscore box.
I don't know name it whatever you want. And it's an entry box and it's in root and the
width equals 30. Like all the rest, and then we can go delete underscore box dot grid.
And we want this in row. Let's go. Row equals nine, column equals one. Okay,
I think that will do. Yep, and then for a label for the same guy. Let's go delete underscore
box underscore label equals Label. And that's in route and the
text equals ID number, I guess. Or we can do it out like that ID number. work. And again,
we want to read this onto the screen. So delete underscore box label, dot grid equals row
equals 10. column. I could type column equals one, no, zero, right. So now we have to, let's
put this back up here. Now we also have to change since we put these two rows above,
we need to change our button to row a lab n. Okay, I think that worked. Let's save this
and run it just to make sure everything looks okay. And it is not everything's all sort
of messed up. Oh, we need it to be the same row, obviously, doi. Alright, so this should
be row nine. And then we need to change our button to row 10. All right, it's Monday morning,
you got to bear with me. Monday morning in Vegas. Alright, that's better. IDs, sort of, kind
of weird. So let's go back and change it to what do we want? What do we have it before
it was? Id let's go delete ID. So we're really explicit in what's going on here. Okay, our good. So now we want to be able to, you
know, if we show the records that's showing up, we're probably going to want to change
that to put it underneath it. So let's do that right now. The fun with Cantor. So that
would be the query. And here the query label. So instead of row a, we want row 11. Now,
so let's save this and run it make sure this is working. Okay, the good stuff in this video.
Alright, so show records, boom, that pops down below there, you might want to play with
the padding here, this is kind of close this there's more space in between these two than
there is in between this. So just you know, you might want to do that. I'll just leave
that for now. You can play around with the padding in this stuff if you like, right,
just add a pad wide to these two. Well, let's do that right now. Why not doing all the things
this morning. Alright, so back down here to our delete. And here, we'll just go what pad
y equals, let's add this five, delete box label. Where's the actual delete box right
here had y equals give that a five, save this, run it again. Okay, it's looking a little
better. I like that. Okay, so now we need to fix our delete record button to actually
delete a record. So let's say well, we'll do that later. actually delete one later,
after we fix it, let's clear the screen starting to get a little crazy. Alright, so when we
click this delete button, it calls the Delete command, or the Delete function, which is
up here we did at the beginning of this video. And we want to get rid of this placeholder.
And this is kind of a strange thing we don't want to what we're going to do is come down
here and get our let's say delete box entry. And we're going to get that
like we've done before, but your instinct is going to be to go delete box dot get like
that. But that doesn't work. What you have to actually do is concatenate that on afterwards.
So if we save this, now come back here and run it and pull this over, we can show our
records Bob Smith. Let's delete number two. If we show the records, again, some weird
formatting here, but it goes from one to three. Now if we close this and run it again. Sure
our records we see. Number two, Bob Smith is gone. And it was just that easy. So pretty
simple delete from your table where o ID, which is the primary key that we've talked
about before equals and then concatenate this on here. Now this is a string. Now this is
weird because it's an integer in the database. So you would think it would need to be an
integer. But you can't concatenate an integer on here. So for some reason, with the kinter,
you can pass an integer like this as a string and it will still deleted even though the
database has it as an integer. So that's how you delete from a table. Not too bad. And
in the next video, I think we'll learn how to update a record. So we have these things
here. What if we misspelled Miller? How do we change that, we'll look at how to do that
in the next video. In this video, we're gonna look at how to edit or update a record. And
I thought we create a whole new window that pops up that has all of the updating editing
stuff in it, as opposed to trying to cram more stuff onto this screen, which is starting
to already get kind of full. Or we can do it all on the screen have the record update
right in these boxes, but that seems a little complicated. Plus, it allows us to create
a new window. And that's kind of fun, we learn how to do that several videos ago. So if you
need a refresher, go take a look at that in the playlist. So first things first, I'm going
to change this delete ID to select ID. So from now on, if we want to delete a thing,
we select it, and then click the Delete button. If we want to edit it, we select it and click
the Select button. So I'm just going to change that, that word right there from Delete to
select. So let's find the delete button. Here it is right here. And let's go select I guess. Okay, and if this is the first time you're
watching, this is the code we've been working on on all the videos up until now. So you're
going to want to go back and look and see how we made all this stuff. So now let's create another button right below this
one. And let's call it let's go create an update button. I think update would be a good
thing, as opposed to edit doesn't really matter. And let's change this from delete button to
edit button or update button whenever you like. And it's going to be row 11. Now, in
our query field or query function, it puts the output on row 11. So we need to probably
change this to 12. Put it below this button. That will work. Alright, so instead of select
record, we want this to say update, record or edit record. and edit is smaller than delete.
So the button itself needs to be a little bigger 145 ish. Probably will work. Alright,
let's save this and just give it a quick look to see if if that worked. Close it, run it
again. Hold on over. It's pretty close. Maybe a smidge smaller maybe. And if we click Show
records, the stuff still shows up below. So that that's looking good. So yeah, let's change that from what was that? 145 to 144.
Just piggy at this point. Still a little bit too big maybe? on 43. I don't know I'm just
playing I kind of like doing this stuff. Alright, that looks better. So now that changes delete
ID to select ID. Where's that? That is the delete it right here. Select ID
forgot to do that. Alright, save this. Give it a quick look one more time. Okay, so now
it says select the ID there we get select. Oh, that's why this should still say delete
record, not select record. That's weird stuff going on this morning. Alright, so delete
record, not select record. Okay, so save this, run it one more time. Hopefully we got it
right this time. Alright, so select ID, we could select whatever. If we wanted to delete
it, we click that button. If we want to edit it, we click this button, we haven't actually
created an edit or update function. So let's go ahead and do that right now. Or at least
start to do that. Alright, so notice where we created this update button. I just copied
this code. So the command is delete. We don't want that. Let's go. Edit. Yeah, that sounds
good. So now I'm going to come up to the top of our program. And any old were really let's
go define, edit. And let's give this a comment. Let's say create. Edit function to up date. A record. Okay. So, like I said earlier, we want to
create a whole new window for this. So I'm just going to come to the top of our program.
And I'm going to grab all of this stuff. And we can just paste it right in here and make
sure it's tabbed over. And instead of root What do we want to call this? Let's call it
editor. So we need to change each of these route guys, editor and the title let's say
update. A record I guess should really pick, edit or update I keep using both of those
words, whenever I so let's save this and run it to make sure that worked. After the day
I've been having so far who can tell if it'll work or not. Okay, so here we go, new window
pops up update, a record says up here, it's the same size as our old one. So that's good.
Okay, cool. So now, inside of that new window, we want the same boxes and labels to show
up as that's in our main window, so that we can, you know, edit those if we like. So I'm
just gonna come down to where we've listed those boxes here, we're just going to copy
all this stuff. And let's come back up to our editor function. I'm just going to paste
it all in, highlighted all again, like this, and make sure it's all tabbed over. And since
these are in different windows, we can probably keep the name the same. But I'm always kind
of leery of that just because it's kind of confusing. So I'm going to go underscore editor
and just rename each of these things underscore editor. Oh, I'm just gonna use the mouse,
click and paste and click and paste and click and paste every single thing. And we could
do the same to the labels, but we're not going to be changing the labels or anything, so
I'll just leave those the way they are. We don't need the Delete box, we can get rid
of that. And that. So that's looking good. Okay, now, these, we want them to show up
in the editor window, right. So whenever we create a thing, we always specify right here
where it goes. And these are all root by default. So we need to change each of these editor,
editor editor, the editor, editor editor, same thing with the labels. Um, okay, so that looks pretty good. Let's go
ahead and save this and run it just to make sure everything's coming along correctly.
So edit record. Alright, that's looking Okay, now we want a button underneath that says
save. So whenever we change these things, we can click the button to save those changes.
Alright, so let's do that right now. And we're going to come down here to all of our other
buttons. I'm just going to copy one of those and bring it back up to our edit function. Now, we don't necessarily have to do all these
things in the Edit function. But I like to keep all my code sorted together. And we want
to create a Save button to save record. Save edited record. Okay, so we want to save record.
And let's see, we're in row five. So now this needs to be six. And let's give that let's
give it a 145 and see how that looks. All right. So let's save this and run it just
to make sure that worked. Edit record did not work. Alright, what do
we do? Ah, put it in root. This needs to be in editor, of course. So save that, run it again. See that worked. Edit record.
Alright, save records, decent size. All right, coming right along. Now. Next, we need to
sort of propagate or whatever you want to call it these fields, with whatever record
we have selected, right. So when we click Edit, this will pop up. And it will have record
number three, Tina Miller already filled in each of these boxes, right? So how do we do
that? Well, same thing, we've done many, many things in the past, we want to
come down to our C query function, and just copy this stuff, basically. Yeah, copy all
of this. So and come up here. And right at the top of our function here, I'm going to
paste all the sense. So we need to, of course, as always connect to our database, create
a cursor, and execute it. Now we want to select everything. We don't necessarily need the
O ID, we're already going to know what that is from addresses. But now we need to designate
the specific field. But before we do that, let's create a variable for that field. Let's
call it record underscore ID, and set that equal to what? Well when we run this thing
The select box used to be the Delete box, they come down here and get the name of that
is let's see, where's that delete button now delete box, right where it says select ID,
we want that box itself, the Delete box, which I guess is this guy. Let's copy this back
up to our editor. And we just want to slap that into a variable. And so we get that remember,
we get, we get things from boxes all the time. And now we can take this and reference it.
So we want to select everything from addresses, where Oh, ID equals, and then let's just concatenate
that on there. That should work. Yeah. Okay. So now, we want to sort of cycle through the result,
the Select result, and then put each of those things in one of those in each of those boxes,
right. So we've already kind of done this before, we use the for loop. So we went, let's
see, we go for elements, make comments, let's go loop through results. So here, we can go
for record in records, right. And then remember, each item that comes out of here is a list
item, right? So the zeroeth item is the first name, the first item is the second name, the
third second item is the address, city state zip code, right? So we can print out each
of those things. And we can do that just by using an insert command for our boxes, right.
So we have F underscore name, underscore editor, dot insert, right, and then we have to put
a zero in front of it, we looked at insert when we learned how to do entry boxes, right,
those input boxes, and then we just put that thing, right. So we could just do this for
each item in our database. So first name, last name, address, city state zip code. So
here, we just change this to L name. And that address, city, state zip code, right. And then we need to change
each of these ones. So 12345. Alright, so actually, we don't need this code, I just,
I just rewrote it. But remember it from our query, we're just pulling out each of these
things. Remember, just like we've done right here, here and here. Okay, so we can get rid
of this. Now, there's one more thing we need to do, we've got these boxes created. And
they're below this for loop. So we kind of need to put this underneath. Whoops, get the
comment. So I'm going to copy this. And let's put that underneath these boxes. Okay, so
that should work. So let's save this and go ahead and run it. See how we did. So we need
to show our records. And let's say we want to edit Tina Miller, she is number three,
we type her in there and click Edit record, the new box pops up and her stuff is all listed
in there. And we click this save record, we haven't actually built it to do anything yet.
Now, we just need to fix this button to actually record when we press it. So let's come down
to our edit function here. And at the bottom of this, we have our actual button here. And
we've got it pointed to the Edit function, that's no good, we need to create a new function
to actually save this stuff. So let's call this update. And that should be okay. And
I'm just going to come up here above here. And let's just define update. And we don't
need to pass anything in here. So like everything we've done, always we need to do a database
connection and a cursor. So I'm just going to paste that in here. And like always, we
need to say, close our connection, commit any changes we
make. And we also want to delete the stuff that's in those those fields. So well first,
let's just do this. And we go alright, in our update guy, and like I said, we want to
delete all those things. So let's look at the I think it's the query, know the submit
button at the bottom of this, we have all this code to clear the boxes on the original
windows screen. So let's just copy this, and paste that in here. Because we definitely
want to do that. Actually, let's do it after we've closed our connection. Now these boxes
aren't named correctly. So let's go down to our edit field. And our boxes are f name,
dash editor. Last Name dash editor, city, dash editor, agile everything dash editor.
So you just come up here and kind of paste all this in. Oh, you know what, we don't really
want to edit these, or we don't want to actually do that. Anyway, we just want to close the
whole thing. So we'll just close this whole window, and we're done. And that should be
a lot easier. So okay, so now let's just worry about what code we need to actually update
our database record. And we've sort of I don't know if we looked at this before, but we want
to see that execute. And then the command, we want to use these triple quotes, so that
we can do this on multiple lines, those are doc strings, or doc types I can ever remember
doc string, dot doc type string, maybe I don't know, you can look it up doesn't matter, three,
three quotation marks to open and three quotation marks to close is what we're looking at. So
what we want to do is we want to update, and we want to update our table, which is addresses
SSE s address says, Yeah, that's right. And then we want to set. And now we need to designate
what we want to set. So remember, when we first created our table, we named these columns,
these things. So that's what we're going to use down here. So we're gonna go first underscore
name, equals, and then call this first. And you'll see what this colon first is in just
a second. Last underscore name equals, last, separating each of these with a comma, address
equals address, I would have got city equals city, state equals colon state. And finally,
zip code equals zip code. Right? Okay, now, we don't need a comma for
that last bit. I'm going to come down here, and we need to continue on with our SQL statement.
So when you update SQL, you update the table, and then you set certain columns, where certain
things equal certain things. So we need to put a where clause in here, where now Oh,
Id This is our primary key, where Oh, ID equals colon o ID. And then the three ending quotes.
Oh, actually get rid of those. Okay. So what we're saying is, the record we pulled up has
a specific primary key. In our case, it's three, right? So we're saying update these
things, these columns. With this information for each one, where our primary key or row
ID equals some o ID, that will designate in a second here. In our case, it'll be three
because we're updating record number three, but if you were updating, updating record
number 27, you would, you know, it would be 27. But it'll, it'll find that out on its
own. So all right here, this is all the SQL command. That's, that does the things. But
now we need to sort of designate what these things are. Right? We have to tell our code,
what is colon city, what is colon state, and we do that just right after the comma here,
and we just create a Python dictionary, bring this up. And inside of this dictionary, we
just designate each of these things as the key value pair of the dictionary, this, these
things are the key. So we're gonna go calm or a quote, first. You don't put the colon
in front of it, you just use first and then a colon afterward because it's a dictionary.
That's how you separate key value pairs in a dictionary. Now, we need to just say, what
is the data we want to put in there, and this will be if we go down to our edit would be this right and we need to dot get that now We also need to make a quick change to
our edit function. Because these guys are being used inside this function, if we want
to use them in another function, we need to make these global. So let's go create global
variables for text box names. And then I'm just going to for each of these, we just type
in global, and then the name, right, that's all we have to do. So let me just copy and
paste this a few times. So last name, address, city state zip code. And then we can just
pop each of these in address underscore, editor, city underscore, editor, state, underscore
editor, and zip code underscore editor. Okay, so save that, that will work. Now we can use
these, each of these up here. So now all we have to do is just kind of go through
here. And for each of these go, last. And again, that's this guy right here. colon,
and then it's l underscore name, editor, dot get. As we've gotten things a lot, we get
things all the time. See, the next one is address. And that's address underscore editor
dot get. This is the boring part, city, colon city underscore editor dot get. And state colon state underscore editor dot get. And zip code, which is zip code underscore editor dot get.
And then one more we also have to have and that is O ID, colon. Let's call this record
underscore ID. All right. Now this we need to designate up here. So let's go
record. underscore ID equals delete underscore box dot get. And that is if you think way back in the first
bit of our code here, when we let's see, let's just run this real quick and see here. So
it's this box right here. So when we show records, and we type a thing in here, this
is the Delete. Delete box right here. And so we need to get three which is the primary
ID, right? So if we go back to our code here, that's going to be all the way down here with
our buttons. Create a delete button, delete button, it's going to be the box. So it's
delete box. label, not right here, delete box. All right. Copy
that. Come back up here to our update function. And that's just this right here. Delete box.
Okay, so now Now the reason why we have to tack this on here is because we're Oh ID is
oh ID, this this thing right here, we need to define that. And that's where we do that
right here. And notice, these are just an order. So we have first last address, city
state zip and oh, oh, ID. So same. Same thing here. First, last address, city state zip
ID. I'm not sure that's necessary. Absolutely. But that's what you sort of do. So okay, so
I think that looks good. We're, this is our SQL statement, update addresses set each of
these things were our primary key equals equals the primary key. And then down here, you just
sort of designate them. And this is just the way you do it. When you have multiple things
that you want to update. You know, in the past, I don't know if we looked at update
in this specific set of series, a video video series, but you don't have to do all of this
stuff if you're just updating one column, but in this case, we're updating many columns.
So we have to sort of make this Python dictionary. So Alright, let's save this. And let's give
this a run real quick. Let's clear the screen. And we have show records, Tina Miller three.
So let's go edit record. So let's go It's not 21 Tina Avenue. It's 121 Tina Street.
All right. So now if we save this record, we can close this. Now if we want to edit
records again, this thing pops up. And now it's 21 teen Street. All right, so it actually did it now, it doesn't actually,
once we click this, you know, this thing should disappear. So how do we do that? We can just
give this up our code. After we commit and close, we can just go What did we call this
other window? Let's go down to the buttons. So much code going on, I'm losing track of
things here. Alright, so edit, we run the Edit command or edit function, which is this
guy. And we're creating this editor window. Okay, so that's the name of it. So in our update
function afterwards, we can just go editor dot destroy, is that the command we want?
Let's see, I think it is. We need that. I think maybe, alright, let's save this and
run it. Alright, so three, edit record. change this
back to Avenue. Save it, that did not work. editor is not defined. Well, let's make this
global mobile editor that do it. Try to get. Alright, so select ID three, edit record.
Avenue, changes us to 22 Tina Avenue, save it, boom, it disappears, we're going to open it
back up again. It's 22 teen Avenue changes back to street, save the record, boom, it
disappears. You can edit it again, it's back to St. Alright, so that is looking better. looking
pretty good. We don't need this entire extra stuff, we could just change this to this if
we want. Let's do that real quick. So when we edit, instead of 400 by 600, let's try 400 by 400. Let's run this again. Three at record. That's a little bit better.
Let's try what 300 maybe, is playing at this point, three edit record. And that's a little
better. Leave it like that for now. guys, in this video, we're going to build this very
basic little weather, Air Quality Monitoring app with kinter and Python. And in the next
few videos, we'll make this maybe a little bit more interesting. In this video, we're
just going to start out with the basics, connect to a third party API, grab some weather data,
bring it back do stuff to it, put it out on the screen, think air quality, think like
smog, Paul and stuff like that I live in Vegas, I love to hike in the mountains around here,
we're pretty high up above sea level. So a bad ozone day could really sort of affect
you more at these higher altitude. So I always want to check the smog and the air quality
before I go hiking. And there's this cool website, let me see if I can pull it up here,
air now.gov. And you can punch in your zip code and get the current, you know air quality
level in your area. So you know good is green, we have moderate this unhealthy for sensitive
groups unhealthy for everyone very unhealthy, and you know, Run for your lives. So we're
going to build this app. And you can see right now it's green 38. If it was moderate, this
would be yellow, right? If it was unhealthy, this would be red, etc. So we're going to
build out all this functionality in the next few videos. Now, there's an API that comes
with this you can connect to to get this data. So that's really what we're going to be learning
here, how to connect to an API out on the internet with a kinter project. So you know,
there are millions of API's out there. And if you learn how to connect to them from kinter,
you can use all of them. So you know, if you're not interested in air quality, that's no big
deal. You still want to watch this video just to learn how to connect to API's, and stuff
like that. So check out air now.gov. And I should mention as we build this thing
out in the next few videos, we'll make this a little bit more interesting. We'll make
it bigger and we'll put maybe a search bar where you can look up specific zip codes and
things like that for just for now in this video. We're just going to connect to this
thing and do the very, very basic stuff. So first thing you want to do is head over to
Doc's dot air now api.org. And this is their website where they have the API stuff, and
just go over to the login page, and see request an air now API account, click this link, and
fill out this form, it's completely free, you just have to fill it out with your email
address, they'll email you some a little link that you can click to, you know, prove your
who you are, or whatever, just go ahead and do that. Once you've done that, come back
here and just log in. Go, and you'll see this page. So go to the web
services. And there's all kinds of stuff, we can see the forecast or we can see the
current data. And you can do it by zip code. You can do it by lonneke, longitude and latitude.
If you happen to know your current latitude and longitude. Let's see you can do it by
I think there's something Yeah, bounding box, I'm not really sure what that is. We just
want zip code. So if you want to quick, take a look at the documentation here. This is
the stuff it's going to returns, if you want to read through here, it'll return that our
you know, the local time the area. So you know, in Rs, here, it says Las Vegas, it returns
us Las Vegas, so we know where the data is coming from. It also returns the state, you
can put Nevada on there, if you want to do I don't really care. So I didn't put that
on there. It returns the latitude and longitude. That's interesting, right? If you need to
look up latitude and longitude for some other project, and you just don't want to mess with
it, it's really hard. Use this, it will, you can enter a zip code into this thing, it will
return that latitude longitude that might be a good lookup tool for you in the future.
Keep an eye keep that in mind. parameter name, the Aqa This is the actual number. Now this
thing will return several numbers, it will return the aq II which is this, which is an
average of I guess, these three, so it returns ozone level particles, pm 10, and particles,
pm 2.5, and pm 10. And 2.5. Those are just the size of the particles. So these are particles
under 10. I don't know millimeters whatever unit of measure they use, and this is 2.5.
I'm going to say millimeters you can click on here, there's a frequently asked questions,
somewhere. Yeah, Fact Sheet maybe. All right here fact, your frequently asked questions,
it'll go into all that if you're interested. We don't really care what else category number,
and category name, these are the good, moderate, unhealthy, you know, Run for your life numbers
that sort of correspond to these things down here. So that's cool. Okay, so that's the
documentation. Now, to use this thing, we have to create a query, so they have a little
Query Tool, it's very cool. You can just enter your zip code, put the radius you want, I'm
gonna put five miles. And then here, it lets you select what kind of data you want to receive.
Now we want JSON, you almost always want to use JSON, when you're getting API data. So
now you click Build. And this is your URL, you can grab this and use it, you can also
run it just to see this is the stuff it's going to return if you're interested in that.
So okay, we're good to go now. So I'm gonna head back over, I've just created
a new file called weather.pi. This is the same sort of starter code that we've always
used. I'm gonna change this really quickly, though, to 400 by 50. So it's smaller, right?
And I just want to I'm just gonna paste in our URL just for future reference. Okay, so now we want to talk about how exactly do you
connect to a third party API out in the World Wide Web, the wild wild web, and then bring
the data back into your, your program and your project? Well, there's lots of different
ways you can do it, I always use something called requests. And it is. Let's just import
it here, import requests. And notice it's plural, we also need to decode the stuff that
it brings back. Now it's bringing it back as JSON. So we need to use and we need to
import JSON, JSON, JavaScript Object Notation comes with Python. But requests does not so
head over to your terminal. And I'm just in our C gooey directory where we've been doing
all this stuff throughout this playlist. And we just want to pip install requests. Now
I've already done this. So it says, hey, you've already got this. But you probably don't, it will download and install
it for you and you're ready to go. So that's really all we need in order to start using
this request. And I think you're gonna be surprised just how easy this is. So what we
want to do is, let's just create a variable, I'm going to call it a pri request is that's
what we're going to do. And this is going to be a requests dot get. And then oops, we want to spell request right requests,
right. And that's just this guy right up here, right? We're going to get, and then we just
want to paste in our all our whole query URL that we created just a minute ago. And you
notice it has my API key, and I don't use my API key. I'm going to delete it as soon
as I finish recording this video, so it won't work for you go ahead and sign up for your
own. And where do we get that API key? Well, it put it in it. See, it's right here. But
it it added it for us automatically, because we're logged in here. So it knows who we are.
It knows what our API key, and then it just puts it in there for us. So that's very cool. All right, pull this back up. Okay, so we're almost there. Now, we want
to create a new variable that's called API. You call it anything you want and set it equal
to JSON dot loads. And we just want to pass in whatever content we got from this. So we
go that content, right. And that's pretty much it. Right? Actually, I'm gonna change
this back to 400. For now, now, we need to do something else, we need to set
up a little bit error handling. So let's go try we want to put this in a try block, right?
So if it doesn't work, we want to throw an exception. So let's go accept. Call an exception,
Shawn, as he and oops. There we go. And inside of here, let's say API to just
error for now. Right? So basically, what we're gonna do is we're gonna say, hey, go back,
go get this. Actually, we should probably just put all
of this in the there we go inside of here. Right. So basically, we're gonna say, hey,
try to go get this information from this URL. Once you get it, try and parse it, you know,
strip it out of its JSON and make it into a Python usable thing. If there's a problem,
if you can't connect to the website, if something goes wrong, throw an error, where instead
of our output being API, the output is error. So then when we put API onto the screen, it'll
say error instead of the stuff right? So okay, now let's just create a label, let's call
it my label, call it whatever you want. And so to see this just kinter label, and so we
want to put it in a route, we want the text to equal a p i. And that's pretty much it
for now, I think. And now we just want to pack that onto the screen. So let's just go
my label dot pack. Okay, so let's go ahead and save this. And I think that will do for
now. So let's head over to our terminal. And let's run this Python weather app by invalid
syntax. Oh, yes, it is. We need a colon. Right? Obviously. Alright, so save that. Let's try
this again. Alright, so here, we have our box, right? And let's make this bigger as
we can. You can see there's all kinds of stuff in here. It's just kind of spewed up onto
the screen, right. So what is all that stuff? Well, it's just this exact stuff, right? It's
returned, it looks like a Python list, right. And we know that because it has square brackets
on the outside. So it's a list. But inside of the list is a Python dictionary. And we
could tell that by the squiggly brackets. So I'm just going to copy this real quick.
And instead of looking at it in the GUI, I'm just going to create a new file real quick
and paste this in here. So okay, notice these square brackets on the outside. So that's
a list. And then notice the squiggly brackets on the inside. But let's look through here
we've got looks like up. Here is one list item, right? So we have an opening squiggly
bracket and closing squiggly bracket. Here is the second list item. So let's go through
here. Opening squiggly bracket, closing squiggly bracket. And here's the third list item. Now,
this is what you're always going to do with API data. You're going to see how it gets
returned. And then you're going to just figure it out. Because no two API's return data in
the same way some API's return them as dictionaries, some return them as lists, some return them
as lists with dictionaries in them like we're seeing here. You just have to look through
here and figure it out to figure out What it is, so we're seeing a list with three items
in it. Right? So how do we sort of grab the first item? Well, remember Python lists start
at zero, they're numbered, right? So 012. So there's three items, but they start at
012. So this is the second item right here. Oops. Right here, right? This is the first
item. And this is the zero with item. If we look through these things, they're all the
same except for this. The first one is just returning the aq II the average of all three
of those things. Ozone? No, actually, the first one here is just returning ozone. The
second one is returning that PMI 10, maybe no PMI 2.5, you see right here, and the third
one is returning PMI. 10, if we can find it yet, right there. So for me, I don't really
care about the PMI is that sort of like pollen count, you know, little bits, little particles
of pollen, I just want the ozone. If you wanted those, you can grab those. So we just want
this first thing, which is the zero thing, right? So to get that scrubber code here.
And what we want is instead of putting on our label API, just the whole API, we can
call the specific item. So if we want the zeroeth item, we can save this, and let's
run this guy again, real quick. No, no fix that. I must have accidentally deleted it. Okay, so save that
put the colon there for sure. Alright, let's try this again. Now, it's kind of hard to tell. But we only
have, we could see one thing, the date observed hours observed, we don't care reporting area
Las Vegas. aq 38 in the category number, now notice the category number itself is another
dictionary, because it has two items in it. So we'll have to play with that a little bit.
So okay, we're getting there. So what do we want, we actually just want? Well, we want
three things, we want this reporting area, we want the actual aq II, and we're gonna
want this category. So one thing at a time, let's grab the reporting area. How do we just
make that up here? Well, pretty simple. We just drill down even further, and inside of
parentheses, recording area. Alright, so if we save this, let's run this guy. Boom, we have just Las Vegas, right? If we
want just the aq II, instead of reporting area, we go aq II. Now aq II is the actual
number, right? The air quality indicator or index or whatever. And right now we can see
it's 38. Very cool. What was the other one? Look at our code here. The other one was category.
So if we go category, back, you remember, this one was a little different,
right? It returns a dictionary with the number and the name. We don't know, we don't care
about the number we want the name we wanted to say good air quality. If we return one,
what would that mean? Now we want the name. So how do we get the name? Well, let's see.
Code back up. We once again. Just keep stringing these guys along, right. And boom, we get
good. So Alright, that's how you do that. But now, this is all we don't want to keep
doing this inside of our label, because that's just kind of weird. So let's come up here.
And let's create some variables. So let's go city equals and let's go eight. Let's go
quality. Well let t equals and let's go, what do we call this category? equals, and we'll
put this one as category. Paste in all of these actually. So the city was what was that
reporting area? I think hoarding area. Your that and the quality was just a cue, I believe.
Um, there's no space there. Reporting area. Let me check to make sure. Yeah, recording
area. Back, we could just copy and paste that. Okay, aq II and category name. Okay, so we've
got our three variables here. Instead of doing it like this, let's just sort of What how
do we want to do this? Let's go. Well, the first one we want is city. And then let's
concatenate and let's type in air quality. And concatenate again, and we want the quality.
But this is a number, quality, returns a number. And this needs to be a string because we're
putting these all in strings. So let's real quick wrap this in a string function. We could
have done that up here, I guess. But this is fine, too. So air quality. And what
else let's go put a space. And then let's just finally put the category for now, just to make sure we got it right
cat to Ori. Alright, so let's save this. Run it see what errors I made? Because I always
make errors, as you know. Okay, so Las Vegas air quality. 38. Good. Alright, so we're getting
there. All right. So let's play around with this a little bit more. Now, I'm going to
change this from 400 to 50. And we can actually change the font size of our label, just by
coming up here. And at the end of our label stuff, you just type in font. And now we can
pass in. Let's go I want this hell vac ticker. That's all right. I think so I want font size
20. So let's save this, run it. See how that looks. Okay, so Las Vegas air quality 38. Good. This
might be a little bit smaller. So let's play around with this just a little bit. As I like
to play around with these things. So instead of 50, let's try 40. I don't know. All right, that looks better. I think now,
we have good as the air quality. And so we want this thing to change color based on that.
And this video is getting a little bit long. So I'll just start to do that in this video.
We'll pick that up in the next video. But for now, just at the end of this in our label,
I'm just gonna put another comma, and we can just type in background and set that equal
to green. Now we'll do some logic later on to decide what color to put in there based
on what they actually aq number is, but for now, I'm just going to put green, just to
sort of wrap this up for today and make it look nice. Okay, so that's starting to look
good. But now the rest of it. Oops, there we go. There's white around the edges and
stuff. So the background of our thing needs to be changed as well. So we could do that
a bunch of different ways. Probably the easiest for right now is just to come up here to our
configuration of the actual project. And I can go route dot configure, and then just
set the background to I don't know, green For now, we use hex color codes in the future.
So save this. And oops, come back here. Run it one more time. All right, so now we have Las Vegas air quality
38. Good. And we can put hyphens in the middle of this if we wanted to, or like right here
or something. But we're going to change this later anyway. So we'll just leave like this
for now. So okay, that's pretty much it for this video. Now, let's look at this one more
time very quickly, because this was insanely easy, right? We're connecting to a third party
API by doing nothing more than calling this requests, which we PIP installed. Right telling
you, hey, go out and get this URL, bring it back here and, you know, convert it from JSON
into a Python list, which then we just broke apart and slapped it into a label just that
easy. And that's one of the really nice things about Python. You know, if you do use like
node, for instance, running out and getting stuff from an API with node can be kind of
a hassle because it's a synchronous and it gets crazy. This is just as easy as can be.
And I think you'll probably see that from giving us a shot. Alright guys, in the last
video, we started to build out our air quality app here we can look up the air quality in
our area flashing onto the screen In this video, we want to expand on that and change
the color based on that number. We've got this very basic app built right now and it
looks up the air quality right now we can see in Vegas, it's 36 and that's good. And
so we're showing green, but what do we do if this is a different color? If we Go back
to the website here you can see there's yellow, orange, red looks like purple and Maroon maybe.
And you know, for 50 to 100, your moderate, if you're 101 to 150, or orange, if you're 151 to 200, you're unhealthy. If
you're to a one to 300, you're very unhealthy and above that your, you know, Run for your
lives hazardous. So we want our little app to change colors. And based on what these
are. So pretty simple to do, we should be able to knock this out in just a couple of
minutes. So let's just kind of dive in and do this. So head back over to our code. And
it's just the code from the last video, if you didn't see that video, look in the playlist
for the one before this and check it out. So one thing I'm going to do very quickly,
we've got our label here, I'm going to copy this and put it inside of our trial loop because
I started thinking about it. And I'm like, Well, you know, if it tries to find this data,
and it can, it's gonna throw an error, but then it's gonna throw another error down here,
when it tries to put this, these see these variables in there and they don't exist. So
we should really put this in our trial. Oops, okay, go ahead and do that. Next, we need
a basic if statement, right? So if the color is, you know, if the category is good, show
green, if it's moderate, show yellow, if it's, you know, etc, etc. So let's just go ahead
and do that. So let's go if now what is the thing we're, we're looking at here, we're
looking at this category variable, this is going to return the category name, which is
good, moderate, unhealthy, very unhealthy, etc. So if category equals and make sure you
got the double equal to sign that we're comparing here, right? So if it equals good, and what
we're searching for this good is pull up our app here is this right here, good, whatever
this word is. And we get that just from the website, good, moderate USG. The only difference
is this USG doesn't return USG, it returns the whole string of unhealthy for sensitive
groups. So we'll have to make that little change here. But otherwise, we're just going
to copy and paste each of these names, each of these category names into our little if
statement. So, alright, so if category equals good, we need our colon, then let's create
a variable, let's call it weather color. And set that equal to some color, right? So we
don't know the colors yet. We'll get to that in just a minute. But this is going to be
you know, something like green, I'm not gonna use the word green, we're gonna use color
hex codes, HTML codes, to make the colors, but we'll just leave it as green for now.
Okay, so that's that now we need to do another if statement. And another if statement for
each of these category names. So says just creating a bunch of if statements, we're going
to do an lF Python lF statement instead. So lF category equals, what's the next one's
website here, moderate, V equals moderate, be sure to capitalize it.
It's case sensitive here, then, let's just grab this. And I'm just going to
leave these blank. Alright, so let's just copy and paste there are we've got two so
far. And if we look at the website, so one, two, so we got 1234 more to go. So I'm just
gonna copy and paste this in four times. And make sure your tabs are lined up. I'll show
you what I mean in just a second three. There we go. Four. I think that's right. Notice
how all of these if and elipse line up with tabs. Notice these are not spaces, like if
I hit my space key goes like that. That's not what we want. We want tabs, everything
needs to be tabbed. And the same thing down here. This is a tab as well. Notice it's not
a space. It's an actual tab Python is tab sensitives. Very important. So okay, so now,
so let's fill these out. And so instead of moderate, what's the next one, USG, so this is unhealthy for sensitive groups. So
this is what we need to pay Stan right there. Was that copy that and paste that in? Alright,
the next one is unhealthy. type that one in unhealthy. Okay. Then the next one is very unhealthy. Notice the capitalizations, very unhealthy.
And then finally, the last one is hazard us. cod spell that I'm just gonna copy. This one
has a dress is a hard word to spell. Alright, let's pull this up. Boom, hazardous no space
there. Okay, so now What colors do we want? Well, there's an easy way to pick the colors.
You can just come back over here. And for instance, I'm just going to pick this one
because I'm not really sure exactly what color. Let's do hazard. I don't know exactly what
color this is. So if you hover your mouse here, and then drag and click this Now right
click, and at least in Firefox, you can do this, I don't know about Chrome, you can view
the selection source. And when you do, it shows you the color that it is right here,
the background color. So we can just kind of copy this. And write in there, paste that
in. Okay, so I actually went through and copied and pasted all those little things in here.
So I'm just gonna come through here and grab each of these. So this one's good. Good is
green. This one is moderate, moderate is. You can see there's two colors here, the background
color and the color, we want the background color, because the colors are all the same,
that's white. Well, not quite the same. So okay, this one is moderate. Oops, come back, come back. Where's our moderate right there. So unhealthy
for sensitive groups? Go there we go. And the next one is this guy, which is unhealthy.
Find our unhealthy boom. And then a very unhealthy which is right here. Copy, Paste, copy, paste,
and finally hazardous, which is this color, apparently, I don't know what all these colors
are. Oh, we already did hazardous. There we go. Alright, so let's save this now. We're
getting there, we've got our if statement done, but now we need to come through here
and change our label. So remember, when we did our label in the last video, we put the
background color as green? Well, instead of that, we need to do this new weather color
variable we created in our if statement. So make sure not to do it inside the quotation
marks, you just want to put it like this. So okay, that's almost done. Now, we also
have this up here route configuration, the background of the actual app itself, we need
to change as well. So we'll put that in here. But now we need to move this because Python
starts at the beginning of the program at the top and it comes down. And when it gets
to here, it's looking for this weather color variable. We haven't created it yet. Above
here. Alright, it's down here. So we need to change this actually need to just move
this entire line. And let's put it inside of our try loop. Because again, if it tries
to get this data from the API, and there's an error, it won't, they won't throw up this
or it'll throw an exception, right. So in which case, this won't throw an error. So
okay, that's looking good. So let's go ahead and save this. Now. I don't know if this is
going to work or not. I think that's all the moving parts. Well, let's give it a try. Let's
run this again. Okay, So sure enough, and you can see that you probably can't tell,
but that's a slightly different color green than just calling green. And that's great.
But their quality in Vegas right now is good. So let's go hunting for another town or city
or something. Ooh, there's some orange. Check this out. Click on here. We're at Cincinnati. Um, doesn't help us any. Let's try up here. what's
what's us? Looks like Idaho, some sore. Looking through here. Salmon. All right. So good.
Core doline. Let's see what is that? Copy this, go to Google and type in zip codes because
the zip code for core delene whatever that is. Alright, so that is 83814. So let's put
this in our lookup thing here. And right now, this is hard coded into our URL here, which
is not optimal. In the next video, we'll make a little search function, a little search
bar that we can type in a zip code, but for now, we just hard code that in. And let's
come back over here and run this guy one more time and see if it changes to says 32. Hmm,
that's no good. What's going on here? Well try that again. says it's 60 Oh, that's the forecast current.
Okay, so we need the current aq I so let's go to grangeville. I don't know if that is.
Alright, so let's go grangeville zip code 8353. Zero. All right, so let's try this guy. Just copy
and paste. Save this. Run it one more time. Still good. Thing lies. I think the different The problem
here is I've put in a five mile radius and this is doing some other different radius.
It's not quite the same. All right, well, let's keep looking. We got nothing but time on our hands. Right?
Let's see Louisiana, maybe. Louisiana look and oh, a bunch of once yellow, Baton Rouge,
all the way across. Once yellows. All right. So let's try Baton Rouge. zip code. punches, zip codes, let's pick one. Fingers
crossed, this will be one. Like. And yes, we have moderate, which if we look
at our website, here, moderate is yellow. Our app is yellow. And all right, pretty good.
So very, very easy. It's just a basic, you know, Python, if statement, right? We're gonna
have to do anything complicated. But you know, kind of cool. We look through here again,
we can see, you know, just a basic if loop or if statement. Very cool. The only thing is we change this, we move
this inside of our try. Block, we moved our labels and to our try block as well. Other
than that, nothing to it. In this video, we're going to add a search functionality. So we
can look up a specific zip code instead of having the zip code hard coded in. What we
want to do now is add just a basic form that we can enter in a zip code, press a button
and it will look up whatever zip code we entered in. So pretty easy to do that. And we've looked
at how to use entry boxes, text boxes, form boxes, whatever you want to call them in previous
videos. So if you haven't seen that, go back and look through the playlist. That's in the
comments below this video. And you can look up that video. So let's just come down here
and below or this is a code that we worked on the last couple of videos, our weather.py
file, and I'm just going to come down here, I'm just going to create a label. And we can
really call this anything we want. I'm gonna call it I don't know, let's call zip. And
that's going to be an entry box. And it's going to be in route, right. So that's really
all we need right now. So let's go zip dot pack. To just pack this on the screen. And
maybe a little bit later, we'll get a little bit more interesting with the layout. Right
now we're just going to pack everything up on the screen just to get the functionality
built in. So we also need a button. So let's go Submit button or zip button. And that's
going to be a button. And we're going to put that in route. And the text, probably spot
route, right. And the text for the button. Let's go look up zip code, I guess. And it
needs a command. So let's send this to these zip lookup function. Now we don't have a zip
lookup function just yet. We'll do that in a second. So let's go zip button dot pack.
And Okay, so let's go ahead and save this. Now we need to create this zip lookup functions.
Let's do that up here at the top. And let's go create zip code lookup function. So we
want to define, and we call it zip lookup. I don't need to really pass anything. So what
are we want to do here for now let's just go zip. So let's just inside of here, let's
just go zip dot get. And just to see if this looks right. So let's save this come over
to our terminal. And let's run our app again. And you can see we need to do some resizing here. So all right,
let's close this and resize a little bit. So I'm just gonna come up here and let's just
make this I don't know 600 by 100. Let's save this comeback runner app again. Alright, so we've got the current that's hard
coded right in. And now we've got a form we type stuffs stuff and it doesn't actually
do anything yet. We could create a label underneath here just to make sure this is working. So
let's do that real quick. So let's go inside here. Let's call zip label AB equals, this is going to be a label. And
it's going to be a route. And that text is going to equal. Let's just go zip dot get.
Let's go zip label and pack this onto the screen. Okay, so let's save this and run it
just to see that this form is working correctly. So we can type in 90210. Boom, it pops up.
Now it doesn't change color. We haven't done that. Yeah, but we can click keep clicking
this, and it just keeps popping up. Now that's because we've packed everything right. So
maybe we don't want to pack everything. So instead of that, let's really quickly just change everything
over to a grid system. So we could just go grid. And then well, let's start here are
first the entry box, let's go grid, and we want this to be rho equals zero ups, no quotation
marks, zero, column equals zero. And I'm just gonna copy this and then our button, let's
put this on the same line. So row zero, column one. And inside of our thing here, we want
this to be a grid. And we want this to be row one, column zero, let's give this a column span
of two. So it at least spans both of those. Well. Yeah, let's, let's give that a try. Now, all of this stuff,
we want to put this inside this zip lookup, right? Because we don't want to hard code
the same, or we just want this to, to show up whenever we press the button to look up
a certain zip code. So I'm just gonna kind of look through here and scrap all of this,
try and accept stuff. Copy this. And let's put it inside of here. So let's say we need
to work on our indentation. So and then everything over so Okay, so try and accept or lined up.
The stuff inside the trial is all lined up. Okay, that's looking good. So now, down here,
we need to grid this too. So we want this to be row equals. What are we on now? One, well, actually, we just want this right
here. Right? Okay, and we don't want this anymore. or this or this. We just did this
in order to, you know, make sure that the form thing was working. Now, this is what's
going to pop up this thing right here. Okay, so now we need to change our API call, right?
So find the zip code area here and put a quotation mark. Now we need to concatenate and we want
this to be zip dot get whatever we put in the form, right? And we
need to get rid of that hard coded zip code and then quotation marks so that looks good.
Okay, so let's save this and run it. See if I screwed this up at all, or very well might
have. Okay, so now we have just a very basic gray because there is no color because we
haven't added the zip code yet. So let's look up 90210 Beverly Hills, north northwest coastal
la air quality is currently good. And you notice everything changed to green, which
is what we'd expect. Now let's go to 89129. North Las Vegas airport, I don't know why
saying North Oh, that's the Northwest from the you can see it just put it on top of it.
But it didn't clear what was already there. That's very interesting. We can mess with
that later. Okay, but at least the functionality is working now. And that's what we want. So,
okay, this whole thing doesn't look great. It's not lined up, right. This looks kind
of goofy. Right? We can play with this a little bit right now. I'm not going to get into it
that much in this video. We'll work on that in the next video. But for now, just a quick
thing we could probably do. Let's see. Let's go back and find our button and our entry.
And let's just give this a sticky of what. Let's go west, plus East plus North plus south.
And one do the same thing for the button. If we save this, let's run this guy again,
see what this looks like. And when we start out, it looks the same. But if we get 90210
it at least now there's not that gap between it and it sort of going the length of whatever
has been returned, right. So if we change this to 89129, still stays the same. Let's
run it again. With an 89129 to start with. Okay, so it's this size. Now, if we change
this to 90210, everything kind of changes a little bit, because this got bigger. And
since the first one was smaller, the bigger one overlaps at all. So it looks like it's
disappeared, but we'll need to work on that. Like I said, In the next video, okay, so coming
right along. Not too bad. Again, I realize this doesn't look great, but we'll work on
making it look pretty, you know, in the next video, or so, all we really want now is just
the functionality to make sure this thing works correctly. So 60610, my old Chicago
air quality, everything's good this morning, apparently. So alright. In this video, I want
to talk just a little bit about charts and graphs, right? Python for data analysis is
super popular data science, machine learning all that stuff. And you always want to create
charts and graphs. And I'm not going to get into Python for data analysis. In this video,
I mean, we're going to use NumPy. And we're gonna use matplotlib, but I'm not really going
to talk about them. For this video, I'm just going to sort of assume you already know what
those libraries are, how to use them, what we're doing with them. And in this video,
I'm just going to focus on taking data that we have, manipulating it with those libraries,
and then specifically throwing it up on the screen with a graph or a chart or something
that we can visualize and see. And I'm going to show you how to do that in kinter. Right.
So it's very, very easy, and it shouldn't take very long at all. So first things, first,
we need to install NumPy and matplotlib NumPy is what we're going to use to mess with the
data. matplotlib is what we're going to use to throw up the graph on the screen. So we
need to install these into our terminal. So let's head back over to our terminal. And
I'm just in my C slash gooey directory, the same directory we've been in throughout this
whole video series. And I'm just gonna really quickly pip install NumPy. And it downloads
and takes just a second here. And then we want to pip install mat plot lib. That's doing
its thing. Okay, so that's done with clear the screen. Now let's head back over to our
code here. And I've created this file called plots.py. It's just the same starter code
we've been using, I change the size to 400 by 200. If we save this, there's nothing really to see we can run this one go Python plots.pi,
it will pop up. It's just a blank window 400 by 200, or whatever. I designated that as
yeah 400 by 200. So first, we need to import NumPy and matplotlib into our program here.
So really simple, we just import NumPy. And let's just call us as NP. This allows us to
access NumPy by referencing in p instantiating it that way. And we also want import mat plot
lib dot high plot, we're going to use some plots as PLT. So that's all we have to do
to kind of install these things and start using them. So let's come down here. And let's
just create a little function. Let's go define graph, or graph. And let's do this. And inside
of here, we want to create some fake data really quickly that we can use to make a graph
out of we can import something from like a CVS CSV file or something if you have data,
you can import that I don't have any handy. So I'm just going to make some up. And let's
call this house prices. Right and we're going to set this equal, we're just gonna make some
random data. So we're gonna go in p, we're gonna call numpy.random.we want a normal distribution.
And again, if you don't know what this is, comment below, I'll make some videos on NumPy
NumPy arrays and stuff like that. But here we want to say, Alright, let's create some
fake data about house prices in our area. Let's say the average price of a house is
I don't know 200,000. And the standard deviation is I don't know 25,000. And then we want to
create a bunch of data plots of this data. Let's say we want, I don't know 5000 data
plots, data type data points of this and we want a normal distribution. We want to generate
this randomly so that should work. Now, in order to actually graph this, let's say we
want to do a histogram, just you know, bar charts that go up and down, that show a distribution,
we can just call PLT, which is matplotlib. You know, we, we call it as PLT, so we can
reference PLT, and we want a histogram. So dot hist, right. And what we want is house
prices, right? So let's take this data that we just created. And let's just plot it right.
And we can, we can specify how many bars how many bins we want. So let's say we want 50
bins doesn't really matter. And that's pretty much it. So we've created this thing. Now
we need to show it right. So let's just go PLT dot show, right? So if we save this and
run it, of course, nothing's going to happen, right? We run it on the server, nothing has happened. Because
we created a function, but we didn't actually call the function, right. So we need to create
a little button, throw it up on the screen. So if we hit the button, the thing pops up,
right, so we can go what my underscore button equals, let's call this a button. And it's
going to be in root, which is just our root thing here. Right. And let's say the text
should be graphic, I don't know. And then we want to call the command equals graph.
Probably should spell graph, right? still does not spell right gra p, h. Okay, there
we go. So that's just calling this function, right. And we don't have to pass anything
in here, we're just calling the function, and it's going to generate this thing. So
now we just need to my underscore button, dot pack this guy onto the screen. And that
should do. So let's save this. And let's head back over here and run this. Oh, my button,
oh, spell button. I cannot type this morning, my batoon my button. Alright, save this. Try
it again. Second time's a charm, boom. So we've got a thing, if we click graph it, it
runs. And this whole window pops up. And we have this histogram, which is very cool. And
you can see it's sort of interactive, as I move my mouse around, the x and y axis is
down here at the bottom of the corner, they're down here, change to tell me exactly where
I'm at. So you can see our data, we created houses that were average of $200,000. So you
can see right here, that's right in the middle. So that makes sense. And the standard deviation
was 25,000. So it goes up 25, it goes down 25, down another 25, down, another 25 up another
25, etc. And it's normally distributed because our code called for a normal distribution,
right? All this backup, every call, and we can kind of zoom in here, right? We can do
this. And that's not that interesting, we can click home to go back. See, we can pan
the accesses moving around and go back, we can click this button and we get these sliders
that come up. And let us kind of play with this if we want to. I don't know why you would
want to do this. But it's kind of cool, right? And just that easy. Right? Click Reset goes
away. We can save this, right? If we click this boom, a whole save dialog box pops up.
And it works for us. It does everything. We don't have to write any save code or anything.
Right? It will create a PNG of this. Very, very cool. And yeah, so you know, we can change
this if we want no bins at all. We run this again. Oops, close this first. Boom. Right
again. You can see now it's blockier. Because there's only 12345678. Well, 910 I guess,
bins, we can likewise, you know, really define it. We could say 200 bands, right? save this
and run it again. This over and graphic. Now we get all kinds of like much finer detail.
And you can see it looks a little different. Even though we're changing the bend size.
The shape of it is slightly different each time because every time we run this we're
generating new random numbers, so it's gonna be slightly different, obviously. But yeah,
just that easy. So it really is just that easy to use graphs with kinter out. There's
all kinds of ones you could try. We could try pie. Let's get rid of this. Just I'm not
sure This is gonna work. I didn't test this beforehand, but it might work. Let's try this
again and graph it. Okay, so we're asking it to create some data. So it's taken a little
while. And you can see, here's a pie chart. There's so many points, though, that it's,
it's kind of hard to make anything out. Let's close this. So we can head over to Google
real quick and just type in mat, plot lib charts, maybe. And here's some sample plots,
we can click on here, different ones you can do. Here's the one we did histogram dot hist,
right? Let's see what else is there. That's fun. bar charts, and you can click on each
one. So let's click on pie chart real quick. And it will tell you exactly the dot pie inside
the parentheses. What stuff to kind of you want to put in your pie chart, and you can customize
it and stuff like that. For instance, if we go back and look at the histogram, where did
that go? We'll see. x, that's the data that was our house prices,
bins equal. We didn't put Ben Zico we just put the number
because you know, you can do it like that to the density and all these different things
you can change on here. Very cool. See, if we can't find one other one that will work
quickly. Without a whole lot of customization. I don't know if there is one. Polar let's
see what this one is. Ours in Cork, so maybe let's try polar. I don't know what that is
or what it will do. But let's try it anyway. So save this. Come back over here. Renee again.
Alright, so I don't know what this is. But it looks cool, right? So I just that easy
right to do this. So like I said, I'm not gonna get into the data science of this the
Python, for data analysis or anything, I'm just gonna assume you kind of already know
NumPy NumPy a little bit, you already know matplotlib and you can do the same thing with
seaborne and other libraries for graphical stuff. And that's cool. So that's all for
this video. If you liked it, be sure to smash the like button below subscribe to the channel
and check out Academy comm or you can use coupon code YOUTUBE to get $20 off membership
you pay just $27 to access all my courses, hundreds of videos and the PDFs of all my
best selling coding books. Join over 60,000 students learning to code just like you. My
name is john elder from coding me.com we'll see in the next video.