Axure Tutorial: Data Sorting - Repeater Elementary Tutorial
Introduction
Data sorting is a common feature in table design. Through the use of repeater, this feature can be completed quickly and well.
Features to be Realized
Click the arrow button in the table header to switch the sorting of table and the direction of the arrow.
How to Realize these Features
Through the sorting feature of repeater. When clicking the arrow, if the arrow is in ascending or descending state, add a sort to the current column. If the arrow is in unsorted state, remove the sort.
Preview the completed prototype for this tutorial
Widgets Setup
2. Make sorting icons into dynamic panels. Make three statuses: Default, Ascending and Descending.
Interaction Setup
1. When the set sorting icon is clicked, the dynamic panel will be set to the next state (Default, Ascending and Descending).
2. When the dynamic panel changes, if the dynamic panel states is ascending, add ascending sort to the table; if the dynamic panel is in descending state, add descending sort to the table; if the dynamic panel is in default state, remove ascending and descending sort to the table;
3. Similarly, set the sorting of birthdays in the table.
In this way, all the settings are completed. If you have any questions and suggestions, please leave a message.
If you like the article, please share it with others with page link, thanks for your supporting! ❤
Note: Click here to download the completed RP file for this tutorial (RP 10 or up).
Well Joe @AxureBoutique, a technical writer and teacher, focuses on Axure prototype design and product design.
Leave a comment