Shiffman Daniel. Learning processing
Подождите немного. Документ загружается.
392 Learning Processing
With LiveInput , however, we are not going to make any object instances . Since the Sonia library only
allows one input source,
1
there is no reason to refer to a specifi c LiveInput object. Instead, when listening
to the microphone, we refer to the LiveInput class as a whole:
LiveInput.start(); // Start LiveInput
Functions that we call from the class name itself (rather than from a specifi c object instance) are known
as static functions. We can’t create static functions ourselves in Processing so it is not something we need
to worry about too much. However, since they are part of Java, we will encounter them from time to time
when using contributed libraries. LiveInput is an example of a class with static functions for retrieving
the sound and pitch levels from a microphone.
Let’s begin by building a very simple example that ties the size of a circle to the sound level of the
microphone.
Step #1 is exactly what we just did, start the process of listening to the computer’s microphone.
LiveInput.start(); // Start LiveInput
Step #2 is reading the volume level from the microphone itself . We can do this two ways. Because the
microphone listens in stereo, we can read the volume level from the right or left channel with getLevel( ) :
float rightLevel = LiveInput.getLevel(Sonia.RIGHT);
float leftLevel = LiveInput.getLevel(Sonia.LEFT);
We can also simply listen to both channels.
float level = LiveInput.getLevel();
e level returned will always range between 0.0 and 1.0.
Putting it all together, and tying the sound level to the size of an ellipse, we have:
Example 20-5: Live Input with Sonia
// Import the Sonia library
import pitaru.sonia_v2_9.*;
void setup() {
size(200,200);
Sonia.start(this);
// Start listening to the microphone
LiveInput.start();
smooth();
}
1
Sonia’s Live Input will listen to whatever audio source is set up as the “sound input” device on your computer. You could use a
built-in microphone, a line-in from another audio source, or even potentially the CD player on your computer. A Sample object can
also be treated as live input by using the function: connectLiveInput( ).
We can specify whether we
want to listen to the RIGHT or
LEFT channel’s volume.
All functions for
sound input are static,
meaning they are called
from the class name
itself, LiveInput, rather
than an object instance.
With no argument, getLevel()
returns the volume of both
RIGHT and LEFT combined.
Sound 393
20.6 Sound Thresholding
A common sound interaction is triggering an event when a sound is made. Consider “ the clapper. ” Clap,
the lights go on. Clap again, the lights go off . A clap can be thought of as a very loud and short sound.
To program “ the clapper ” in Processing, we will need to listen for volume and instigate an event when the
volume is high.
In the case of clapping, we might decide that when the overall volume is greater than 0.5, the user is
clapping (this is not a scientifi c measurement, but is good enough for this example). is value of 0.5
is known as the threshold. Above the threshold, events are triggered, below, they are not.
float vol = LiveInput.getLevel();
if (vol > 0.5) {
// DO SOMETHING WHEN THE VOLUME IS GREATER THAN ONE!
}
Example 20-6 draws rectangles in the window whenever the overall volume level is greater than 0.5. e
volume level is also displayed on the left-hand side as a bar.
Example 20-6: Sound threshold with Sonia
// Import the Sonia library
import pitaru.sonia_v2_9.*;
void setup() {
size(200,200);
Sonia.start(this); // Start Sonia engine.
LiveInput.start(); // Start listening to the microphone
smooth();
background(255);
}
void draw() {
background(255,120,0);
// Get the overall volume (between 0 and 1.0)
float level = LiveInput.getLevel();
fill(200);
stroke(50);
// Draw an ellipse with size based on volume
ellipse(width/2,height/2,level*200,level*200);
}
// Close the sound engine
public void stop() {
Sonia.stop();
super.stop();
}
Exercise 20-5: Rewrite Example 20-5 with left and right volume levels mapped to
diff erent circles.
The variable that stores the
volume (“level”) is used as
the size of an ellipse.
fi g. 20.3
void draw() {
// Get the overall volume (between 0 and 1.0)
float vol = LiveInput.getLevel();
// If the volume is greater than 0.5, draw a rectangle
if (vol > 0.5) {
stroke(0);
fill(0,100);
rect(random(width),random(height),vol*20,vol*20);
}
// Graph the overall volume
// First draw a background strip
fill(175);
rect(0,0,20,height);
// Then draw a rectangle size according to volume
fill(0);
rect(0,height-vol*height/2,20,vol*height/2);
}
// Close the sound engine
public void stop() {
Sonia.stop();
super.stop();
}
is application works fairly well, but does not truly emulate the clapper. Notice how each clap results in
several rectangles drawn to the window. is is because the sound, although seemingly instantaneous to
our human ears, occurs over a period of time. It may be a very short period of time, but it is enough to
sustain a volume level over 0.5 for several cycles through draw( ) .
In order to have a clap trigger an event one and only one time, we need to rethink the logic of our
program. In plain English, this is what we are trying to achieve:
• If the sound level is above 0.5, then you are clapping and trigger the event. However, do not trigger the
event if you just did a moment ago!
e key here is how we defi ne “ a moment ago. ” One solution would be to implement a timer, that is, only
trigger the event once and then wait one second before you are allowed to trigger the event again. is is
a perfectly OK solution. Nonetheless, with sound, a timer is totally unnecessary since the sound itself will
tell us when we are fi nished clapping!
• If the sound level is less than 0.25, then it is quiet and we have finished clapping.
OK, with these two pieces of logic, we are ready to program this “ double-thresholded ” algorithm. ere
are two thresholds, one to determine if we have started clapping, and one to determine if we have
fi nished. We will need a boolean variable to tell us whether we are currently clapping or not.
Assume clapping false to start.
• If the sound level is above 0.5 and we are not already clapping, trigger the event and set clapping t r u e .
• If we are clapping and the sound level is less than 0.25, then it is quiet and set clapping false.
394 Learning Processing
If the volume is greater than 0.5
a rectangle is drawn at a random
location in the window. The louder
the volume, the larger the rectangle.
Sound 395
In code, this translates to:
// If the volume is greater than one and we are not clapping, draw a rectangle
if (vol > 0.5 & & !clapping) {
// Trigger event!
clapping = true; // We are now clapping!
} else if (clapping & & vol < 0.25) { // If we are finished clapping
clapping = false;
}
Here is the full example where one and only one rectangle appears per clap.
Example 20-7: Sound events (double threshold) with Sonia
// Import the Sonia library
import pitaru.sonia_v2_9.*;
float clapLevel = 0.5; // How loud is a clap
float threshold = 0.25; // How quiet is silence
boolean clapping = false;
void setup() {
size(200,200);
Sonia.start(this); // Start Sonia engine.
LiveInput.start(); // Start listening to the microphone
smooth();
background(255);
}
void draw() {
// Get the overall volume (between 0 and 2.0)
float vol = LiveInput.getLevel();
// If the volume is greater than 0.5 and
// we are not clapping, draw a rectangle
if (vol > clapLevel & & !clapping) {
stroke(0);
fill(0,100);
rect(random(width),random(height),vol*20,vol*20);
clapping = true; // We are now clapping!
// If we are finished clapping
} else if (clapping & & vol < threshold) {
clapping = false;
}
// Graph the overall volume
// First draw a background strip
noStroke();
fill(200);
rect(0,0,20,height);
// Then draw a rectangle size according to volume
fill(100);
rect(0,height-vol*height/2,20,vol*height/2);
fi g. 20.4
If the volume is greater
than 1.0, and we were not
previously clapping, then we
are clapping!
Otherwise, if we were just
clapping and the volume
level has gone down below
0.25, then we are no longer
clapping!
// Draw lines at the threshold levels
stroke(0);
line(0,height-clapLevel*height/2,19,height-clapLevel*height/2 );
line(0,height-threshold*height/2,19,height-threshold*height/2 );
}
// Close the sound engine
public void stop() {
Sonia.stop();
super.stop();
}
Exercise 20-6: Trigger the event from Example 20-7 after a sequence of two claps. Here is
some code to get you started that assumes the existence of a variable named “ clapCount ” .
if (vol > c lapLevel & & !clapping) {
clapCount___;
if (_______________) {
________________;
________________;
________________;
}
_________________;
} else if (clapping & & vol < 0.5) {
clapping = false;
}
Exercise 20-7: Create a simple game that is controlled with volume. Suggestion: First make
the game work with the mouse, then replace the mouse with live input. Some examples are
Pong, where the paddle’s position is tied to volume, or Duck Hunt, where a bullet is shot
whenever the user claps.
396 Learning Processing
Exporting 397
21 Exporting
“ Wait a minute. I thought that Art wanted to give up the exporting. ”
—Seinfeld
In this chapter:
– Web applets.
– Stand-alone applications.
– High resolution PDFs.
– Images and image sequences.
– QuickTime movies.
We have focused our energy in this book on learning to program. Nevertheless, eventually our code babies
will grow up and want to fi nd their way out in the world. is chapter is dedicated to a discussion of the
various publishing options available to Processing sketches.
21.1 Web Applets
Processing sketches can be exported as Java applets to run on the web. How this works is covered in
Chapter 2. We have seen, however, that because of security restrictions, applets cannot perform certain
tasks, such as connect to a remote server or access a serial port, web camera, or other hardware device.
If you have a sketch that you must publish online, but uses a feature that is restricted, there are some
solutions. One possibility (as mentioned in Chapter 16) is to sign your applet. Some tips on how to do
this are available at this book’s web site ( http://www.learningprocessing.com/sandbox ).
21.2 Stand-Alone Applications
A great feature of Processing is that sketches can
be published as stand-alone applications, meaning
double-clickable programs that can run without the
Processing development environment being installed.
If you are creating a program for an installation or
kiosk environment, this feature will allow you to
create applications that easily can be launched when
a machine boots up. Export Application is also useful
if you need to run multiple copies of a sketch at the
same time (such as in the case of the client/server
examples in Chapter 19) . None of the applet security
restrictions apply to applications.
To export as an application, go to:
FILE → EXPORT APPLICATION (see Figure 21.1 )
You will then notice that three new folders appear as shown in Figure 21.2 .
fi g. 21.1
398 Learning Processing
Processing auto-creates applications for three operating systems, Mac OS X, Windows, and Linux. If you
Export Application from a Windows computer, the Mac application will not work properly (instructions
for fi xing this issue are included in a readme.txt fi le that appears). To avoid this, simply Export
Application on a Mac.
e folder will contain all the fi les you need:
• sketchName.exe (or named simply sketchName on Mac and Linux). This file is the double-clickable
application.
• “ source ” directory . The application folder will include a directory containing the source files for your
program. This folder is not required to run the application.
• “ lib ” . This folder only appears for Windows and Linux and contains required library files. It will always
contain core.jar , the core processing library, as well as any others you import. On Mac OS X, the library
files are visible by control-clicking the application file and selecting “ Show Package Contents. ”
e user of your application will need Java installed on his or her computer in order for the application
to run properly. On a Mac, Java comes preinstalled with the operating system, so you should not have
any issues as long as the end user has not messed with their Java installation. On Windows, if this is
a concern, you can include Java with the application by copying the “ Java ” folder from the Processing
directory to the application folder (and you must be on a PC to do this).
ere are a few tricks related to the Export Application feature. For example, if you want to have your own
text in the title bar, you can add the following code to setup( ) .
frame.setTitle( " My super-awesome application! " );
In addition, although exported applications run in windowed mode (as opposed to “ present ” mode),
you can set applications to run full screen by adding some code. Understanding the code requires some
advanced knowledge of Java and the inner workings of Processing sketches.
Some clues to this will be revealed in Chapter 23 , but for now this code is off ered simply to be copied:
static public void main(String args[]) {
PApplet.main(new String[] { " --present " , " SketchName " } );
}
fi g. 21.2
Exporting 399
is code can be inserted anywhere as its own block (above setup( ) is a good place for it). e
“ SketchName ” must match the name of your Processing sketch.
Exercise 21-1: Export a stand-alone application for any Processing sketch you have made
or any example in this book.
21.3 High-Resolution PDFs
We have been using Processing primarily as a means for creating graphics programs that run on a
computer screen. In fact, if you recall Chapter 3, we spent a great deal of time learning about how the
fl ow of a program works over time. Nevertheless, now is a good time to return to the idea of a static
program, one whose sole purpose is to create a static image. e Processing PDF library allows us to take
these static sketches and create high-resolution images for print. (In fact, almost all of the images in this
book were produced with this method.)
Following are the required steps for using the PDF library.
Step 1. Import the library.
import processing.pdf.*;
Step 2. In setup( ) , use the size( ) function with “ PDF ” mode and a String fi lename argument.
size(400, 400, PDF, "filename.pdf");
Step 3. In draw( ) , do your magic!
background(255);
fill(175);
stroke(0);
ellipse(width/2,height/2,160,160);
Step 4. Call the function “ exit( ) ” . is is very important. Calling exit( ) causes the PDF to fi nish
rendering. Without it, the fi le will not open properly.
exit(); // Required!
Here is how the program looks all together:
Example 21-1: Basic PDF
// Import the library
import processing.pdf.*;
// Using "PDF" mode, 4th argument is the name of the file
size(400, 400, PDF, "filename.pdf");
400 Learning Processing
// Draw some stuff!
background(255);
fill(175);
stroke(0);
ellipse(width/2,height/2,160,160);
// Very important, required for the PDF to render properly
exit();
If you run this example, you will notice that no window appears. Once you have set the Processing
rendering mode to PDF, the sketch window will no longer appear. is is because one often uses PDF
mode to create extremely high-resolution, complex images that cannot easily be displayed onscreen.
However, it is possible to see the Processing sketch window while rendering a PDF using the functions
beginRecord( ) and endRecord( ) . is runs slower than the fi rst example, but allows you to see what is
being saved.
Example 21-2: PDF using beginRecord( )
import processing.pdf.*;
void setup() {
size(400, 400);
beginRecord(PDF, " filename.pdf " );
}
void draw() {
// Draw some stuff!
smooth();
background(100);
fill(0);
stroke(255);
ellipse(width/2,height/2,160,160);
endRecord();
noLoop();
}
endRecord( ) does not have to be called on the fi rst frame rendered, and therefore this mode can be used
to generate a PDF compiled from multiple cycles through draw( ) . e following example takes the
“ Scribbler ” program from Chapter 16 and renders the result to a PDF. Here the colors are not taken from
a video stream, but are picked based on a counter variable. See Figure 21.3 for a sample output.
Example 21-3: Multiple frames into one PDF
import processing.pdf.*;
float x 0;
float y 0;
beginRecord( ) starts the process.
The fi rst argument should read PDF
and the second is the fi lename.
endRecord( ) is called to fi nish
the PDF.
There’s no reason to loop any more
since the PDF is fi nished.
Exporting 401
void setup() {
size(400, 400);
beginRecord(PDF, "scribbler.pdf");
background(255);
}
void draw() {
// Pick a new x and y
float newx = constrain(x + random( -20,20),0,width);
float newy = constrain(y + random( -20,20),0,height);
// Draw a line from x,y to the newx,newy
stroke(frameCount%255,frameCount*3%255,
frameCount*11%255,100);
strokeWeight(4);
line(x,y,newx,newy);
// Save newx, newy in x,y
x newx;
y newy;
}
// When the mouse is pressed, we finish the PDF
void mousePressed() {
endRecord();
// We can tell Processing to open the PDF
open(sketchPath( "scribbler.pdf"));
noLoop();
}
If you are rendering 3D shapes (in P3D mode or OPENGL), you will want to use beginRaw( )
and endRaw( ) instead of beginRecord( ) and endRecord( ) . is example also uses a boolean variable
( “ recordPDF ” ) .
Example 21-4: PDF and openGL
// Using OPENGL
import processing.opengl.*;
import processing.pdf.*;
// Cube rotation
float yTheta = 0.0;
float xTheta = 0.0;
// To trigger recording the PDF
boolean recordPDF = false;
void setup() {
size(400, 400, OPENGL);
smooth();
}
fi g. 21.3
background( ) should be in setup( ). If
background( ) is placed in draw( ) the PDF
would accumulate a lot of graphics elements
only to erase them over and over again.
In this example, the user chooses when to fi nish
rendering the PDF by clicking the mouse.
A boolean variable that when set to true causes
a PDF to be made.
OPENGL or P3D mode requires the use
of beginRaw( ) and endRaw( ) instead of
beginRecord( ) and endRecord( ).