Bummer! This is just a preview. You need to be signed in with a Basic account to view the entire video.

Preview

Start a free Basic trial
to watch this video

Sign up for Treehouse

Start and Stop

5:58 with Kenneth Love

We need to trigger actions when we click the start and stop buttons.

The official docs for Tkinter aren't the best in the world but they'll get you started. The documentation from effbot hasn't been updated in about a decade but it's actually still mostly accurate. These are my two main resources for learning Tkinter and preparing this workshop.

More information about colors and fonts.

Terms and things

Tk() - A Tkinter application. This is what is responsible for the window or application you see on your screen. You'll end up binding most things to this.

mainloop() - The loop that keeps your Tkinter app running. This loop runs forever.

Frame - An invisible box that you can put things in.

Label - A piece of text on the screen.

Button - A button (whodathunk?!)

StringVar - A variable that holds onto a string.

IntVar - A variable that holds onto an int.

trace() - A way to follow the changes and access of a variable.

columnconfigure() and rowconfigure() - Methods to configure the number and weight of columns and rows.

pack() - Method to insert a widget in the available space.

  • 0:00

    Okay so we made our buttons, and I said we can give them commands.

  • 0:04

    Right now they don't have any commands.

  • 0:05

    So, let's give them a command to run whenever they're clicked, all right?

  • 0:11

    So, we need a new method that's gonna run when the start button is clicked,

  • 0:15

    we need one when the stop button is clicked.

  • 0:18

    So let's go down here, and down here at the bottom.

  • 0:24

    I mean, we're done building stuff for right now.

  • 0:26

    We got a banner, we got a timer.

  • 0:28

    Yeah, we don't need to build anything else.

  • 0:29

    All right, this is gonna be run when we start the timer.

  • 0:32

    So let's call it start timer, all right.

  • 0:35

    I mean, why be creative if we don't have to be.

  • 0:37

    Okay, so, the first the we wanna do is we wanna make sure

  • 0:40

    every time we start the timer, the timer is set back to the full length.

  • 0:45

    So we're gonna repeat the line at center init method,

  • 0:48

    which means really we don't have to do the line and the init method.

  • 0:52

    You could leave that out if you wanted to, and

  • 0:56

    this also means that we don't have a pause function on our timer.

  • 0:59

    It's always gonna be 25 minutes when you hit start on it, and that's fine.

  • 1:03

    We don't have to have a pause button we can just always be like all right,

  • 1:05

    we started at the beginning and we stop,

  • 1:08

    if we have to go do something other than work.

  • 1:10

    If you want to add your own pause button, or your own pause functionality to this,

  • 1:14

    where it just holds onto the time,

  • 1:16

    if the time's not zero then it starts back wherever it's at, go for it.

  • 1:19

    That is a wonderful addition to add to this.

  • 1:21

    Before we get too far into this, I want there to be a variable

  • 1:24

    that's tracking whether or not the timer is running, right?

  • 1:27

    So we know how much time is left,

  • 1:28

    but we don't know if we should actually be decrementing from that time or not.

  • 1:32

    So back up here in init, we just jump all around don't we.

  • 1:37

    Let's add a new thing here that's self.running, and

  • 1:40

    that's gonna be equal to false to begin with, well how do I set it to true?

  • 1:44

    False, because when our app starts the timer is not running.

  • 1:47

    All right, but back down here in start timer.

  • 1:53

    Here we go, we want running to now be equal to true right,

  • 1:57

    where we started the timer.

  • 1:59

    So, running is now true.

  • 2:00

    Okay, so go right back up here, and

  • 2:05

    in our start button, command is gonna

  • 2:10

    be equal to self.start timer.

  • 2:14

    And we don't need the parentheses on there,

  • 2:16

    because it will call the function when the button gets clicked.

  • 2:20

    Okay, that's all we have to do for the start button for right now.

  • 2:23

    We've got a couple more things to do in a minute, but that's it for right now.

  • 2:27

    Let's do the stop button.

  • 2:28

    Guess what, it works the same way.

  • 2:29

    Let's go ahead and add this in, command=self.stop_timer_.

  • 2:35

    All right, and then down here stop_timer, and what do we want this to do?

  • 2:42

    So what we want stop_timer to do is we want it to set

  • 2:47

    self.running equal to false and that's it.

  • 2:52

    We just want it to stop, it's no longer running.

  • 2:54

    We're not running anymore.

  • 2:55

    All right, so that's all we gotta do.

  • 2:59

    Let's run this real quick.

  • 3:01

    Ctrl+R, bring this over here.

  • 3:04

    I hit start, I hit stop.

  • 3:07

    Anybody know what's going on?

  • 3:08

    I mean the commands are running, I'm sure.

  • 3:11

    Let's add this in, let's do, come up here we'll say print started,

  • 3:17

    and then here we'll do print, stopped.

  • 3:21

    Run it again, and we hit start, see now it's started,

  • 3:26

    we hit stop and there it stopped.

  • 3:29

    All right, so the commands are working, but we don't know if the commands worked,

  • 3:33

    there's nothing showing us that the commands worked.

  • 3:37

    So buttons have a fun little thing called button state.

  • 3:41

    I think it'd be better if our UI told us whether button could be clicked or

  • 3:45

    not right, because you don't want to click the stop button when it's already stopped,

  • 3:49

    and you don't wanna click the start button when it's already running.

  • 3:53

    So, let's make it to where the buttons can't be done that way.

  • 3:57

    So, let's go back up here to our build buttons.

  • 4:01

    There's where we put our buttons into our grid, and

  • 4:04

    let's make sure that the stop button is disabled by default,

  • 4:09

    because at the beginning, all you can do is hit start, right?

  • 4:11

    So self.stop_button.config,

  • 4:16

    see, and the state is gonna be tkinter.DISABLED.

  • 4:23

    All caps for disabled there.

  • 4:26

    Okay, so, at the beginning the buttons disabled, let's look at that.

  • 4:32

    Here we go you can see I can't click the stop button at all.

  • 4:35

    I can click the start button now, but I can't click stop.

  • 4:38

    Okay, so great, and the nice thing is down here in this,

  • 4:44

    since we have our buttons registered to self, we can get to them.

  • 4:47

    So when someone clicks start, we want to do

  • 4:51

    self.stopbutton.config(state=tkinter.DEFA- ULT),

  • 4:58

    which is just the raised up you can click it thing.

  • 5:04

    And self.startbutton.config(state=tkinter.DIS-

  • 5:09

    ABLED), because the stop button should be disabled at that point, okay.

  • 5:15

    And then, take these two lines bring them right down here, and

  • 5:19

    we want to basically swap these.

  • 5:20

    We want the start button, stop button, sorry, to be disabled, and

  • 5:25

    we want the start button to be back to default.

  • 5:29

    I'm sorry, it's not default, it's normal.

  • 5:36

    I thought default sounded weird.

  • 5:38

    All right, so it's normal.

  • 5:40

    So, we click start, stop.

  • 5:43

    They trade back and forth.

  • 5:46

    All right, cool.

  • 5:48

    Nothing else is happening though, because nothing else is happening.

  • 5:52

    I mean, the running variable changes, but that's about it.

  • 5:55

    So, we need to do some polling.

You need to sign up for Treehouse in order to download course files.

Sign up