button doesn't work when using PShape?

fadingbeat

I have two svg shapes loaded in my sketch, making a small animation. FramteRate is set to 1, because i didn't figure out better way to have them interchange at that level of speed. But it works. What doesn't work are buttons. I have the usual class for button made. When i finally call the function for drawing button, that is, when i press button, the program does not freeze, but it looks like buttons are frozen. And nothing ever happens.

I presume this has something to do with working with svg shapes?

Also, what's the deal with renderers? If i'm working in 2D, what's the difference if i'm using P2D or not?

Thanks for your answers guys. Here is the code:

    Button zatvori;
    Button pokreni;

    int numShapes = 2; //koliko oblika ćemo koristiti
    int currentShape = 1; //postavljanje trenutnog oblika
    PShape [] shapes = new PShape[numShapes]; //svi oblici spremaju se u polje

    int now; //varijabla u koju ćemo spremati vrijednost millis();

    void setup() {
      //noLoop();
      surface.setTitle("Dlanovanje"); //Naziv prozora
      size(800,640); //veličina prozora
      smooth();
      now = millis();
      shapes[0] = loadShape("spiral.svg"); //učitavanje oblika formata svg
      shapes[1] = loadShape("stars.svg");
      zatvori = new Button ("Izlaz", 720,550,40,30);
      pokreni = new Button ("Pokreni", 720, 518,55,30);
    }

    void draw() {
      frameRate(1);
      //translate(x,y);
      background(190);
      int time = 5000;

        pokreni.Draw();
      if (pokreni.clicked) {
        loop();
        redraw();
      }
      zatvori.Draw();
      if (zatvori.clicked) {
        exit();
      }

      currentShape = (currentShape+1) % numShapes;
      int pomak = 0;

        shape(shapes[(currentShape+pomak) % numShapes], 60,80);

      if (millis() - now > (time)) {
        noLoop();
       now = millis();
      }
    }

//class button

    class Button {
      String label; // button label
      float x;      
      float y;     
      float w;      
      float h;      
      boolean over = false;
      boolean down = false;
      boolean clicked = false;


      // konstruktor
      Button(String labelB, float xpos, float ypos, float widthB, float heightB) {
        label = labelB;
        x = xpos;
        y = ypos;
        w = widthB;
        h = heightB;

      }


      void () {

        if(down&&over&&!mousePressed) {
          clicked=true;
        }
        else {
          clicked=false;
        }

        smooth();
        if(!over) {
          fill(255); }
          else {
            if(!down) {
              fill(200);
            }
            }
        stroke(141);
        rect(x, y, w, h, 10);
        if (down) {
          fill(100);}
          else {
       // 
        fill(0);}

        stroke(0);
        strokeWeight(2);
        textAlign(CENTER, CENTER);
        textSize(14);
        text(label, x + (w / 2), y + (h / 2)); 


       if (mouseX > x && mouseX < (x + w) && mouseY > y && mouseY < (y + h)) {
         over = true;
         if(mousePressed) { 
           down=true;} 
           else {
             down=false;} 
       } else {
       over = false;
      }
    }
    }

koogs

Button class line 23. Is that a typo?

fadingbeat

sorry, should be void Draw(). It's correct in my sketch.

kfrajer

I think this is what you are trying to do. I hope this helps.

Kf

Button zatvori;
Button pokreni;

int numShapes = 2; //koliko oblika ćemo koristiti
int currentShape = 1; //postavljanje trenutnog oblika
PShape [] shapes = new PShape[numShapes]; //svi oblici spremaju se u polje

int now; //varijabla u koju ćemo spremati vrijednost millis();

boolean updateSVGs=false;

void setup() {
  //noLoop();
  surface.setTitle("Dlanovanje"); //Naziv prozora
  size(1000, 1040); //veličina prozora
  smooth();
  now = millis();
  //shapes[0] = loadShape("11.svg"); //učitavanje oblika formata svg
  //shapes[1] = loadShape("22.svg");

  shapes[0] = createShape(RECT, 0, 0, 50, 50);
  shapes[0].setFill(color(0, 0, 255));
  shapes[0].setStroke(false);

  shapes[1] = createShape();
  shapes[1].beginShape(TRIANGLE_STRIP);
  shapes[1].vertex(30, 75);
  shapes[1].vertex(40, 20);
  shapes[1].vertex(50, 75);
  shapes[1].vertex(60, 20);
  shapes[1].vertex(70, 75);
  shapes[1].vertex(80, 20);
  shapes[1].vertex(90, 75);
  shapes[1].endShape();
  shapes[1].setFill(color(250, 25, 25));
  shapes[1].setStroke(false);



  zatvori = new Button ("Izlaz", 720, 550, 40, 30);
  pokreni = new Button ("Pokreni", 720, 518, 55, 30);
}

void draw() {
  frameRate(15);
  //translate(x,y);
  background(190);
  int time = 5000;

  pokreni.Draw();
  if (pokreni.clicked) {
    now = millis();
    updateSVGs=true;
  }
  zatvori.Draw();
  if (zatvori.clicked) {
    exit();
  }

  if (updateSVGs==true) {
    currentShape = (currentShape+1) % numShapes;
    int pomak = 0;
    shape(shapes[currentShape], 60, 80);
  }

  if (millis() - now > (time)) {
    updateSVGs=false;
  }
}

fadingbeat

It works. But i need slower interchange of shapes, exactly the one you get when frameRate is set to 1, which is why button appears to work too slow or not at all.

I did this:

      if (pokreni.clicked) {
        now=millis();
        updateSVGs=true;
        **frameRate(1);**
      }

     if (millis() - now > (time)) {
       updateSVGs=false;
       **frameRate(15);**
      }

and in the setup() also added the value 15.

It will serve for now, even though i don't find it as a proper solution. Which leads me to a better solution, knowfully.

Thank you kfrajer, processing forum along with all of their website will be in the literature of my thesis. (and my life :D )

kfrajer

@fadingbeat One correction regarding my code. FrameRate(15) should be in setup and not in the draw() function. If you want to slow down the swapping of images, you can do the following:

int myFrameRate=15;
void setup (){

  // // // Other relevant code.. omitted for simplicity

  frameRate(myFrameRate);
}

void draw(){

  // // // Other relevant code.. omitted for simplicity

  if ( (updateSVGs==true) && (frameCount%myFrameRate==0)) {
    //***This will execute every second - using the modulus (%) operator
    currentShape = (currentShape+1) % numShapes;
    shape(shapes[currentShape], 60, 80);
  }
  // // // Other relevant code.. omitted for simplicity
}

I hope this helps.

Kf