Add and delete design-time data

By
default, the Data List component begins with five sample records. In
some cases, this may not be enough to demonstrate the list effectively.
For example, a list that will eventually display a large collection of
thumbnail images may need a larger sample to activate the scroll bar or
to fill out the total area in a tiled set of images.

1.

In
the Design-Time Data panel, click row number 3 in the far-left column
to select it. Be sure to click the row number, not one of its image or
text columns.

Clicking the row number selects the row without opening the Select Asset dialog box.

2.

Click Add Row in the Design-Time Data panel.

An exact copy of the selected row is added below it and any rows after
that are renumbered. You can swap the images and text, just like you’ve
done for the other rows.

3.

Select the new row you just added (it should be row 4), and click the Delete icon () in the Design-Time Data panel.

The row is deleted.

4.

Collapse the Design-Time Data panel so you can see more of the artboard.

Add and remove elements in the repeated item

After creating the data list, you can modify the repeated item template by adding or removing text and images.

1.

Select the Data List component and click Edit Parts in the HUD to edit the component in Edit-In-Place mode.

Tip

To edit a Data List component
in Edit-In-Place mode, you can double-click the data list. You can also
select it and choose Modify > Edit Component. A third option is to
select it and click Edit Parts in the HUD.

2.

Double-click the repeated item (anywhere in the list of reviews).

3.

In the Images category in the Library panel, locate the categoryIcon_Japanese.png file.

It’s a little piece of sushi.

4.

Drag the categoryIcon_Japanese.png file to the artboard and position it to the left of the stars.

Right now, the sushi graphic is only in the Normal state of the repeated item.

5.

Choose States > Share To State > All States.

Now the sushi icon appears in the Normal, Over, and Selected states.

Note

If you add new text in the
repeated item, the option in the Design-Time Data section of the HUD
changes to Add Text To Design-Time Data.

6.

In the Design-Time Data section of the HUD, choose Add Image To Design-Time Data.