QML-тип BackgroundItem

Базовый элемент в стиле ОС Аврора, который отображает нажатие на него при помощи подсветки фона. Подробнее…

Строка импорта:	import Sailfish.Silica 1.0
Наследуется от:	MouseArea
Наследники:	DialogHeader, GridItem, ListItem, RemorseItem, RemorsePopup, и ValueButton

• Список всех членов класса, включая унаследованные

Свойства

• contentHeight : real
• contentItem : Item
• contentWidth : real
• down : bool
• highlighted : bool
• highlightedColor : color

Подробное описание

Тип BackgroundItem реализует базовый элемент в стиле ОС Аврора, который отображает нажатие на него при помощи подсветки фона. Данный тип всегда следует использовать при создании интерактивных элементов пользовательского интерфейса. Элементы интерфейса, отвечающие на нажатие, должны использовать по мере возможности BackgroundItem.

Ниже приведён пример простого делегата на базе BackgroundItem:

import QtQuick 2.2
import Sailfish.Silica 1.0

SilicaListView {
    anchors.fill: parent
    model: 10
    delegate: BackgroundItem {
        width: ListView.view.width
        contentHeight: Theme.itemSizeSmall

        onClicked: console.log("Нажато!")

        Label {
            text: "Нажми меня"
            anchors.centerIn: parent
            color: highlighted ? Theme.highlightColor : Theme.primaryColor
        }
    }
}

Следует обратить внимание, что цвет текстовой метки зависит от значения свойства highlighted. Дополнительную информацию об оформлении интерактивных элементов управления в ОС Аврора можно получить в описании типа Theme.

BackgroundItem наследуется от типа QtQuick MouseArea. Поэтому свойства, сигналы и методы MouseArea (например onClicked в примере выше) также доступны для объектов BackgroundItem. Полный список доступных свойств, сигналов и методов приведён в документации MouseArea.

Доступ к дочерним объектам BackgroundItem

Все дочерние элементы BackgroundItem содержатся в объекте contentItem, геометрический размер которого соответствует размеру BackgroundItem. Для определения правильного размера BackgroundItem нельзя использовать свойство childrenRect:

BackgroundItem {
    width: contentItem.childrenRect.width
    height: contentItem.childrenRect.height
    Label {
        text: "Привет"
    }
}

Приведённый выше пример без использования свойства childrenRect, например, можно переписать так:

BackgroundItem {
    width: label.width
    height: label.height
    Label {
        id: label
        text: "Привет"
    }
}

Описание свойств

contentHeight : real

Содержит значение высоты объекта contentItem.

contentItem : Item

Содержит объект, который является родителем для дочерних элементов BackgroundItem.

contentWidth : real

Содержит значение ширины объекта contentItem.

down : bool

Истинно, пока элемент BackgroundItem нажат, а положение касания остаётся в области BackgroundItem.

См. также MouseArea::pressed.

highlighted : bool

Указывает, должно ли содержимое быть выделено другим цветом. Например, при истинном значении свойства highlighted текст, который содержится внутри BackgroundItem, должен быть выделен цветом:

BackgroundItem {
    Label {
        text: "Привет"
        color: highlighted ? Theme.highlightColor : Theme.primaryColor
    }
}

Дополнительную информацию об оформлении интерактивных элементов управления в ОС Аврора можно получить в описании типа Theme.

По умолчанию свойство highlighted истинно при истинном значении свойства down.

highlightedColor : color

Содержит цвет элемента, когда значение свойства highlighted истинно.

Значение по умолчанию: полупрозрачный цвет, который содержится в свойстве Theme.highlightBackgroundColor.