You can think of ofSetBackground() as an opportunity to make the simplest drawings, as if the screen consists of one big pixel. Consider an example where the background color slowly changes from black to white and back using a sine wave.

The project is based on the openFrameworks emptyExample example. Copy the folder with the example and rename it. Then fill the body of the testApp::draw() function with the following code:

float time = ofGetElapsedTimef();  //Get time in seconds

//Get periodic value in [-1,1], with wavelength equal to 1 second
float value = sin( time * M_TWO_PI );

//Map value from [-1,1] to [0,255]
float v = ofMap( value, -1, 1, 0, 255 );

ofBackground( v, v, v );          //Set background color

This code gets the time lapsed from the start of the project using the ofGetElapsedTimef() function, and uses this value for computing value = sin( time * M_TWO_PI ). Here, M_TWO_PI is an openFrameworks constant equal to 2π; that is, approximately 6.283185. So, time * M_TWO_PI increases by 2π per second. The value 2π is equal to the period of the sine wave function, sin(). So, the argument of sin(...) will go through its wavelength in one second, hence value = sin(...) will run from -1 to 1 and back. Finally, we map the value to v, which changes in range from 0 to 255 using the ofMap() function, and set the background to a color with red, green, and blue components equal to v.

Run the project; you will see how the screen color pulsates by smoothly changing its color from black to white and back.

We will return to background in the Drawing with an uncleared background section. Now we will consider how to draw geometric primitives.