Repeater variable number of columns

Write about your phone number list
Post Reply
nabilislam
Posts: 1
Joined: Thu Jun 09, 2022 4:32 am
Location: Bangladesh
Contact:

Repeater variable number of columns

Post by nabilislam »

Click here to send you: a set of universal rules will take you to play data analysis and help you become a competitive product manager! Places are limited, first come, first served >>> Free your eyes, put on your headphones, and listen~! 00:00 00:00 Editor's introduction: Although repeaters are very common in the use of Axure, many people are confused that the number of columns cannot be changed dynamically. Phone Number List The author of this article analyzes how to use repeaters to dynamically change the number of columns, let's learn together. Repeaters have become very common in Axure usage, but many people are confused by not being able to dynamically change the number of columns. Phone Number List For example: From 4 rows and 3 columns: Dynamically changing to 3 rows and 4 columns: As of the current version, the official has not released the relevant settings, but we can achieve it by changing the coordinates.

The demonstration effect can be viewed at the link: 01 Tutorial Next, I will teach you how to implement it. First, we need a repeater, the layout is set to "Vertical" (Vertical), and "Grid distribution" (Wrap(Grid)) is not selected: In addition, we need to set a variable, Phone Number List for the convenience of display, we use a called The global variable of columns, the default value is 3, indicating the initial Phone Number List of columns: Double-click the repeater to enter the modification mode, and create a new interactive event on the component. Note: is the "Loaded" of the component inside the repeater row, the event is move. Phone Number List The goal is: "To (To)" The x-coordinate is: If you want to see the animation effect, you can customize Animate, and it will be cool when you change it later.

Image
At this time, "Preview", you can find that the effect of 4 rows and 3 columns we want has been completed. Next, we create a new button, the text of the button is "change to 4 columns", Phone Number List and the new interaction "Click or Tap", the content has two steps: The first step is "Set Variable Value (Set Variable Value)" , select the "value" of the variable columns as 4. Phone Number List The second step is "Fire Event" "Add Action", the target is the "Loaded" event of the component in the repeater. Preview the page again, click the button "change to 4 columns", you will find that the repeater has changed from 3 columns to 4 columns.
Post Reply