Simultaneously, the mousePressed() function randomly chooses the color of the ellipses and the background, but those colors will not change until the mouse is released and pressed again. Once a mouse press is detected, the mouseIsPressed variable returns true and begins drawing ellipses at random positions around the canvas for as long as the mouse is pressed. The code shows the differences in using the mousePressed() function and the mouseIsPressed variable. Take a look at mouseEvents.js on the right. We can create an if statement using the mouseIsPressed variable to continuously run a code block while the mouse is pressed. When the mouse is pressed, the mouseIsPressed variable evaluates to true, and when it is not pressed, it evaluates to false. We can also use the built-in mouseIsPressed variable to determine whether the mouse is pressed or not. To run the code again, the mouse needs to be released and pressed a second time. This means that the code block within the mousePressed() function will only run once the mouse has been pressed. The mousePressed() function is called once after every mouse button press over the canvas. The mouse event functions in p5.js work like JavaScript DOM events behind the scenes, in which p5.js waits for an event to happen to run specific mouse event functions. Some examples of mouse events include pressing the mouse, pressing and releasing the mouse, and detecting mouse movements. P5.js also provides us with functions that trigger when specific mouse events are detected.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |