CS 115 Lab 2, Part E: Draw squares and circles in the graphics window

Setup

Follow these instructions on your local computer to start writing graphical programs.

Right-click on this link: http://mcsp.wartburg.edu/zelle/python/graphics.py. Select "Save Link As..." or "Save Target As..." If you are on a Mac, save the file into your Documents directory. If you are on a PC, save it into C:\Python33 or C:\Python34. If it's already there, there's no need to overwrite it.
In a separate browser tab, open the reference document for the graphics library, just in case you need to refer to it during this lab.

Instructions

You will need to use IDLE for Part E, regardless of how you did Parts B, C, and D. If it's not already open, open IDLE on your local computer.
Go to the File menu and select "New File."

Copy the following text into that file:

"""
Lab 2E: This program draws a square and a circle
and computes their areas.
Author: _____________
"""
from graphics import *
import math


def main():
    # Draw the graphics window
    win = GraphWin("Lab 02e", 800, 800)

    # Draw the prompt to the user, centered near the top of the screen
    prompt = Text(Point(400, 50), 'Enter a number:')
    prompt.setSize(18)  # 18-point font
    prompt.setTextColor('black')  # just an example; black is the default
    prompt.draw(win)

    # Draw the text box for the user to type in,
    # centered just under the prompt and 20 characters long
    entry_box = Entry(Point(400, 100), 20)
    entry_box.draw(win)

    # Draw the button for the user to click
    button = Rectangle(Point(375, 175), Point(425, 225))
    button.setFill('gray')
    button.draw(win)

    # Draw the "OK" in the button
    button_text = Text(Point(400, 200), 'OK')
    button_text.setSize(18)
    button_text.draw(win)

    # Wait for the user to click on the button
    clicked_point = win.getMouse()  # wait for a click
    click_valid = False
    while not click_valid:
        # see if the click was actually on the button
        if 375 <= clicked_point.getX() <= 425 and 175 <= clicked_point.getY() <= 225:
            click_valid = True
        else:
            clicked_point = win.getMouse()  # wait for a new click

    ##### CHANGE THE AREA CALCULATIONS ######
    length = float(entry_box.getText())  # what the user typed
    square_area = 0
    circle_area = 0
    ##############################

    ##### CHANGE THE COORDINATES OF THE SQUARE'S CORNERS #####
    ##### Hint: they should be expressions involving the length variable #####
    sq_top_left = Point(0, 0)
    sq_bottom_right = Point(200, 200)
    ##############################
    square = Rectangle(sq_top_left, sq_bottom_right)

    ##### Optional: Change the colors of the square #####
    square.setOutline('red')
    square.setFill('yellow')
    square.draw(win)

    # Display the calculated area
    area_message = Text(Point(400, 725), 'The area of the square is ' + str(square_area) + '.')
    area_message.setSize(18)
    area_message.setTextColor('black')  # just an example; black is the default
    area_message.draw(win)

    # Display message about how to get the circle
    bottom_prompt = Text(Point(400, 750), 'Click anywhere in this window to draw the circle.')
    bottom_prompt.draw(win)
    win.getMouse()

    ##### CHANGE THE CIRCLE'S CENTER AND RADIUS #####
    circle_center = Point(0, 0)
    radius = 200
    ##############################
    circle = Circle(circle_center, radius)   

    ##### Optional: Change the colors of the circle #####
    circle.setOutline('red')
    circle.setFill('yellow')
    circle.draw(win)

    # Show the area of the circle instead of the square
    area_message.setText('The area of the circle is ' + str(round(circle_area, 3)) + '.')

    # Display message about how to exit
    bottom_prompt.setText('Click anywhere in this window to exit.')

    # Leave the window open until the user clicks in it, then close
    win.getMouse()
    win.close()


main()

Go to "File" and then "Save As", and save your file as lab02e.py in the default directory.
Go to the Run menu, then select Run Module. When you run the program, a graphics window should pop up. It may pop up in the background, so you may need to look in the start bar or dock for it. It will have this icon:
Type any numeric value in the entry box, and click in the window when prompted. The square should appear at the top left, only the bottom right corner of the circle should appear, and the areas should print as 0.
Just like in Lab 1, you will make strategic changes to the code to fix these problems. Start by finding the section of the code labeled "CHANGE THE AREA CALCULATIONS." Change the two lines of code that calculate the area of the square and circle. You should be able to copy these expressions from lab02bcd.py.
Run your program and verify that it prints the correct areas at the bottom of the graphics window. The shapes themselves will still be messed up.
Next, you will fix the circle. Find the section of the code labeled "CHANGE THE CIRCLE'S CENTER AND RADIUS," and make the following changes:
- Change the coordinates of the circle's center to be the center of the 800x800 graphics window. Remember that you figured this out in your pre-lab.
- Change the circle's radius to be the value the user entered.
Run your program twice, entering different positive values between 10 and 400 each time. The circle should be perfectly centered in the window, and its size should change according to the user's input.
Feel free to change the color of the circle where indicated. This page has the full list of colors.
Your final task is to fix the square so that it is the right size and centered in the window. Find the section of the code labeled "CHANGE THE COORDINATES OF THE SQUARE'S CORNERS," and change the numeric x and y values of sq_top_left and sq_bottom_right. The ungraded question from your pre-lab asked you to think about this problem. The changes that you make should work regardless of the side length, as long as it's between 0 and 800.

Stuck? Try this problem-solving strategy before calling for help:
- Draw! Get out a piece of paper and draw the 800x800 graphical window. Put a dot in the center point and label it. Then draw a square centered inside it.
- Pick a few representative values of the length entered by the user -- maybe 10, 50, and 100 -- and see where you would put the top left and bottom right corners of the square. Put those numbers into your code and see if you're happy with the result.
- Look at your calculations and see if you can generalize them to come up with a formula based on the side length.
Still stuck? Flag down a member of the course staff, show them what you've been thinking, and ask for a hint.
Run your program at least twice, entering different positive values between 10 and 400 each time.
Change the color of the square if you like, and rerun your program.
Call a member of the course staff to demo your program. You will only be demo-ing this part of the lab, not submitting your code for further testing.
Continue to Part F.