API Documentation

Documentation for developing SailfishOS applications

ValueButton QML Type

A clickable control that displays a label and a value More...

Import Statement: import Sailfish.Silica 1.0
Inherits:

BackgroundItem

Inherited By:

ComboBox

Properties

Detailed Description

The ValueButton type provides a clickable control with a styled label and value.

This is typically used to display the result of a selection by the user. For example, the code below opens a dialog when the value button is clicked, and updates the displayed value accordingly when a selection is made:

 import QtQuick 2.2
 import Sailfish.Silica 1.0

 Page {
     ValueButton {
         label: "Date"
         value: "Select"

         onClicked: {
             var dialog = pageStack.push("Sailfish.Silica.DatePickerDialog")

             dialog.accepted.connect(function() {
                 value = dialog.dateText
             })
         }
     }
 }

The value is automatically placed below the label if the combined text does not fit side-by-side.

See also BackgroundItem.

Property Documentation

description : string

Optional text to describe the purpose of the value button.


label : string

The first piece of displayed text.

This should be a concise description of the type of the type of data that can be selected when this value button is clicked.

See also value.


labelColor : color

The color of the displayed label.

The default value is Theme.highlightColor when the button is pressed, or Theme.primaryColor otherwise.


leftMargin : real

The margins between the left and right edges of the value button and its contents. The default value is Theme.horizontalPageMargin.


rightMargin : real

The margins between the left and right edges of the value button and its contents. The default value is Theme.horizontalPageMargin.


value : string

The second piece of displayed text.

This should be a concise description of the selected data.

See also label.


valueColor : color

The color of the displayed value.

The default value is Theme.highlightColor.


We use cookies to improve your user experience and to help us to develop our services. By continuing to browse the site, you approve of our use of cookies.