QML-тип PushUpMenu

Добавляет вытягиваемое снизу меню в представлениях 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)

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

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

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

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

import QtQuick 2.2
import Sailfish.Silica 1.0

ApplicationWindow {
    initialPage: Page {
        SilicaListView {
            PushUpMenu {
                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
                }
            }
        }
    }
}

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

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

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

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

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

        Column {
            id: column
            width: parent.width

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

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

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

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

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

active : bool

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

background : Component

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

PushUpMenu {
    background: Rectangle {
        anchors {
            fill: parent
            topMargin: parent.spacing
        }
        opacity: Theme.highlightBackgroundOpacity
        color: Theme.highlightColor
    }
}

backgroundColor : color

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

См. также highlightColor.

bottomMargin : real

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

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

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

busy : bool

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

flickable : Item

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

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

highlightColor : color

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

См. также backgroundColor.

quickSelect : bool

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

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

spacing : real

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

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

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

topMargin : real

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

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

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

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

cancelBounceBack()

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

См. также close.

close(bool immediate)

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

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

См. также cancelBounceBack.