Repeater Element Reference

The Repeater element allows you to repeat an Item-based component using a model.

[Inherits Item]

This element was introduced in Qt 4.7.

Detailed Description

The Repeater element allows you to repeat an Item-based component using a model.

The Repeater element is used to create a large number of similar items. Like other view elements, a Repeater has a model and a delegate: for each entry in the model, the delegate is instantiated in a context seeded with data from the model. A Repeater item is usually enclosed in a positioner element such as Row or Column to visually position the multiple delegate items created by the Repeater.

The following Repeater creates three instances of a Rectangle item within a Row:

  1. import QtQuick 1.0
  2.  
  3. Row  {
  4.     Repeater  {
  5.         model: 3
  6.         Rectangle  {
  7.             width: 100; height: 40
  8.             border.width: 1
  9.             color: "yellow"
  10.         }
  11.     }
  12. }

A Repeater's model can be any of the supported data models. Additionally, like delegates for other views, a Repeater delegate can access its index within the repeater, as well as the model data relevant to the delegate. See the delegate property documentation for details.

Items instantiated by the Repeater are inserted, in order, as children of the Repeater's parent. The insertion starts immediately after the repeater's position in its parent stacking list. This allows a Repeater to be used inside a layout. For example, the following Repeater's items are stacked between a red rectangle and a blue rectangle:

  1.                 Row  {
  2.     Rectangle  { width: 10; height: 20; color: "red" }
  3.     Repeater  {
  4.         model: 10
  5.         Rectangle  { width: 20; height: 20; radius: 10; color: "green" }
  6.     }
  7.     Rectangle  { width: 10; height: 20; color: "blue" }
  8. }

Note: A Repeater item owns all items it instantiates. Removing or dynamically destroying an item created by a Repeater results in unpredictable behavior.

Considerations when using Repeater

The Repeater element creates all of its delegate items when the repeater is first created. This can be inefficient if there are a large number of delegate items and not all of the items are required to be visible at the same time. If this is the case, consider using other view elements like ListView (which only creates delegate items when they are scrolled into view) or use the Dynamic Object Creation methods to create items as they are required.

Also, note that Repeater is Item-based, and can only repeat Item-derived objects. For example, it cannot be used to repeat QtObjects:

  1. Item  {
  2.     //XXX does not work! Can't repeat QtObject as it doesn't derive from Item.
  3.     Repeater  {
  4.         model: 10
  5.         QtObject  {}
  6.     }
  7. }

Properties

Signal Handlers

Methods

Property Documentation

This property holds the number of items in the repeater.

The delegate provides a template defining each item instantiated by the repeater.

Delegates are exposed to a read-only index property that indicates the index of the delegate within the repeater. For example, the following Text delegate displays the index of each repeated item:

  1.                                     Column  {
  2.     Repeater  {
  3.         model: 10
  4.         Text  { text: "I'm item " + index }
  5.     }
  6. }

If the model is a string list or object list, the delegate is also exposed to a read-only modelData property that holds the string or object data. For example:

  1.                                     Column  {
  2.     Repeater  {
  3.         model: ["apples", "oranges", "pears"]
  4.         Text  { text: "Data: " + modelData }
  5.     }
  6. }

If the model is a model object (such as a ListModel) the delegate can access all model roles as named properties, in the same way that delegates do for view classes like ListView.

See also QML Data Models.

  • model : any

The model providing data for the repeater.

This property can be set to any of the supported data models:

  • A number that indicates the number of delegates to be created by the repeater
  • A model (e.g. a ListModel item, or a QAbstractItemModel subclass)
  • A string list
  • An object list

The type of model affects the properties that are exposed to the delegate.

See also Data Models.

Signal Handler Documentation

  • Repeater::onItemAdded ( int index, Item item )

This handler is called when an item is added to the repeater. The index parameter holds the index at which the item has been inserted within the repeater, and the item parameter holds the Item that has been added.

This documentation was introduced in QtQuick 1.1.

  • Repeater::onItemRemoved ( int index, Item item )

This handler is called when an item is removed from the repeater. The index parameter holds the index at which the item was removed from the repeater, and the item parameter holds the Item that was removed.

Do not keep a reference to item if it was created by this repeater, as in these cases it will be deleted shortly after the handler is called.

This documentation was introduced in QtQuick 1.1.

Method Documentation

  • Item Repeater::itemAt ( index )

Returns the Item that has been created at the given index, or null if no item exists at index.

This documentation was introduced in QtQuick 1.1.

Notes provided by the Qt Community
Cool Hack
  • 5

Votes: 3

Coverage: Qt library 4.7, 4.8

Picture of beemaster beemaster

Lab Rat
1 note

Camera shutter

Using this snippet of code you can create a nice camera shutter. Repeater, transformations and Qt Quick animations make the code really small. Imagine this to be done in other language and feel the power of QML :)

  1. import QtQuick 1.1
  2.  
  3. Rectangle {
  4.     id: container
  5.     width: 250
  6.     height: 400
  7.  
  8.     property real openness: 1
  9.     Behavior on openness { NumberAnimation { duration: 900 } }
  10.  
  11.     Repeater {
  12.         model: 8
  13.         delegate: Image {
  14.             source: "http://dl.dropbox.com/u/21467/qt/shutter.png"
  15.             rotation: 14 + openness * 70
  16.             transformOrigin: Item.Center
  17.             transform: [
  18.                 Translate {
  19.                     y: container.height/2.05 + Math.pow(rotation, 2.7)/1000
  20.                 },
  21.                 Rotation {
  22.                     origin.x: parent.width/2
  23.                     origin.y: parent.height/2
  24.                     angle: (index + 3) * -45
  25.                 }
  26.             ]
  27.         }
  28.     }
  29.  
  30.     Timer {
  31.         interval: 1000
  32.         running: true
  33.         repeat: true
  34.         onTriggered: openness = (openness + 1) % 2
  35.     }
  36. }

one

[Revisions]