1. Complete these exercises to practice creating user functions in small sketches.

Transcription

1 Lab 6 Due: Fri, Nov 4, 9 AM Consult the Standard Lab Instructions on LEARN for explanations of Lab Days ( D1, D2, D3 ), the Processing Language and IDE, and Saving and Submitting. Rules: Do not use the translate(), scale(), or rotate() functions. 1. Complete these exercises to practice creating user functions in small sketches. All sketches use the default 100 x 100 canvas. SAVE each sketch as L6_1a, L6_1b, L6_1c, etc. a. D1 Convert the sketch called car from 02a Drawing lecture demo code, so all the car drawing statements are in a parameterless function called car. Your draw() function should look exactly like this: background(255); // white car() ; CS 105 Lab 6 Functions Page 1 of 8

2 b. D1 Convert the solution for part 1f in Lab 5 (the sketch called L5_1f ) to use a parameterless function called grid that draws the 6 by 6 grid composed of 14 black lines that fills the canvas. Your draw() function should look exactly like this: background(200); grid(); c. D1 Create two parameterless functions to set multiple drawing attributes at the same time, a bit like an Adobe Illustrator graphic style. The first function is called style1 and all it does is set the drawing state to a red stroke with weight 15 with no fill. The second function called style2 sets the drawing state of a blue stroke with weight 4 and an orange fill. You ll use these two functions to draw two ellipses, each in a different style. Your draw() function should look exactly like this: background(255); style1(); ellipse(30, 30, 40, 40); style2(); ellipse(70, 70, 40, 40); CS 105 Lab 6 Functions Page 2 of 8

3 d. D1 In this course, we draw a lot of circles by calling the ellipse function with the exact same value for its width and height arguments. Create a new function called circle with 3 parameters for the x position and y position of the circle and its diameter. For example, calling circle(25, 50, 33) would draw a 33 pixel circle centred at the xy position 25, 50. background(200); circle(70, 55, 55); circle(50, 45, 44); circle(25, 50, 33); e. D1 Convert the solution for part 1a in Lab 5 (the sketch called L5_1a ) to a function called lines that draws horizontal lines starting from the top of the canvas 10 pixels apart. Your function should have 1 parameter for the number of lines. Calling lines(7) should make the same drawing as the solution to part 1a in Lab 5. background(200); lines(3); CS 105 Lab 6 Functions Page 3 of 8

4 f. D1 Convert the solution for part 1i in Lab 5 (the sketch called L5_1i ) to a function called rings that draws coloured rings in the centre of the canvas. Your function should have 3 parameters in this order: the number of rings, the outside ring diameter, and the amount to decrease each inner ring diameter. Calling rings(8, 80, 10) should produce the same drawing as the solution to part1i in Lab 5. background(#ffffff); rings(5, 90, 15); CS 105 Lab 6 Functions Page 4 of 8

5 g. D1 Convert your solution for part a so that your car function takes three parameters in this order: the x position of centre of the car roof, the y position of the bottom of the car, and grey shade of the car body. To work out the relative coordinates of each shape, the drawing on graph paper below will help. The red circle is the x and y position to draw all shapes relative to. For example. The centre of the rear wheel is at (x + 10, y - 10) and the centre of the front wheel is at (x - 25, y - 10). The image below should be created by this draw() function: background(255); car(mousex, mousey, 128); CS 105 Lab 6 Functions Page 5 of 8

6 h. D2 Convert one part of the solution for part 1j in Lab 5 (the sketch called L5_1j ) to a function called gethue that returns a number representing a hue between 0 and 360 based on 2 parameters: a current value and the maximum expected value (the end1 value used in map). The draw() function below should recreate the solution to part 1j in Lab 5: int hue = gethue(mousex, width); background(hue, 100, 100); fill(0); text(hue, width / 2, height / 2); i. D2 Convert one part of the solution for part 1f in Lab 4 (the sketch called L4_1f ) to a function called squarehittest that returns true if a point is inside a square. Specifically, define a function called squarehittest that returns a boolean value that is true if a point (defined by parameters px and py) is inside a square (defined by location of the top left corner of the square, sx and sy, and the square s size ss). Note your function doesn t draw the square or change the fill, it only returns the true or false results of the square hit test. Here s what your function signature should look like: boolean recthittest(float px, float py, float sx, float sy, float ss) With your function, the code below should recreate the demo code: // size and position of square CS 105 Lab 6 Functions Page 6 of 8

7 int s = 33; int x = 27; int y = 46; background(200); // just hit testing if ( squarehittest(mousex, mousey, x, y, s) ) { fill(255); else { nofill(); // subtracting 1 accounts for how processing // make shapes with a 1 pixel stroke, 1 pixel wider // than they should be rect(x, y, s - 1, s - 1); j. D2 Write a function called getspacing that returns the spacing (as a float) between the centre of objects based on two parameters: the number of objects, and the total space to display all the objects. background(255); nofill(); float s = getspacing(7, width) ; for (int i = 0; i < 7; i++) { ellipse((i + 1) * s, height / 2, 10, 10); CS 105 Lab 6 Functions Page 7 of 8

8 background(255); nofill(); float s = getspacing(15, height) ; for (int i = 0; i < 15; i++) { line(10, (i + 1) * s, width - 10, (i + 1) * s); Submitting Submit all sketch directories from this lab as one ZIP file called L6.zip to the lab dropbox (under Assessments on Learn). Consult How to Submit: Handing in Code for Labs and Assignments on Learn for more information how to create a ZIP. It is your responsibility to submit to the correct dropbox with the correct files before the deadline. Otherwise you will receive a mark of 0. CS 105 Lab 6 Functions Page 8 of 8