Axure Tutorial: Advanced Widgets - Repeater Basic
Introduction
This article is a part of course Axure Full Course: Tutorial, Tips and Templates.
Repeater is often used to display repeated widget patterns, and the content in widgets can be the same or different. Repeaters are often used to make tables or lists.
There are two kinds of repeater widgets in Axure RP, Repeater table and Repeater card. For making tables and lists respectively.
Creation of repeaters
There are two ways to create repeaters:
1. Drag the Repeater table or Repeater card from the widget library to the canvas.
2. Select the widget to be created as a repeater, right-click and select Create Repeater from the menu.
Widgets of Item
The Repeater contains Widgets for repetition, and the number of repetitions depends on how many rows of data there are in the dataset.
The collection of widgets that is repeated is called the "item."
Double-click the Repeater to enter the Repeater's canvas, where you can add, delete and edit widgets.
Dataset
Datasets are used to add content to widgets, which can be text, pages, or images.
Rows and Columns
The number of repetitions of the repeater's Item depends on the number of rows in the dataset. The columns is generally used to make the content of different Widgets in the Item.
Connect Data with Widgets
Click the widget on the Dataset window, and then select the widget to connect the data of the column to the widget.
Reference Page add URL or Import Image
If you need to add a link to the widget in the Item, or import an image to the Image widget, you can right-click the cell on the dataset and select Reference page or Import Image on the menu.
Reference page
Once you've referenced the page, you can set up interaction events to take advantage of it. For example, click on the widget to link to the page held by the URL column of this dataset.
Note: If you want to link to an external web page, enter the url directly in the cell, don't miss adding https://.
Adding, Deleting Rows or Columns of Dataset
Click the + button on the Dataset to add a row or column.
Right-click on the cell and select from the pop-up menu to delete the current row or column.
Import CSV
Click +Import CSV, you can import the data saved by CSV, the table of the dataset will be filled with everything automatically.
Styling Repeater
Layout
You can choose vertical layout, horizontal layout or grid layout, you can also adjust the spacing between each item.
Pagination
If you want to control the amount displayed per page, you can check the Paginate option.
Fit to Content
The size of the repeater item will change according to the size of the widget inside. If you uncheck this option, if the widget size changes through interaction, etc., the size of the repeater item will remain unchanged. This may cause items overlapping.
That's all for today's lesson.In the following lessons we will continue to introduce interactions of repeater.
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! ❤
Well Joe @AxureBoutique, a technical writer and teacher, focuses on Axure prototype design and product design.
Leave a comment