MeeGo 1.2 Harmattan Developer Documentation Develop for the Nokia N9

QML MultiSelectionDialog Element

Selection dialog to pick multiple items at once. More...

Inherits Item

This element was introduced in qt-components 4.7.


Detailed Description

The MultiSelectionDialog is a dialog that allows the user to pick multiple items from available options.

 // Create a multi-selection dialog with a title and list elements to choose from.
 MultiSelectionDialog {
     id: multiSelectionDialog
     titleText: "Dialog Header #1"
     selectedIndexes: [1, 3, 5]
     model: ListModel {
         ListElement { name: "ListTitle #1" }
         ListElement { name: "ListTitle #2" }
         ListElement { name: "ListTitle #3" }
         ListElement { name: "ListTitle #4" }
         ListElement { name: "ListTitle #5" }
     acceptButtonText: "OK"

As with all dialogs the visual parent property is used to specify which area of the screen is grayed out while the menu is opened. If no visual parent is set then it is determined automatically and falls back to the root item.

The dialog is opened via the open() call:

 Button {
     text: "MultiSelection"
     onClicked: {;

In order to accept and close the dialog the user needs to press the accept button. The name of the selected ListElements from the model is queried via the selectedIndexes property:

 Text {
     anchors.centerIn: parent
     text: multiSelectionDialog.model.get(multiSelectionDialog.selectedIndexes[index]).name

In order to allow the user to select a single item from a list a SelectionDialog is used.

Common API

 property ListModel model
 property variant selectedIndexes
 property alias acceptButtonText
 property alias rejectButtonText

 property Component delegate
 // Style API
 property Style platformStyle

See also Dialog and SelectionDialog.

Property Documentation

acceptButtonText : string

The text string displayed on the accept button. Property default is "" (empty). The button becomes only visible if the string is not empty.

delegate : Component

The delegate that is used in order to render the ListElements inside the ListView of the MultiSelectionDialog. The MultiSelectionDialog provides a default delegate that renders the ListElements according to the UI guidelines. The default delegate can be exchanged by a custom one.

model : ListModel

The ListModel is used for the contents of the dialog. The default is an empty list model. The names of the ListElements stored inside the model are displayed as items the user can choose from.

platformStyle : Style

Property for styling the component. Property default is MultiSelectionDialogStyle{}

rejectButtonText : string

The text string displayed on the reject button. Property default is "" (empty). The button becomes only visible if the string is not empty.

selectedIndexes : variant

This returns a list of indexes of the ListElements selected by the user from the MultiSelectionDialog. Property default is [] (no selection). If the property is set during the declaration of the dialog then the items are preselected in order to suggest the default choice.