Rectangle BG dynamic height


I have a repeater widget which has hidden content. When the ‘invoice number’ is clicked the panel show more information.

I have some rectangles behind the repeater that act as backgrounds and would like for their heights to increase/decrease when the panel is opened/closed.

I’ve attached an example to this post. Any enlightenment would be most aprreciated.

Many thanks.Rectangle-Dynamic-Height.rp (261.4 KB)

Check out Page 2 in this updated file.

Rectangle-Dynamic-Height.rp (448.6 KB)

I could find three “xxx BG” widgets that I assume you want to scale in height with changes to the repeater height. I duplicated your page to Page 2 and only made changes to that. In the repeater cell, you have a hidden group, named “Invoice”. I created a Shown event that sets the size of each background widget to the value, [[Target.height + This.height]] and a Hidden event that reverses this, setting the widget heights to [[Target.height - This.height]] In this way, the background widgets can grow or shrink by the size of the Invoice group whenever it appears or disappears.

In Axure, variables and mathematical expressions are wrapped in double-square brackets ( [[ … ]] ). The built-in variable, “Target” refers to the widget receiving the action–in this case the background rectangle being resized. The built-in variable, “This” refers to the widget issuing the action–in this case, the “Invoice” group". By using these relative references, you don’t have to worry about the actual sizes in pixels, and if you click “Invoice” in more than one repeater row, it still resizes correctly. If should also work if later on you have to change the height of the Invoice group, or the default sizes of the background widgets for that matter.

Thank you so much for helping me solve this problem and taking the time to detail the logic.

Much appreciated.