Drawing Tool
Drawing Application, 2019
Made with p5.
Landscape drawing made using every brush available with this tool.
Code for my drawing tool:
var img; var initials ='ss'; // your initials var choice = '1'; // starting choice, so it is not empty var screenbg = 250; // off white background var lastscreenshot=61; // last screenshot never taken var x=3; function preload() { // preload() runs once, it may make you wait // img = loadImage('knife.jpg'); // knife.jpg needs to be next to this .js file // you can link to an image on your github account img = loadImage('https://dma-git.github.io/images/cat2-sm.jpg');g } function setup() { createCanvas(700, 700); // canvas size background(screenbg); // use our background screen color } function draw() { if (keyIsPressed) { choice = key; // set choice to the key that was pressed clear_print(); // check to see if it is clear screen or save image } if (mouseIsPressed){ newkeyChoice(choice); // if the mouse is pressed call newkeyChoice } } function newkeyChoice(toolChoice) { //toolchoice is the key that was pressed // the key mapping if statements that you can change to do anything you want. // just make sure each key option has the a stroke or fill and then what type of // graphic function if (toolChoice == '1' ) { // first tool stroke(1); strokeWeight(3); line(mouseX, mouseY, pmouseX, pmouseY); } else if (toolChoice == 'e' || toolChoice == 'E') { // second tool stroke(250); strokeWeight(10); line(mouseX, mouseY, pmouseX, pmouseY); } else if (toolChoice == '2') { // second tool stroke(random(255),random(255),random(255)); strokeWeight(10); line(mouseX, mouseY, pmouseX, pmouseY); } else if (toolChoice == '3') { // third tool stroke(300, 100, 0, 80); strokeWeight(10); line(mouseX, mouseY, pmouseX, pmouseY); } else if (toolChoice == '4') { stroke(0, 0, 255); line(mouseX, mouseY, pmouseX, pmouseY); } else if (key == '5') { // this tool calls a function stroke(random(255),random(255),random(255),random(255)); ellipse(mouseX, mouseY, pmouseX, pmouseY); } else if (toolChoice == '6') { stroke(200); line(mouseX, mouseY, pmouseX, pmouseY); } else if (toolChoice == '7') { fill(random(255),random(255),random(255)); stroke(random(255), random(255), random(255)); triangle(mouseX, mouseY, 350, 350, 20, 20); } else if (toolChoice == '8') { fill(200, 200, 50, 100); ellipse(mouseX, mouseY, 20, 20); } else if (toolChoice == '9') { fill(300, 100, 0, 80); rect(mouseX, mouseY, 40, 40); } else if (toolChoice == '0') { stroke(0, 0); fill(random(255), random(255), random(255), random(255)); ellipse(mouseX, mouseY, 1000, 100); } else if (toolChoice == 'g' || toolChoice == 'G') { // g places the image we pre-loaded image(img, mouseX, mouseY); } } function testbox() { // this is a test function that will show you how you can put your own functions into the sketch x = mouseX; y = mouseY; fill(200, 20, 20); rect(30+x, 120+y, 100, 100); fill(20, 20, 200); rect(x-34, y-56, 100, 100); fill(20, 20, 20); rect(x,y,x+34, y+20); } function self_portrait(){ // this function draws a self portrait when called // you will need to call this, perhaps as one of your keypress functions } function clear_print() { // this will do one of two things, x clears the screen by resetting the background // p calls the routine saveme, which saves a copy of the screen if (key == 'x' || key == 'X') { background(screenbg); // set the screen back to the background color } else if (key == 's' || key == 'S') { saveme(); // call saveme which saves an image of the screen } } 2 function saveme(){ //this will save the name as the intials, date, time and a millis counting number. // it will always be larger in value then the last one. filename=initials+day() + hour() + minute() +second(); if (second()!=lastscreenshot) { // don't take a screenshot if you just took one saveCanvas(filename, 'jpg'); } lastscreenshot=second(); // set this to the current second so no more than one per second }
KEY
1- Black pen | 2- Rainbow Brush | 3-Orange | 4- Blue Brush | 5- Ellipses | 6- Gray Pen | 7- Rainbow Triangles | 8- Circles | 9- Squares | 0- Rainbow Ellipse | e/E- Eraser | g/G- Cat image | x/X- Clear | s/S- Save