Homework Six: Cityscape Take 2


Project Writeup

The goal of this homework project was to create two building functions using the new Zelle graphics package. Another file would call the building functions as well as implement the animations on the scene.

To create each building, we had to parameterize the function so that it would draw the buildings at starting point x0, y0, and a size given by dx. Zelle graphics requires programmers to create an object that will be a shape, and then draw the object. Points need to be created before any objects can be created. With two points, Zelle can make a rectangle object, with one center point Zelle can create a circle, with two points Zelle can create a line object, and with multiple points Zelle can make any type of Polygon (order matters). This is how I made my buildings. I made a bunch of points, roughly 15-20 for each buidling, and created objects using the different Zelle object methods (oval, line, rectangle, polygon, circle, etc.). Then I used the object.draw(win) to draw the objects in the window created under the variable "win".

The building that moderately resembles Big Ben if you cross your eyes and violently shake your head from side to side, uses a nested for loop to draw the 50 windows. The clock is drawn by using a circle for the outline of the clock. The hands of the clock were a bit more difficult. To get the hands of the clock to move in a circle, Professor Maxwell instructed me to use the geometric circle using sine and cosine. The first point on the line that constructed the clock hand was the center point of the circle, and the second point on the clock hand was the point created using sine and cosine. I created a clockpoint variable in a loop that had a range of angles from 0 to 360, and had a step of 30 for the hour hand and a step of 5 for the minute hand. Because the math package treats inputs to cosine and sine as radians, I multiplied each angle by pi and divided by four. The clockhands were also placed in a nested loop in order to make the hour hand shift once for every full circle loop on the minute hand. Using the draw() and undraw() functions in addition to the time.sleep() delay method to shift the clock hands as the program went through the loop. This was my first animation

The second part of my animation was making the windows in the Big Ben buildings turn on and off randomly. This was accomplished by creating a list in the City2.py file that would append each window to a list, and then use the return function at the end of the building1 function. This set the value of the building1 function equal to the list created by the variable in City2.py which had all of the appended windows added on to it. This allowed me to use the list in the file that called my building functions. I iterated a bunch of times using a for loop, and for a randomly selected item in the list (that item being a window) I filled the window to black and then back to yellow after a time delay.

My second building that is more stupid looking than I hoped it would be, is fairly basic aside from the windows. To create the windows I made an oval object and two object lines that crossed within the oval. I then used the draw method to draw each of the objects. The setFill('color') was used to fill in each of the windows. I then called the window function within a for loop that changed x0 with each iteration through the loop. I used this method three times and changed the y-coordinate in order to make entire series of windows. In the second building function I created another empty variable to append all the objects in the building, and then used another function that iterated through each object in the list, and then used the draw function for each object in the list. I had two more functions in my city2.py file that would iterate through objects in a list, and one function cloned objects while the other moved them. Calling these functions within a loop from a separte file enabled me to draw three of these ugly buildings. The last of my animations was to make the ugly buildings shake by a random amount, and then return to their intial postion, as if their was an earthquake. Professor Maxwell demonstrated how to accomplish this in our lab session this week. A nested for loop uses an outer loop to generate random numbers, and the inner loop iterates through the building2 list of objects (stored in a variable) and moves each by the random amount specified in the outer loop, incorporating the time function to allow the pause for the "earthquake" effect.

Returning a variable with all of the objects in each function appended in a list made it possible it use a lot less code in the file that called the functions and drew them. Having all of the objects stored in a list within a variable lets a programmer take advantage of for loops that iterate through each object in a list and take a specific action. In my files, I created a for loop for drawing, moving, cloning, and animation, each of which iterated through the objects and performed the action defined by the loop.

The final product looked something like the .gif below. The only difference was that I changed the number of iterations so that I would not have to copy 720 images into the .gif file. Therefore the hands skip a little bit more in the image below.




Back To Home Page