Mouse Inputs in Processing. Interacting with the Mouse mouseX and mouseY: pg 205-211mouseXmouseY –The position of the mouse in the canvas pmouseX and.

Slides:



Advertisements
Similar presentations
Physical Computing INST. Kerem Odabaşı - YTU - Interactive Telecomunication Design Dept.
Advertisements

Creative Computing. \\ aims By the end of the session you will be able to: 1.Move objects around 2.Write simple interactive programs 3.Use the mouse position.
Variables Conditionals Boolean Expressions Conditional Statements How a program produces different results based on varying circumstances if, else if,
Lesson One: The Beginning Chapter 3: Interaction Learning Processing: by Daniel Shiffman Presentation by Donald W. Smith Graphics from text.
Introduction to Programming
Game with US Beginner Tutorial. Welcome!! Who I am What is Processing? Basic Coding Input Methods Images Classes Arrays.
A Quick Introduction to Processing
Emerging Platform#5: Processing 2 B. Ramamurthy 6/13/2014B. Ramamurthy, CS6511.
 Variables  What are they?  Declaring and initializing variables  Common uses for variables  Variables you get “for free” in Processing ▪ Aka: Built-in.
Creating an OOED Application
© Copyright by Deitel & Associates, Inc. and Pearson Education Inc. All Rights Reserved. 1 Tutorial 21 - “Cat and Mouse” Painter Application.
Processing Processing is a simple programming environment that was created to make it easier to develop visually oriented applications with an emphasis.
IAT 334 Java using Processing ______________________________________________________________________________________ SCHOOL OF INTERACTIVE ARTS + TECHNOLOGY.
FUNDAMENTALS OF PROGRAMMING SM1204 Semester A 2011.
IAT 800 Lab 1: Loops, Animation, and Simple User Interaction.
ICM Week 2. Structure - statements and blocks of code Any single statement ends with semicolon ; When we want to bunch a few statements together we use.
Lecture 3 IAT 800. Sept 15, Fall 2006IAT 8002 Suggestions on learning to program  Spend a lot of time fiddling around with code –Programming is something.
PROCESSING Animation. Objectives Be able to create Processing animations Be able to create interactive Processing programs.
Beech Hall School Computing Science Course. To learn how to design and create a software application – an App Learn the basics of App Design Learn the.
Review Blocks of code {.. A bunch of ‘statements’; } Structured programming Learning Processing: Slides by Don Smith 1.
FUNDAMENTALS OF PROGRAMMING SM1204 SEMESTER A 2012.
Programming for Artists ART 315 Dr. J. R. Parker Art/Digital Media Lab Lec 10 Fall 2010.
1 k Jarek Rossignac,  2008 Processing  Install Processing  Learn how to edit, run, save, export, post programs  Understand.
Continuous February 16, Test Review What expression represents the zip car eligibility rules of at least 18 years old and no incidents?
Keyboard and Events. What about the keyboard? Keyboard inputs can be used in many ways---not just for text The boolean variable keyPressed is true if.
Processing Lecture.2 Mouse and Keyboard
Review of ArT3 Programming Course David Meredith Aalborg University
Introduction to Processing CS 4390/5390 Fall 2014 Shirley Moore, Instructor September 3,
______________________________________________________________________________________ SCHOOL OF INTERACTIVE ARTS + TECHNOLOGY [SIAT] |
Programming for Artists ART 315 Dr. J. R. Parker Art/Digital Media Lab Lec 10 Fall 2010.
B. RAMAMURTHY Lab1 Discussion. General Instructions Attend the recitation (s), office hours (s) to get help Read the Lab description Understand what is.
Introduction to Processing. 2 What is processing? A simple programming environment that was created to make it easier to develop visually oriented applications.
1 Georgia Tech, IIC, GVU, 2006 MAGIC Lab Rossignac Lecture 02b: Tutorial for Programming in Processing Jarek Rossignac.
© Copyright by Deitel & Associates, Inc. and Pearson Education Inc. All Rights Reserved. 1 Outline 21.1 Test-Driving the Painter Application.
© Copyright by Deitel & Associates, Inc. and Pearson Education Inc. All Rights Reserved. 1 Tutorial 21 - “Cat and Mouse” Painter Application.
CIS 3.5 Lecture 2.2 More programming with "Processing"
Lesson Two: Everything You Need to Know
Variables Art &Technology, 3rd Semester Aalborg University Programming David Meredith
Arrays. An array is a collection “The Dinner offers an array of choices.” In computer programming, an array is a collection of variables of the same data.
Lesson Two: Everything You Need to Know
Lawrence Snyder University of Washington, Seattle © Lawrence Snyder 2004 More details and explanation …
Processing TYWu. Where can I download? 2.0b9 Windows 32-bit.
Repetition. Loops Allows the same set of instructions to be used over and over again Starts with the keyword loop and ends with end loop. This will create.
______________________________________________________________________________________ SCHOOL OF INTERACTIVE ARTS + TECHNOLOGY [SIAT] |
G RAPHICS & I NTERACTIVE P ROGRAMMING Lecture 2 More Programming with Processing.
Continuous. Flow of Control Programs can broadly be classified as being –Procedural Programs are executed once in the order specified by the code varied.
Processing TYWu. Where can I download? 2.0b9 Windows 32-bit.
B. RAMAMURTHY Processing and Programming cse
Welcome to Processing Who does not have access to digital camera?
1 SIC / CoC / Georgia Tech MAGIC Lab Rossignac Processing  Install Processing  Learn how to edit, run, save, export,
What is Computing? What can be Programmed? Creative Computing Processing Downloading Processing Dropbox Primitive Shapes – point – line – triangle – quad.
Processing Variables. Variables Processing gives us several variables to play with These variables are always being updated and you can assume they have.
Review Random numbers mouseX, mouseY setup() & draw() frameRate(), loop(), noLoop() Mouse and Keyboard interaction Arcs, curves, bézier curves, custom.
Introduction to Processing Dominique Thiebaut Dept. Computer Science Computer Science Dominique Thiebaut Thiebaut -- Computer Science.
Variables. Something to mention… void setup(){ size(200, 200); background(255); smooth(); } void draw() { stroke(0); strokeWeight(abs(mouseX-pmouseX));
Introduction to Processing David Meredith Aalborg University Art &Technology, 3rd Semester Programming.
Task 1 and Task 2. Variables in Java Programs Variables start with lower case letter Variables are descriptive of what they store Variables are one word.
p5.js mouse, keyboard and if’s
Chapter 14, Translate & Rotate
Computation as an Expressive Medium
For Net Art Lecture 2 J Parker
Chapter 10 Algorithms.
Mouse Inputs in Processing
Chapter 5, Conditionals Brief Notes
More programming with "Processing"
A Few Notes Starting August 29, 2018
IAT 265 Lecture 2: Java Loops, Arrays Processing setup, draw, mouse Shapes Transformations, Push/Pop.
LCC 6310 Computation as an Expressive Medium
Chapter 10 Algorithms.
Continuous & Random September 21, 2009.
Presentation transcript:

Mouse Inputs in Processing

Interacting with the Mouse mouseX and mouseY: pg mouseXmouseY –The position of the mouse in the canvas pmouseX and pmouseY: pg 208pmouseXpmouseY –The previous position of the mouse (in the last frame) mouseButton: pg mouseButton –Which mouse button has pressed mousePressed: pg mousePressed –true if the mouse button is pressed, false otherwise mousePressed() : pg mousePressed() –Function that runs when the mouse is pressed

Hello Mouse void setup() { size(400, 400); stroke(255); } void draw() { // try moving background() to setup() background(192, 64, 200); // mouseX is a variable that stores the horizontal position // of the mouse. // mouseY is a variable that stores the vertical position // of the mouse. line(150, 25, mouseX, mouseY); }

Moving with the Mouse // Circle follows the cursor void setup() { size(100, 100); smooth(); noStroke(); } void draw() { background(126); ellipse(mouseX, mouseY, 33, 33); }

Highlighting with the Mouse // Cursor position selects a quadrant of the display window void setup() { size(100, 100); noStroke(); fill(0); } void draw() { background(204); if ((mouseX <= 50) && (mouseY <= 50)) { rect(0, 0, 50, 50); // Upper-left } else if ((mouseX 50)) { rect(0, 50, 50, 50); // Lower-left } else if ((mouseX > 50) && (mouseY < 50)) { rect(50, 0, 50, 50); // Upper-right } else { rect(50, 50, 50, 50); // Lower-right }

pmouse // Draw a line between the current and previous positions void setup() { size(100, 100); strokeWeight(8); smooth(); } void draw() { background(204); // pmouseX is a variable that stores the horizontal position // of the mouse in the previous frame. // pmouseY is a variable that stores the vertical position of // the mouse in the previous frame. line(mouseX, mouseY, pmouseX, pmouseY); }

mousePressed and mouseButton Like mouseX and mouseY, mousePressed is a property of the mouse (a variable), but it is of type boolean. The mousePressed variable stores true if any mouse button is pressed, and false otherwise. It reverts to false as soon as the button is released. The mouseButton variable is LEFT, CENTER, or RIGHT depending on the mouse button most recently pressed. mouseButton retains its value until a different mouse button is pressed

A Simple Paint Example int brushSize = 20; void setup() { size(400, 400); smooth(); noStroke(); background(255); } void draw() { if (mousePressed) { brush(mouseX, mouseY); } void brush(int x, int y) { fill(#CC3300); // note the color is specified as a hexadecimal number arc(x, y, brushSize, brushSize, 0, PI); fill(#003333); // note the color is specified as a hexadecimal number arc(x, y, brushSize, brushSize, PI, TWO_PI); }

mousePressed() We can try to get the same functionality by using the mousePressed() event instead of the mousePressed variable. To use event, we need to write a function by the same name in our sketch, and it will be called automatically every time the event occurs. In the following code, mousePressed() will be called every time the mouse is pressed.

int brushSize = 20; void setup() { size(400, 400); smooth(); noStroke(); background(255); } void draw() { // keep the motor running } void mousePressed() { brush(mouseX, mouseY); } void brush(int x, int y) { fill(#CC3300); arc(x, y, brushSize, brushSize, 0, PI); fill(#003333); arc(x, y, brushSize, brushSize, PI, TWO_PI); }

mousePressed vs. mousePressed() You'll notice that the program does not behave the same way. Although the mousePressed variable and the mousePressed() event have the same name, they represent different things mousePressed is true for as long as the mouse button is down, whereas mousePressed() is called once whenever the mouse becomes pressed, i.e. once per click.