Help with slider. Handle animates back to centre OnDragDrop


Still new to Axure but slowly getting my head around it. I would appreciate any help with the following.

I am trying to make a slider that has the handle in the centre like this ------0------

When you move the handle left or right it moves back to the centre point when you release it.

Any help with the above would be amazing.

The more advanced help I am after is how do I get it to power two values Left=A Right=B

i.e. When you drag left it increases the value of A and when the handle bounces back it keeps the maximum value
The same for B but only when you drag in the opposite direction.

Suppose you could think of it like a remote control for a radio car (left / right control)

The animate back to center part is the easiest part.

Find the X, Y position of where you want the handle to rest in the center. Then on the OnDragDrop case for the handle add a move action:

Move this to X, Y

Where X and Y is the center position. You can add an animation too.

As for the other part you can use the handy TotalDragX variable. That variable is the total distance the widget has been dragged from its starting position. Negative to the left, positive to the right.

If true
  Move this with Drag X Only
If value [[TotalDragX]] is less than 0
  Set variable A to [[TotalDragX]]
If value [[TotalDragX]] is greater than 0
  Set variable B to [[TotalDragX]]

If you don’t want A to be a negative number just multiply TotalDragX by -1.

There’s other behavior you could do but you haven’t specified:

  • When you drag to the right should A be reset to some default value?
  • When you drag to the left should B be reset to some default value?
  • Do you want to scale the values by some amount?
  • What happens if I drag but than manually drag the handle back to the center and then release?

Cheers for the info. Managed to do it in a convoluted way but will look at TotalDragX variable

Really useful. Thanks for your help, much appreciated