After importing one icon i want to give functionality

please format your code posting by pasting it into the

</> code button

of the editor header menu ( context name: Preformatted text )
it looks like
```
type or paste code here
```

also can use the ``` manually above and below your code.

thank you.


to make functioning buttons need
rectangle or image
( here combined and you can disable what you not need )

// using a function for the button and one for mouse over: 
// please see how little change needed to make (2) more buttons

// made some nice buttons for you, using
// https://dabuttonfactory.com/

PImage b_delete,b_letter,b_memo;

void get_images() {
  b_delete = loadImage("data/button_delete.png");  
  b_letter = loadImage("data/button_letter.png");  
  b_memo   = loadImage("data/button_memo.png");  
}

int x1 = 100, y1 = 100, w1 =108, h1 =42;
boolean sel1 = false;
String text1 = "letter";

int x2 = x1, y2 = y1+h1+10, w2 =w1, h2 =h1; //_________________ (2)
boolean sel2 = false; //_______________________________________ (2)
String text2 = "memo"; //______________________________________ (2)

int x3 = x1, y3 = y2+h1+10, w3 =w1, h3 =h1; //_________________ (3)
boolean sel3 = false; //_______________________________________ (3)
String text3 = "delete"; //____________________________________ (3)

void setup() {
  size(300, 300);
  strokeWeight(3);
  textSize(20);
  get_images();
}

void draw() {
  background(200, 200, 0);
  myButton(x1, y1, w1, h1, sel1, text1,b_letter);
  myButton(x2, y2, w2, h2, sel2, text2,b_memo); //____________________ (2)
  myButton(x3, y3, w3, h3, sel3, text3,b_delete); //____________________ (3)
}

void keyPressed() {
}

void mousePressed() {
  if ( over(x1, y1, w1, h1) ) {
    sel1 = ! sel1;            // button 1 action
    if ( sel1 ) { 
      println(" pressed event 1"); // here add your code
      // sel1=false; // reset for push button thinking
    }
  }
  if ( over(x2, y2, w2, h2) ) {
    sel2 = ! sel2;            // button 2 action //_ (2)
    if ( sel2 ) { 
      println(" pressed event 2"); // here add your code
      // sel2=false; // reset for push button thinking
    }
  }  
  if ( over(x3, y3, w3, h3) ) {
    sel3 = ! sel3;            // button 3 action //_ (3)
    if ( sel3 ) { 
      println(" pressed event 3"); // here add your code
      // sel3=false; // reset for push button thinking
    }
  }
}

void myButton(int x, int y, int w, int h, boolean sel, String atext, PImage btn) {
  if ( sel )               fill(0, 200, 0);
  else                     fill(0, 0, 200);
  strokeWeight(3);
  if ( over(x, y, w, h) )  stroke(200, 0, 200);
  else                     stroke(0, 200, 200);
  rect(x, y, w, h);
  noStroke();
  fill(200);
  text(atext, x+10, y+h-10);
  // image button version  
  image(btn,x+1, y+1);
}

boolean over(int x, int y, int w, int h) {
  return ( mouseX > x & mouseX < x + w &  mouseY > y & mouseY < y + h ) ;
}

now that would not work without images,
unless you disable all code line ( // ) using them.

try to catch here, save under /data/,
OR make your own.

button_delete
button_letter
button_memo


__
ok, that code uses some concepts you might need more help to understand,
please ask here anytime

1 Like