Set rich text action using predefined style of widget manager

#1

Hi,

how can I set the rich text content using a predefined style of the widget manager?

Following situation:
Predefined style is set in widget manager called “PredStyle”.
I created a widget. I want to set rich text action at an OnClick Event and change the style of the widget to this PredStyle. Axure only offers me individual settings but no reference to the predefined widget.
If I have multiple widgets, which should all look the same, I think it is hard to maintain all widgets to look the same when only applying individual styles.

Thanks for your answers!

#2

I’ve seen this basic request for a more functional style manager in these forums before. Being able to dynamically change a widget’s style from among a list of pre-defined styles would be great. Pretty sure Axure team is aware of it, but basically no chance of update in now older RP 9 version. I’m not sure if RP10 implemented this though.

Workarounds I and many others use include:

  • Utilize a widget’s Normal/Default vs Selected interaction styles. So you pre-define a Selected style to meet your needs, then switch to it in your Click or Tap event by setting the selection state of a widget to “true” (instead of setting rich text properties individually.)

    • You can do this from the bottom of the INTERACTIONS pane (with widget(s) selected on canvas) in the Style Effects section. Since you have a predefined style already you can select it from the “Widget Style” checkbox option.
    • If needed, you can utilize an additional style by disabling the widget (which won’t be clickable/interactable; also need to be careful to enable before getting or setting anything.)

  • Create a dynamic panel from your widget, duplicate State1 and restyle it as needed (e.g., choose “PredStyle” from your style manager.) Then to show that style just change the state of the dynamic panel.

    • This method supports many different styles. I’ve used several dozen before. You can rename the states to make things easier to use.
    • With some careful and clever design you can separate your multiple styled widget(s) from functional or dynamic aspects. For instance, if you have four styles for one button you don’t need (or want) to duplicate the button’s interaction code four times. Just cut it from the button and paste to the dynamic panel. Or, place a hotspot widget in front of it and assign to the hotspot. (Just realize that any interactions on widgets within a dynamic panel will override the same event assigned to the dynamic panel itself. So if you have a Click or Tap event on the dynamic panel, you typically don’t want Click or Tap code on a widget within that dynamic panel (unless you are very deliberate about it.) Or, if you dynamically change text content, say a button’s label, and want it to match/synchronize regardless of style, then you could pull the text layer out and place in front of dynamic panel. Another approach I’ve used is to use a Text Field widget for the default (State1) text (usually styled to look different than regular Text Field) and then use its Text Changed event to set text of corresponding widgets in the other dynamic panel states; in this way you only have one widget to change and it then automatically takes care of all its duplicates.

  • Utilize Masters in combination with these methods to help keep things consistent across pages and prototypes.

Change setting of widget stlye manager on click
closed #3

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.