Refresh values in P5.gui

p5.js Libraries
1

I’m using p5.gui to play with some variables and setting for my sketch. I want to change those variables both in the gui and in code. If I change the variables in code the p5.gui interface doesn’t update automatically to show the new value, so it ends up out of sync with the actual sketch.

Is there a way to force a refresh of the values shown in the gui so they are up to date?

2

Never tested but given p5.gui is a wrapper for the dat.GUI lib you can look up its API from this link:

Methods listen() & updateDisplay() from class Controller seem more likely to do what you seek.

3

A noob in processing myself but for stuff like that in general in coding you have to update the variable AND the ui control where ever you update your variable(or whatever you are changing). I think this is uicontrolx.setValue(…) or something.
If you want it automatically you can always write a function that is being called in your draw loop if a certain event is true or whatever.

4

Thanks, @GoToLoop. You pointed me in the right direction. p5.gui is also based on quicksettings, which is its prototype. Looking in quicksetting.js, I found setValue, mentioned by @myCatIsAwesome. This seemed to work:

    gui.prototype.setValue(title, value);
1 Like
5

@rbanks

Did you succeed with ‘dat.gui’ with P5?