Variable Height RG rows which are dynamically sized via 'amount of text' for a given cell

Hello all, I am creating an app which has multiple choice questions and I am having trouble with the multiple choice part. I have searched through the forum and am unable to find what I’m looking for.

Here are the characteristics that I want but I do not seem to have them in the built-in radio buttons or repeating groups.

Needs to:

  1. Be populated from the database.

  2. Dynamically change the height of each row based on the ‘largest’ (aka has the most text). Must be responsive and by this I mean - The entire multiple choice ‘widget’ will live in a group which is responsive so that as the width of the group goes down then the dynamic height will adjust upward as the text wraps into additional lines within the cell.

  3. Be able to have a custom radio button style/size/color

The images below shows an example of what I have in mind and to show how it would react when the width of the browser is smaller (first image) and larger (second image). Also, notice that the radio button for a given row is aligned to the top of that row.


Thanks for any insights you can offer.

This should be pretty straightforward to achieve.

Make sure you don’t have a fixed number of rows set on your RG, then house your text & radio button in another group with no fixed height (text should also have no fixed height).

To keep the contents top aligned, set the container group to “row”, then subsequently set the children to be top aligned.

Thank you ed19, that was very helpful.

One last thing, how do I get the custom stylable radio buttons? Have you done any custom radio buttons or do you know how to custom style the built-in radios?

No problem!

I don’t like the standard ones provided, so I tend to use an align to parent group with a shape inside it.

Set up some page states to hold whatever data would trigger the radio, set conditionals on the shape to appear/change colour when “current cell’s thing” is present in the state, then set up some workflows to set the state(s) when the parent group is clicked.

Thanks ed! Both items resolved :slight_smile:

1 Like

This topic was automatically closed after 70 days. New replies are no longer allowed.