Contents

ValueSelector QML Type

List item displaying single selected value when not expanded, where expanding it opens a listing of all the possible values for selection. More...

Import Statement: import Lomiri.Components.ListItems 1.3
Inherits:

Empty

Properties

Signals

Detailed Description

****DEPRECATED! PLEASE USE ITEM SELECTOR OR FOR THE LOMIRI SHAPE VERSION THE OPTION SELECTOR.****

Examples:

import Lomiri.Components.ListItems as ListItem
Column {
    width: 250
    ListItem.ValueSelector {
        text: "Standard"
        values: ["Value 1", "Value 2", "Value 3", "Value 4"]
    }
    ListItem.ValueSelector {
        text: "Disabled"
        values: ["Value 1", "Value 2", "Value 3", "Value 4"]
        enabled: false
    }
    ListItem.ValueSelector {
        text: "Expanded"
        values: ["Value 1", "Value 2", "Value 3", "Value 4"]
        expanded: true
    }
    ListItem.ValueSelector {
        text: "Icon"
        iconName: "compose"
        values: ["Value 1", "Value 2", "Value 3", "Value 4"]
        selectedIndex: 2
    }
}

Property Documentation

expanded : bool

Specifies whether the selector is 'open' or 'closed'.


fallbackIconName : string

The icon shown in the list item if iconName failed to load (optional).

If both fallbackIconSource and fallbackIconName are defined, fallbackIconName will be ignored.

Note: The complete list of icons available in Lomiri is not published yet. For now please refer to the folders where the icon themes are installed:

These 2 separate icon themes will be merged soon.


fallbackIconSource : url

The location of the icon to show in the list item if iconSource failed to load (optional).


hovered : bool

True if the mouse cursor hovers over the button's mouse area.


iconFrame : bool

Show or hide the frame around the icon


pressed : bool

True if the user presses a mouse button in the button's mouse area.


selectedIndex : int

The index of the currently selected element from the values array.


sensingMargins group

sensingMargins.all : real

sensingMargins.bottom : real

sensingMargins.left : real

sensingMargins.right : real

sensingMargins.top : real

The property group specifies the margins extending the visual area where the touch events are sensed. Positive values mean the area will be extended on the specified direction outside of the visual area, negative values mean the sensing will fall under the component's visual border. All values default to 0. This does not affect mouse sensing area, which only covers the visual area of the component.

Note: If the visual area and the sensing margins are not reaching the 4x4 grid units limit, the component will fall back to these minimum limits. For example, extending a 2x2 grid unit visual component into 5x4 grid units sensing area would look as follows:

AbstractButton {
    width: units.gu(2)
    height: units.gu(2)
    Icon {
        name: "settings"
    }
    sensingArea {
        // no need to set the vertical direction as the minimum of
        // 4 grid units will be taken automatically
        leftMargin: units.gu(1)
        // we only have to add 2 grid units as the width + left margin
        // already gives us 3 grid units out of 5
        rightMargin: units.gu(2)
    }
}

values : variant

The list of values that will be shown under the label text


Signal Documentation

clicked()

This handler is called when there is a mouse click on the button and the button is not disabled. If action is defined, the action will be triggered.

Note: The corresponding handler is onClicked.


clicked()

This handler is called when there is a mouse click on the button and the button is not disabled. If action is defined, the action will be triggered.

Note: The corresponding handler is onClicked.


pressAndHold()

This handler is called when there is a long press.

Note: The corresponding handler is onPressAndHold.


pressAndHold()

This handler is called when there is a long press.

Note: The corresponding handler is onPressAndHold.