Resizing Dynamic Panel with One Click Dot

#1

Hello dear community,

I have another question for the professionals here. I have placed an image in a Dynamic Panel and would like to adjust the size of the Dynamic Panel and thus the visibility of my image by dragging a dot. That works for now.
Now I want to move the dot via One-Click and the Dynamic Panel should also adjust its size. Somehow it doesn’t work, don’t know what I’m doing wrong. Maybe someone can help?

Thanks a lot!!

drag_test.rp (52.6 KB)

#2

The Moved action of Dot has a Set Size action uses this expression:
[[LVAR1.height + DragY]]

  • Where LVAR1 points to the “Stretch_block” widget
    • You can also use Target.height to refer to the target of the action without the LVAR1 local variable. This makes it easier to code and more extensible.
  • The DragY variable would equal 0 (zero) when the Dot widget is moved without a drag
  • So, moving Dot with a click on the background rectangle widget results in no change:
    (Current height + 0)

If you change the math in your expression, then any time (and by any means) the dot is moved, the height of “Stretch_block” gets set based on the location of “Dot”:
[[This.top - Target.top - 20]]

  • “This” refers to the widget calling the action, so the “Dot” widget
  • “Target” refers to the recipient of the action, so the “Stretch_block” widget
  • “20” is the number of pixels between these two widgets (as you set in your .rp file), in other words, the margin space between them

Also, if you only want to change the height of a widget, you can leave the width field blank. This is easier and more flexible/extensible–for example, if you later change the width of “Stretch_block” or set it to fit to contents, etc. you won’t have to go back and update the width value (from 339 to whatever.)

#3

Thanks you very much mbc66!!
I have done this and worked all perfect! Thanks :grinning::star_struck:.

Now I have rotated the Dynamic Panel on page load, as I only want to have the line in there.
And added values as well.
The dynamic panel moves now on the screen when I am resizing it with the dot. I guess it is because the width of the dynamic panel changes. But I don’t know how to fix this. Do you have any idea?

Thank you very much in advance!
drag_test2.rp (55.1 KB)

#4

Scaling and moving rotated widgets is another level of tricky in Axure. Basically, the coordinates–the top and the left positions are offset when a widget is rotated. So, you’ll need to account for this with some math–algebra and trigonometry. This thread shows a very nice solution you can leverage.

#5

Hey mbc66,

very interesting and helpful!! Thank you very much! :star_struck::+1: I didn’t get it quite to work as I liked to, but found a good workaround for now. I think it is quite confusing to calculate Pythagorean theorem in Axure :sweat_smile:

Thanks mbc!