Set ellipse size to value of variable


#1

The title says all I want, but I have no idea how and even if that’s possible in Axure RP8.
I want to create a test results page which looks similar as the Apple Music setup:

How bigger the ellipse is displayed, the more you love the shown categories.
I think it needs to be something like x = 150px + [VarA]


#2

Set size of widget to height: [[150 + myVariable]], width: [[150 + myVariable]]


#3

Would be a great solution, but I can not find a place where I can set a not-pixel-only size for the ellipses, neither for a widget. I am looking at the Style-panel, but maybe I need to look somewhere else… Any idea?


#4

You need to be setting it form the Properties tab. Hit the action you wish to use (eg OnClick), then the Size action in the Actions Panel. Select the ellipse you want to size, then hit the little “fx” button next to the heights fields.


#5

You would set that with a Set Size action. But first you need to determine what event should trigger it. It could be a an event that results from a user action (OnClick) or a passive event (OnPageLoad).

Let’s assume you want the size to be set at soon as the page loads. You could use the widget’s OnLoad event. Add a case to the event. Double click the case to open the case editor and add a Set Size action. Choose the widget you want to adjust (since you’re using the widget’s own OnLoad case you can just choose “This Widget” from the widget selection). You should see the height and width fields below the target widget selection for the Set Size action. Enter the expressions I posted above. Make sure the variable you use either has a default value or a value set by some other action before the page loads.