[MUSIC].
In this video we are going to talk about SimpleGUI.
SimpleGUI is the python margin and code sculptor that allows us to build
interactive applications. This is really the magic in code
sculptor, without it we couldn't build these interesting games that we are going
to build in this class. Now another way I could have title this
is Frustrations Over My Summer Vacation. So I told you that I spent my summer
building Code Sculptor. Well a lot of that was building
SimpleGUI, and SimpleGUI is actually written in JavaScript allowing us to use
the web browser in the way that we are. Now this is great for you.
>> It was great for me, too. >> Why?
Well, JavaScript is just a. >> Fantastic language.
>> There is a good reason why we're teaching this class in Python and not
JavaScript. With that, I want to walk you through
some SimpleGUI applications, I want to show you how to find out more about
SimpleGUI and get you started. First, I just want to walk you through
the example application at codesculptor.org.
So when you first go the site, this is what you see.
This is a very SimpleGUI program, so let's run it.
When we run it, another window pops up 'cause I'm going to call this window the
frame. And the frame has a couple of different
areas to it. First, we have the control area.
And the control area is where we have buttons, text inputs, and there are even
text labels that allow you to print status information from your application
back to the frame. In this application, there's just this
one button that says click me, so let's click it.
And you'll notice over on the right hand side, which is the canvas, the message
changed from welcome to good job. Now the canvas, is where all the
interesting things are going to happen in your program.
This is where we can draw images, shapes, text, and we can even respond to keyboard
and mouse events over in the canvas. So, the canvas is the interesting part of
the frame. And in the final area of the frame is the
status area, the status area gives us feedback about keyboard and mouse events
that happen in the canvas and this is critical to making the bugging a little
bit simpler in SimpleGUI. So now you seen the basic application on
this elements. So this simple application actually has
two event handlers. It has the click handler that registered
to execute in response to button presses, it has a draw handler that registered
with the framed actually draw the canvas. Okay, an what the click handler does is
it simply changes the message that's going to be drawn, and the draw handler
draws that message. So, how do I learn more about how all
this works? Well, there's a nice link over here to
documentation. We should use it.