Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

270
Visualizações
How to paint in p5.js with switching the paint brushes?

I want to paint with two brushes, one is circle and one is rectangle. I have some preset colours for painting and now I want to create different type of brushes. Is that I need to setup more variables? How can I display the brushes type and use it for painting?

var brushColor;


function setup() {
 createCanvas(600, 600);
 strokeWeight(4);
 background(255)
 brushColor = color(50);


}

function draw() {
 if (mouseIsPressed) {
   if (mouseX <= 50) {
     if (mouseY <= 50) {
       brushColor = color(0, 0, 255);
     } else if (mouseY <= 100) {
       brushColor = color(66, 244, 194);
     } else if (mouseY <= 150) {
       brushColor = color(255, 0, 199);
     } else if (mouseY <= 200) {
       brushColor = color(249, 99, 0);
     }
   }
   stroke(brushColor)
   line(mouseX, mouseY, pmouseX, pmouseY);
 }

 //noStroke();
 //start coding for your color squares here!
 stroke(color(0));
 fill(0, 0, 255);
 rect(0, 0, 50, 50);
 fill(66, 244, 194);
 rect(0, 50, 50, 50);
 fill(255, 0, 199);
 rect(0, 100, 50, 50);
 fill(249, 99, 0);
 rect(0, 150, 50, 50)
 print(brushColor);

}`

about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

I added a slider for stroke weight and changed the strokeCap is this what you meant? documentation for strokeCap is here

var brushColor;
let slider;
let strokeType //= ROUND;

function setup() {
 createCanvas(600, 600);
 strokeWeight(4);
 background(255)
 brushColor = color(50);
  slider = createSlider(0, 10, 1);
  slider.position(50, 10);
  slider.style('width', '80px');
  strokeType = ROUND;

}

function draw() {
 if (mouseIsPressed) {
   if (mouseX <= 50) {
     if (mouseY <= 50) {
       brushColor = color(0, 0, 255);
     } else if (mouseY <= 100) {
       brushColor = color(66, 244, 194);
     } else if (mouseY <= 150) {
       brushColor = color(255, 0, 199);
     } else if (mouseY <= 200) {
       brushColor = color(249, 99, 0);
     } else if (mouseY <= 250) {
       strokeType = PROJECT;
     } else if (mouseY <= 300) {
       strokeType = ROUND;
    }
   }
   strokeCap(strokeType)
   push();
   strokeWeight(slider.value())
   stroke(brushColor)
   line(mouseX, mouseY, pmouseX, pmouseY);
   pop();
 }

 //noStroke();
 //start coding for your color squares here!
 stroke(color(0));
 fill(0, 0, 255);
 rect(0, 0, 50, 50);
 fill(66, 244, 194);
 rect(0, 50, 50, 50);
 fill(255, 0, 199);
 rect(0, 100, 50, 50);
 fill(249, 99, 0);
 rect(0, 150, 50, 50)

 fill(255);
 rect(0,200,50,50)
  fill(brushColor);
 rect(12.5,212.5,25,25)
fill(255);
 rect(0,250,50,50)
  fill(brushColor);
 ellipse(25,275,25,25)
 print(brushColor);

}
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda