Trying to open Images with jSon Object shows unreliable behavior

Processing
11

I had a look at your data. You have about 53 events in 7 secs. This means you have a rate of 7Hz aka 7 events per second on your serial stream.

Processing runs at 60fps, or 60 frames per second. Your draw looks like this:

void draw(){
  background(wallpaper);  //Draws on your canvas 60fps [REF1]

  while (myPort.available() > 0) {  //It gets executed about 7 times per second  [REF2]

      ...process json

       if(XF.equals("1")==true){     // This is a problem. See comment below  [REF3]
       }
  }
  
}

I am going to assume the main problem is in the actual design of your code. I hope it is clear from the comments above. I have to talk about REF3. If you only press the button once, it will be capture by the line in REF3 only once. At the end of draw, it is displayed. However, when I new cycle of draw enters, REF1 will clean your canvas and start with a new fresh background. Then you need to redraw everything there again. You won’t be able to draw the image associated to XF because of two reasons:

  1. You need to enter the while loop so for the image to be drawn. This only happens when you get a valid serial event, at a rate of 7Hz.
  2. Even when you enter the while loop, if you don’t press the button, XF value would be 0, so you will see the imgRed. Based on your code, your imgRed should be flashing as it is drawn only 7 times per second compared to the background’s update rate which is happening at 60fps. In other words, you should see this imgRed 1 every 9 frames (I am not referring to imgGreen as this will be seeing only once when triggered, 1 frame out of 60 frames in a second)

I can suggest modifying your design. Start a small sketch and create a small proof of concept. This is my suggestion:


boolean XFflag=false;  

void draw(){
  background(wallpaper);  //Draws on your canvas 60fps [REF1]

  while (myPort.available() > 0) {  //It gets executed about 7 times per second  [REF2]

      ...process json

         
       XFflag =  btnXForward.equals("1");  //Updates XF field
       
  }

  image(XFflag ? imgGreen : imgRed,1030,665);
  
}

With this suggestion, if you press the button once, the imgGreen should stay up for about 9 frames, enough for you to see it. If the while loop is not triggered (because of no events on the serial queu), you will still see either a imgRed or an imgGreen.

With this layout, you can still modify it further so you could force, for instance, the green image to stay up for a fixed amount of time. However, I did not implement that because:

  1. You need to check this approach and understand if this will work for you
  2. If you are working on a responsive design, then maybe you want to manage all your events real time.

I have a question. The timed data you provided above is great. What would happen if you keep the button pressed for about a second. Would you register continuous '1’s or would you device only emit a single shot per event?

Kf