Lists

You can use lists to organize different types of data and display the data in your apps. Users can select items in a list and your app can respond to the selection in any way you want. Your app might display information that's related to the selected item, or it might display a new screen.

Lists in the Cascades framework use a model-view-controller design pattern. This design pattern separates the data for the list (the model) and the visual representation of the list (the view). By using this approach, you can provide data from different sources without changing the graphical appearance of the list. Similarly, you can change how each list item looks without changing where the data comes from.


Diagram showing a data model and the resulting appearance of list items.

You create a list by using two components: a list view and a data model.

  • A list view determines how data is displayed in the list. You can specify visual properties for the list, such as width, height, and margins. You can also specify the appearance of each list item by using QML controls. For example, for a list of text options, the list items might be  Label controls. For a list of images, the list items might be  ImageView controls. You can also create custom QML components to represent your list items.
  • A data model provides the data for the list view to display. You can use data from various sources, such as a JSON data structure, a SQLite database, or an .xml file. When the list view needs to access the data, it queries the data model and receives the appropriate information to display. You can use predefined data models to handle your data, or you can create your own data model.

In Cascades, list views are represented by the  ListView class in C++ and the corresponding ListView component in QML. Data models are represented by the  DataModel class and its subclasses. You can learn more about list views and data models by visiting the links below.

Related resources

Last modified: 2013-12-21



Got questions about leaving a comment? Get answers from our Disqus FAQ.

comments powered by Disqus