Interactive Drawing

In order to build an interactive drawing board, I made a program that can draw lines in different colors, which can be    changed as we interact using mouse and keyboard.

I hope to design an interactive link: draw lines when the mouse is clicked, and the brush will randomly select colors each time, and you can adjust the thickness of the brush by pressing the M and N keys on the keyboard.

The logic of the drawing board is to build a canvas first and then we can draw lines on it when we press the mouse. First of all, I built some variable to build the foundation for the line, which is related to the current location of the mouse, and other elements that are going to change when running the program such as color and the width of brush.

After failed for a few times, here I found some very useful tip to code successfully. For example, we need to build up variables at the very beginning of the program, though it is unnecessary to give them values. What’s more, Setting a “mouseIsPressed” judgment option with if can better enable users to interact with programs through the mouse, that is, relevant programs will be carried out only when the conditions for pressing the mouse are met. Moreover, “key” is different from “keyCode”, the later one refers to those  symbol buttons.

For brush width I use if and else to make the user interact with the keyboard. I design a variable of brush width. The user can change the current value of the variable by clicking different keys on the keyboard. The program will assign the current value to the original data to complete a cycle.