Advanced Graphics - Activity

In the Python editor, type in the small program (or copy and paste it) in the first column of the
table. When typing these programs, be very careful to type exactly what is shown.

Run the program.

Copy and paste (screenshot) what the program displays - the output of the program - into the
second column of the table. Enter any notes you want to add as well. Then erase the program
you typed and type in the next.

There is no need to save these programs but save the document with the output and your
notes.

When you have completed this section fill in the blanks in the section notes at the end of the
document. After submitting, check your answers against the provided solution.

Programming Graphics

Program Code Output / Notes

from graphics import * Look at the top left to see the dot.

#creates your window for drawing

win=GraphWin("My Graphics",200,200);
This program outputs a small pink
#example drawing a point dot at the top left of my screen.
myPoint=Point(20,20);
myPoint.setOutline("hot pink");
myPoint.draw(win);

Change the first number a few times. Where does the dot
move to? Thinking of the computer screen as an x-y
graph in math class, does the first number represent x or
The x axis is represented by the
y (horizontal or vertical)?
first 20 in the code, (x,y). As you
can see in this picture.

Change the second number a few times. Where does the

dot move to? Thinking of the computer screen as an x-y
graph in math class, does the second number represent
x or y (horizontal or vertical)?
After changing the second
number, it represents the y axis, I
changed both the x and y to 100
 so the dot is dead center.

from graphics import * The program outputs a thick line

that starts at the top left of my
#creates your window for drawing screen and end up close to the
win=GraphWin("My Graphics",200,200); middle/end.

#example drawing a line

myLine=Line(Point(0,0),Point(143,70));
myLine.setOutline("Cornflower blue");
myLine.setWidth(4);
myLine.draw(win);

Change the 4 numbers so the line starts on the upper

right corner and goes down to the left. Record the
coordinates you used in the second column here -->

“myLine=Line(Point(200,0),Point(
43,70));”
I just started at 200 and just
removed 100 from the 143.

Change the 4 numbers, so the line is horizontal across

the screen. Record the coordinates you used -->

“myLine=Line(Point(0,100),Point(
200,100));” I just put x to 0 and y
to 100 to make it in the center and
did 200 and 100 on the other axis
to make a horizontal line.
Change the 4 numbers, so the line is vertical down the
screen. Record the coordinates you used -->

“myLine=Line(Point(100,200),Poin
t(100,0));” I just put the x axis at
the 100 which is the middle, the y
axis at 200 but just 1 y axis.

Open Microsoft Paint and change the canvas width and

height to 200 by 200 (Click File>Properties). Draw a
simple picture and save it as pythonPicture.png. Make
sure you save it in the same folder where you save your
Python programs.

Seems to work fine but the code

was quite a pain in the butt

from graphics import *

#creates your window for drawing

win=GraphWin("My Graphics",200,200);

#example drawing an image

myImage=Image(Point(100,100),"pythonPictur
e.png");
myImage.draw(win);
 My pic.

Change the Point to (0,0) and run it again. Experiment

with other values. What are the Point coordinates
referring to?

I have no idea. If I had to guess, it

would be something along the
lines of the middle of the picture.

from graphics import * Run this program 3 or 4 times

from random import randint and then explain how it works.
How this program runs is, every
#creates your window for drawing time you hit run, the computer is
win=GraphWin("My Graphics",200,200); going to pick x,y,and r values from
40 to 160. And also, the colors
#example drawing a random circle from 0 to 255 of rgb. Every time
x=randint(40,160); there will be a different circle,
y=randint(40,160); different size and different colors
r=randint(10,40); and its all randomized by the
randit operator(Idk what randit is
myCircle=Circle(Point(x,y),r); but I think its an operator).
myCircle.setFill(
color_rgb(randint(0,255),
randint(0,255),
 randint(0,255)));
myCircle.draw(win);

from graphics import * Describe how this program

from random import randint works. (idk how this works so
this is a guess)
#creates your window for drawing How this is program works is the
win=GraphWin("My Graphics",450,450); rectangle shape is being
controlled by the i in range. The I
#example drawing tell how big the rectangle should
for i in range(1,401,5): be and how far to move using the
r=Rectangle (Point(i, i), loop part.
Point( i + 50, i + 50));
r.setFill("yellow");
r.setOutline("yellow");
r.draw(win);
time.sleep(.1);

Add the line r.undraw() to the program after the sleep
command and explain the effect.
This affected the whole picture. It
removed the rest of the rectangles
and you can only see 1 rectangle
drifting across the graphic screen
rather than having all of them
slide together. Its like you had
terrible wifi to top of the line.

Change the by 5 to by 20, what effect did it have? The single rectangle almost
quadruples it speed so it gets
across the screen faster skipping
20 pixels each time.

Change the sleep(.1) to sleep(1), what effect did it have? This decreased the speed of the
rectangle because there is now a
1 second delay before every
move.

from graphics import * Notice this program accomplishes

from random import randint the same thing as the one above,
but instead of redefining, drawing
#creates your window for drawing and undrawing the rectangle
win=GraphWin("My Graphics",450,450); every time you loop, you just
move the current rectangle.
#example drawing
x = 0 Yeah, quite interesting, I’m quite
y = 0 baffled by how there is no values
r=Rectangle (Point(x, y), Point( x + 50, y in x or y yet the square knows it
+ 50)); values
r.setFill("yellow");
r.setOutline("yellow");
r.draw(win);

for i in range(1,20):
r.move(20,20)
time.sleep(.1);