This chapter is from the book
This chapter is from the book
This chapter is from the book
Coordinate System
Think of your computer screen as though it is a "playing field," like for soccer or football. If you think about the way computer games move objects around on the screen, a playing field is a very good analogy. You are going to move your game objects around the screen just like players move around on a playing field. Maybe you'll even make your own football or soccer game in Phrogram!
In computing, the playing field that is your computer screen is known as a coordinate system. You have probably already studied coordinate systems, when you studied graphs in algebra. But a computer's coordinate system is different from the algebraic coordinate system we learn about in school, in two important ways. First, your computer screen is fairly small and has definite edges, so it does not pretend to cover a potentially "infinite" number of points along an x- (horizontal) and y- (vertical) axis. Instead, it is the finite set of locations that are viewable on your screen. Second, instead of moving upward, as in algebraic graphing, the y-axis on computer screens moves downward. This difference makes computer and algebraic coordinate systems inconsistent, but it is based on how TVs and computer monitors have been built for the past 60 years, so it's customary to use our coordinate system this way. It's not hard once you get used to it.
To be specific, your computer uses an (x, y) coordinate system for locations on the screen in which the left edge of your screen defines x = 0, and the top of your screen defines y = 0. This means that the origin, where x = 0 and y = 0, is the upper-left corner of your screen. Moving to the right across the screen increases the x value, and moving down the screen increases the y value.
If you are not used to thinking about coordinate systems, all of this may seem pretty complicated, and it might be easier to grasp with a picture. Figure 2.4 shows where a Phrogram program displays several (x, y) locations.
)
Figure 2.4 Phrogram example showing several (x, y) screen locations
The first value of each pair is the x value of that location on the screen—and as you can see, the x value increases as you move from left to right. The second value is the y value of the location on the screen, and that value increases as you move from top to bottom.
Now, let's take a closer look at the instructions in our myUFO program to better understand how the coordinate system works. Notice that in line 7, the instruction reads myUFO.MoveTo( 50, 50 ). The (x, y) location of (50, 50) places the sprite 50 pixels to the right along the x-axis, and 50 pixels downward along the y-axis. As you can see, that is not very far from the upper-left corner of the screen. We don't often think about individual pixels on our computer screens, but in fact, everything displayed there is composed of many small pixels, or points of color. The window that Phrogram launches when we run a program is, as you can see from Figure 2.4, more than 500 pixels wide and more than 400 pixels high.
It may help you understand this if you experiment with changing the location of your UFO and running the program again. Try that a few times, by clicking and changing (50, 50) to other values, such as (300, 50), and then running your program again. The way the coordinate system works is very important—and this applies directly to many programs you will create in the future, even if you use languages other than Phrogram. So, you should experiment with this, and reread this section, until it makes sense.
The last of our instructions is the simplest. After we have told Phrogram about myUFO, where to get its picture, and where to display it on the screen, we simply need to tell Phrogram to show it on the screen. That's easy:
myUFO.Show()