QML-тип PullDownMenu

Добавляет вытягиваемое сверху меню в представлениях Silica. Подробнее…

Строка импорта:	`import Sailfish.Silica 1.0`
Наследуется от:	Item

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

Свойства

active : bool
background : Component
backgroundColor : color
bottomMargin : real
busy : bool
flickable : Item
highlightColor : color
quickSelect : bool
spacing : real
topMargin : real

Методы

cancelBounceBack()
close(bool immediate)

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

Тип PullDownMenu предоставляет глобальные действия для представлений SilicaFlickable, SilicaListView, SilicaGridView и SilicaWebView. Раскрывающееся меню располагается над содержимым экрана. Чтобы открыть раскрывающееся меню, следует коснуться экрана ниже полосы и, не отрываясь, провести по экрану вниз. Чтобы активировать пункт такого меню, необходимо выполнить одно из следующих действий:

не отрывая пальца от экрана, провести его вниз, остановить выбор на нужном пункте, отпустить палец от экрана;
проведя пальцем по экрану сверху вниз, раскрыть меню целиком, затем коснуться нужного пункта.

Вытягиваемое сверху меню заполняется путём создания объектов типа MenuItem в качестве дочерних элементов PullDownMenu. Сюда же в качестве дочерних элементов можно включить объекты типа MenuLabel (неинтерактивные метки).

import QtQuick 2.2
import Sailfish.Silica 1.0

ApplicationWindow {
    initialPage: Page {
        SilicaListView {
            PullDownMenu {
                MenuItem {
                    text: "Опция 1"
                    onClicked: console.log("Нажата опция 1")
                }
                MenuItem {
                    text: "Опция 2"
                    onClicked: console.log("Нажата опция 2")
                }
                MenuLabel { text: "Информационная метка" }
            }

            anchors.fill: parent
            header: PageHeader { title: "Заголовок" }
            model: 100
            delegate: ListItem {
                Label {
                    text: "Элемент " + model.index
                    anchors.centerIn: parent
                }
            }
        }
    }
}

Следует обратить внимание, что элементы типа PullDownMenu можно создавать только внутри контейнеров SilicaFlickable, SilicaListView, SilicaGridView или SilicaWebView. Для добавления меню проще всего "завернуть" его в контейнер типа SilicaFlickable:

// Без вытягиваемого сверху меню
Page {
    Column {
        width: parent.width

        PageHeader {}
        Slider { width: parent.width }
    }
}

// С вытягиваемым сверху меню
Page {
    SilicaFlickable {
        anchors.fill: parent
        contentHeight: column.height

        PullDownMenu {
            MenuItem {
                text: "Опция 1"
                onClicked: console.log("Нажата опция 1")
            }
        }

        Column {
            id: column
            width: parent.width

            PageHeader {}
            Slider { width: parent.width }
        }
    }
}

Выпадающее меню имеет настраиваемые отступы и фон.

Для изменения фона и его цвета для вытягиваемого сверху меню используются свойства background и backgroundColor, соответственно. Также можно настраивать значения отступов и интервалов для пунктов меню следующим образом:

"Отступы PullDownMenu"

Элементы типов PullDownMenu и PushUpMenu позволяют создавать меню сверху и снизу экрана, соответственно.

См. также MenuItem, PushUpMenu и ContextMenu.

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

active : bool

Истинно, если вытягиваемое сверху меню частично или полностью отображается на экране.

background : Component

Содержит компонент, который используется для отрисовки фона меню. Рекомендуется, чтобы фон имел нулевой зазор относительно нижней кромки области меню. Например:

PullDownMenu {
    background: Rectangle {
        anchors {
            fill: parent
            bottomMargin: parent.spacing
        }
        opacity: Theme.highlightBackgroundOpacity
        color: Theme.highlightColor
    }
}

backgroundColor : color

Содержит цвет фона меню. Отрисовывается с применением эффекта градиента.

См. также highlightColor.

bottomMargin : real

Отступ между последним пунктом меню и индикатором меню.

Значение по умолчанию учитывает возможное наличие элемента MenuLabel в конце меню. Если последним дочерним элементом меню является MenuLabel, значение этого свойства равно 0, в противном случае — высоте элемента MenuLabel. Таким образом при открытии меню как с элементом MenuLabel, так и без него обеспечивается характерное поведение пользовательского интерфейса.

См. также topMargin и spacing.

busy : bool

При истинном значении полоса индикатора меню пульсирует, обозначая таким образом какую-либо операцию в процессе выполнения. Меню может быть открыто вне зависимости от значения этого свойства.

flickable : Item

Указывает представление SilicaFlickable, SilicaListView, SilicaGridView или SilicaWebView, в которое будет добавлено меню PullDownMenu.

Если свойство flickable не задано, то меню будет добавлено в ближайший родительский элемент Flickable.

highlightColor : color

Содержит цвет индикатора меню и цвет подсвечивающего прямоугольника меню.

См. также backgroundColor.

quickSelect : bool

Если свойство quickSelect имеет истинное значение, то меню, состоящее из одного пункта, не фиксируется при вытягивании.

Это позволяет быстро выбирать пункт меню сразу же после открытия меню. Такое поведение уместно использовать в сигнализирующих диалогах, когда от пользователя требуется быстрая реакция.

spacing : real

Зазор в пикселях между индикатором меню и содержимым страницы.

Значение по умолчанию: 0.

См. также topMargin и bottomMargin.

topMargin : real

Отступ между верхней границей меню и первым пунктом меню.

Значение по умолчанию: Theme.itemSizeSmall.

См. также bottomMargin и spacing.

Описание методов

cancelBounceBack()

Обычно после того, как пункт меню выбран, выполняется короткая анимация возврата вытягиваемого сверху меню в исходное закрытое положение. Однако, в некоторых случаях это может противоречить действию, которое выполняется в результате выбора пункта меню. Чтобы отключить анимацию возврата меню после выбора пункта меню, следует вызвать метод cancelBounceBack() в обработчике onClicked соответствующего пункта меню. Анимация возврата меню в исходное положение снова будет выполняться при следующем открытии меню.

См. также close.

close(bool immediate)

Закрывает меню.

По умолчанию после выбора пункта меню выполняется короткая анимация возврата меню в исходное закрытое положение. Если же параметру immediate задать значение true, то эта анимация будет пропущена, а меню будет закрыто сразу.

См. также cancelBounceBack.