Convert the sample record into a Data List component
With the parts of a data
list arranged in the artboard, the next step is to select them and
convert the individual parts into a new Data List component. If your
data list includes a scroll bar, make sure to include it in the
selection.
1. | Make sure the artwork you imported in the previous task is still selected.
|
2. | Hold down Shift and click the scroll bar to add it to the selection.
|
3. | In the HUD, convert the artwork to a Data List component.
A message in the HUD informs you that to make the data list work
correctly, you need to assign its parts. You need to tell it which parts
to use as the repeated item.
|
Define the repeated item
Every Data List component must include a master item called the repeated item. The repeated item is a template that defines the appearance of every item or record in the list, including its Normal, Over, and Selected states.
Changes applied to the
repeated item template are applied to every item in the list
automatically at runtime. For example, if you change the opacity of an
image in the Over state of the repeated item, this change applies to
every record. Keep in mind that your application might display thousands
of records. It’s a huge time-saver and guarantees a consistent look
across all records.
1. | In the HUD, click Edit Parts to edit the data list in Edit-In-Place mode.
Tip
When a component is in
Edit-In-Place mode, you can drag to select its parts without selecting
other objects in the artboard. You can also choose Edit > Select All
and only objects in the component you’re editing are selected.
|
2. | Select
all five parts of the sample review record, including the round image,
the line, the stars, and both lines of text. Do not select the scroll
bar.
|
3. | In the Convert To Data List Part section of the HUD, click Choose Part and select Repeated Item.
The artwork is turned into a repeated item. By default, the repeated
item is arranged vertically in the data list. If it doesn’t fit
perfectly in the designed space, you can resize it. You’ll do that next.
|
