1 / 15

Today’s Class

Data: Programming Design and Modularization IS 101Y/CMSC 101 Computational Thinking and Design Thursday, September 26, 2013 Carolyn Seaman University of Maryland, Baltimore County. Today’s Class. Processing concepts: Review: Functions Images: PImage type, loadImage (), image()

omana
Download Presentation

Today’s Class

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. Data: Programming Design and ModularizationIS 101Y/CMSC 101Computational Thinking and DesignThursday, September 26, 2013Carolyn SeamanUniversity of Maryland, Baltimore County

  2. Today’s Class • Processing concepts: • Review: • Functions • Images: PImage type, loadImage(), image() • Keyboard input: keyPressed(), key • Mouse location: mouseX, mouseY • New: • Clock time and program time: millis(), ... • Arrays: collections (lists) of objects • Designing, Testing and Debugging • Demonstrated through a live coding session...

  3. What Does That Mean?? • “It looks like you’re mixing “active” and “static” modes.” • “static” mode is when your Processing program is just a list of instructions – those instructions are run once and then the program ends • “active” mode is when you define the setup() and/or draw() functions and the program runs continuously looking for input • If you have any functions defined, you can’t have commands outside those functions – you need to use setup() and draw() • If you want anything to happen after setup() runs (e.g., when a key is pressed), you must have a draw() function (even if it’s empty)

  4. Functions • Why do you need functions? • Abstraction – focus on details once, then forget about them • Repetition – do the same thing multiple times • Clarity – give a set of complex commands a meaningful name • Modularity – building a program out of coherent pieces rather than one big mess • What is a function? • A function is a set of commands, bundled together with a name, some parameters, and a return value, designed to complete one task • Sometimes called a procedure if it doesn’t have a return value • In some languages, called a method • How do you use functions? • ……

  5. Creating a Function <type> <function name> ( <parameters> ) { <body> } Where: • <type> is the type of data that the function returns as an answer • <type> is often void which means that the function does not return any value as an answer (this kind of function is sometimes called a procedure) • <function name> is a name you choose to describe what the function does • <parameters> is a list of pieces of data that the function needs to do its job, i.e. its input; each parameter has a type and a name, i.e. <type> <name> • <body> is a list of commands and control statements that carry out the task the function is supposed to perform; must include a return statement if the function returns a value (i.e. if it’s not void)

  6. Calling a Function <function name> ( <parameter values>) ; Where <function name> is the name the function was given when it was created <parameter values> is a list of values for each parameter, in the order that the parameters were listed when the function was created

  7. Example Since the function has a type (not void), there has to be at least one return statement • Creating the function product: float computePower (float x, int a) { float answer = 1; inti; for (i = 1; i <= a; i++) { answer = answer * x; } return (answer); } • Calling the function compute_power: float radius = 5.5; float area = 3.14 * computePower (radius, 2); Parameter values have to be of the same types, in the same order, as the parameters in the function definition.

  8. Example Since the function does not have a type (void), there is no return statement • Creating the function printInstructions: void printInstructions (int iterations) { inti; println (“Stir the batter once.”); for (i = 2; i <= iterations; i++) { println (“Now stir it again.”); } } • Calling the function printInstructions: printInstructions (5); Parameter values have to be of the same types, in the same order, as the parameters in the function definition. Parameter values can be variables, constants, or expressions. Calling a function that doesn’t have a return value constitutes a program statement all by itself; doesn’t have to be embedded in an expression.

  9. Handling Images in Processing • Images: • PImage– a special data type for variables that hold “raster images” (basically a pixel array) • PImageloadImage (FILENAME) – a built-in function that you can call to load an image from a file (whose name is given as a string input). Returns an object of type PImage, so you would call it this way:PImageimageVariable; ...imageVariable = loadImage (“mypicture.png”); • void image (IMAGE, X, Y) – a built-in function that draws the PImage named IMAGE at location [X,Y] • void image (IMAGE, X, Y, WIDTH, HEIGHT) – if given five arguments, the last two specify the desired width and height of the drawn image (otherwise the image is drawn “actual size”)

  10. Keyboard Input • void keyPressed() – function that is automatically called whenever a key is pressed while a Processing program is running • To handle keyboard input, you would add this function to your Processing program • At any time, you can refer to the special variable key (of type “char”) to see what key was pressed • Example (which should look familiar...):void keyPressed() { if (key == ‘s’) { save (“garden.png”); } }

  11. Mouse Location • At any time while a Processing program is running, the special variables mouseX and mouseY will hold the X and Y coordinates of the mouse pointer’s location • Example (what will it do?!): void keyPressed() { text (key, mouseX, mouseY);}

  12. Timing Your Programs • Processing has two concepts of time: clock time and program time • Clock time is the real-world time • year() – current year, an integer (e.g., 2013) • month() – current month, from 1 to 12 • day() – current day of the month, from 1 to 31 • hour() – hour of the day, from 0 (midnight) to 23 (11pm) • minute() – minute of the hour, from 0 to 59 • second() – second of the minute, from 0 to 59 • Program time is how long the program has been running • millis() – the number of milliseconds elapsed since the program started

  13. Arrays • As discussed in St. Amant Chapter 4, we often need to store much more information than we could capture in a bunch of variables • Suppose we wanted to plant a garden of 25 plants and then be able to interact with them – change the type, water them, fertilize them, etc. • We probably wouldn’t want 25 different variables, one for each plant! • Especially since we might end up wanting 100 plants instead... • Arrays are used to create lists or sets of similar type variables that can be individually accessed and manipulated

  14. Defining and Using Arrays • If we want a list of numPlants plants, each with an X and Y location, we can define two arrays, one to hold the X values and one to hold the Y values:intnumPlants = 5;inti; ... float[] plantX = new float[numPlants]; float[] plantY = new float[numPlants]; ... for ( i=0 ; i<numPlants ; i++ ) {plantX[i] = 100 + 100*i;plantX[i] = 100 + 50*i; } • Where will the plants be planted (that is, what are the X and Y locations? – note that nothing has actually been drawn by the code... we have to DO something with the X and Y values for anything to happen!) “new TYPE[LENGTH]” creates an empty array with space for LENGTH objects of type TYPE The plants are “indexed” from 0 to numPlants-1

  15. Live Design & Coding • CrashBasics.pde • Functionality: • A frog appears anywhere the user types an “f” • After a fixed period of time, the frog disappears • Top-down design • Implementation and debugging

More Related