How would you realize "show more" / "show less" button to hiding/revealing some content that doesn't fit in a set area?


#1

How would you realize “show more” / “show less” to hiding/revealing some content that doesn’t fit in a set area?

Example

#Newbie question


#2

Here’s one way… The content is wrapped in a dynamic panel (select it, right-click, then choose Create Dynamic Panel), named “Viewport Mask” The size of this dynamic panel (DP) is decreased to show only your “set area” (and a widget, “gradient” added to mimic your sketch (it can either be in the DP in front of the content, or outside and in front of the DP.) The button is a DP as well, with two states: “Show More” and “Show Less”. Clicking this button changes its state to “Next, wrap” (which creates a kind of toggle) and it’s State Changed event changes the size of the “Viewport Mask” DP. So, when you click “SHOW MORE” the DP height is set to the height of the content, and when you click “SHOW LESS” the DP is set to its original height.

Show more - less.rp (79.8 KB)


#3

Thank you! That’s great!
I found this small example of enlightening!