Sliders backward engineering how to update and instantly display results

Nov 17, 2022

Hi Community, I have been asked to create slider content similar to the image attached. The sliders at the top can be dragged and display the number as the slider goes along. The slider at the bottom instantly updates and adds and subtracts all the sliders. 

  1. To simulate this I have used a text box that changes states as the slider is dragged for the top sliders. But I am unable to put the text box over the slider tab as it stops the tab from being dragged. Any ideas please
  2. I have used add variable for the slider at the bottom to update the total but that continue to add and does not subtract. Any ideas please 
2 Replies
Michael Hinze

1. For each of the top "sliders", I would create a display-only object with states. Each state includes the line, blue rectangle, and text box with reference to a variable and text box (for "Low Fund", etc.). The line color and text box change. For example, for states 1-4, it's red; for 5-9 it's yellow, etc. Adjust the position of the blue rectangle and variable reference. Then create an actual slider, with no track, and a transparent bitmap as the thumb fill. Place that slider over the display-only object and adjust the slider parameters and dimensions, so they match the object underneath. Finally, create triggers that change that of object-XYZ to state <> when slider moves and slider_variable=<>.

2. Make sure you reset the total variable, before recalculating.

See attached a rough example with two sliders.