5 ItemView is a scrollable layout container with built-in layouts to determine
6 the logical position of each item in a layout.
8 Actors are provided from an external {{#crossLink "ItemFactory"}}ItemFactory{{/crossLink}},
9 to display the currently visible items. ItemFactory is for storing the data of ItemView and
10 creating actors for ItemView on request. Each item in ItemView is identified by a unique ID,
11 and has a linear order from 0.
13 ### Example of creating an ItemView (see {{#crossLink "ItemFactory"}}ItemFactory{{/crossLink}} API for a full example)
16 // Define the data of 100 items
17 var itemViewData = [];
18 for (var itemId = 0; itemId < 100; itemId++)
21 itemData["template"] = "template-item";
22 itemData["title_text"] = "Item " + itemId;
23 itemViewData[itemId] = itemData;
26 // Create an item factory and set the JSON template file and item view data
27 var itemFactory = new dali.ItemFactory();
28 itemFactory.jsonTemplateFile = "./item-template.json"; // Set the JSON template file
29 itemFactory.data = itemViewData; // Set the ItemView data
31 // Create the item view with the given item factory
32 var itemView = new dali.Control("ItemView", itemFactory);
33 itemView.size = [stageSize.x, stageSize.y, 0.0];
34 itemView.parentOrigin = dali.CENTER_LEFT;
35 itemView.anchorPoint = dali.CENTER_LEFT;
36 dali.stage.add( itemView );
38 // Add a scroll bar to ItemView (optional)
39 var scrollBar = new dali.Control("ScrollBar");
40 scrollBar.parentOrigin = dali.TOP_RIGHT;
41 scrollBar.anchorPoint = dali.TOP_RIGHT;
42 scrollBar.widthResizePolicy = "FIT_TO_CHILDREN";
43 scrollBar.heightResizePolicy = "FILL_TO_PARENT";
44 scrollBar.indicatorHeightPolicy = "Fixed";
45 scrollBar.indicatorFixedHeight = 60.0;
46 itemView.add(scrollBar);
48 // Add a list layout to ItemView (multiple layouts can be added to the same ItemView)
49 itemView.addLayout(dali.ITEM_LAYOUT_LIST);
51 // Set custom item size for the list layout
52 // If set, this will overide the predefined item size in the list layout
53 itemView.setItemSize(0, [350, 100, 0]); // 0 means the first layout added to ItemView
55 // Acticate the list layout (which will layout the items as a list)
56 itemView.activateLayout(0, itemView.size); // 0 means the first layout added to ItemView