Axure Tutorial: Displaying Omitted Text in Repeater with Bubble Widget

In the system table, we often encounter that the content in some grids is very long. If all the contents are displayed, we will not be able to see the contents of other columns on one page. In this case, we often only display the front part of the long content. If the mouse moves in, we will display all the contents.

The advantage of this is that one can read the complete content in the table at a glance, and the other is that if you want to view the detailed long content, you can also view it by moving the mouse in.

1. Import text in the repeater table, and automatically display the text content on the corresponding widget.
2. If the text is longer, only the content of the front part is displayed, and the latter part is automatically replaced with an ellipsis.
3. When the mouse moves into the long content, corresponding complete text content is displayed. .

The production of the header is relatively simple, we can make it with a rectangle, and the style of the rectangle can be adjusted according to the needs and preferences. We use as many rectangles as there are columns, as shown in the image below.

2. Making of table contents

To make table content, we mainly use repeaters and rectangles. We put the corresponding rectangle in the repeater, where the rectangle and the width of each rectangle in the header above should be in one-to-one correspondence.

3. Making of bubble

Finally, intercept the contents of the repeater table cell text to no more than 50 characters. We need to add substr function to the cell text.