Тип QML контейнера

Абстрактный базовый тип, предоставляющий общие для контейнеров функциональные возможности. Подробнее...

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

Свойства

• contentChildren : список<Item>
• contentData : список<Объект>
• contentHeight : вещественное число
• contentModel : модель
• contentWidth : вещественное число
• count : целое число
• currentIndex : целое число
• currentItem : Item

Методы

• void addItem(item)
• void decrementCurrentIndex()
• void incrementCurrentIndex()
• void insertItem(index, Item item)
• Item itemAt(index)
• void moveItem(from, int to)
• void removeItem(item)
• void setCurrentIndex(index)
• Item takeItem(index)

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

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

Использование контейнеров

Обычно элементы статически объявляются как дочерние элементы контейнера, но также можно добавить, вставить, переместить и удалить элементы динамически. К элементам в контейнере можно получить доступ, используя itemAt() или contentChildren.

В большинстве контейнеров есть понятие «текущего» элемента. Текущий элемент задается свойством currentIndex и может быть получен с помощью только для чтения свойства currentItem.

Следующий пример иллюстрирует динамическое вставление элементов в TabBar, который является одним из конкретных реализаций Container.

Row {
    TabBar {
        id: tabBar

        currentIndex: 0
        width: parent.width - addButton.width

        TabButton { text: "TabButton" }
    }

    Component {
        id: tabButton
        TabButton { text: "TabButton" }
    }

    Button {
        id: addButton
        text: "+"
        flat: true
        onClicked: {
            tabBar.addItem(tabButton.createObject(tabBar))
            console.log("added:", tabBar.itemAt(tabBar.count - 1))
        }
    }
}

Управление текущим индексом

При совместном использовании нескольких контейнеров, таких как TabBar и SwipeView, их свойства currentIndex могут быть связаны друг с другом, чтобы они синхронизировались. При взаимодействии пользователя с любым из контейнеров изменения текущего индекса автоматически распространяются на другой контейнер.

Обратите внимание, что присвоение значения currentIndex в JavaScript удаляет соответствующую привязку. Чтобы сохранить привязки, используйте следующие методы для изменения текущего индекса:

• incrementCurrentIndex()
• decrementCurrentIndex()
• setCurrentIndex(int index)

TabBar {
    id: tabBar
    currentIndex: swipeView.currentIndex
}

SwipeView {
    id: swipeView
    currentIndex: tabBar.currentIndex
}

Button {
    text: qsTr("Home")
    onClicked: swipeView.setCurrentIndex(0)
    enabled: swipeView.currentIndex != 0
}

Button {
    text: qsTr("Previous")
    onClicked: swipeView.decrementCurrentIndex()
    enabled: swipeView.currentIndex > 0
}

Button {
    text: qsTr("Next")
    onClicked: swipeView.incrementCurrentIndex()
    enabled: swipeView.currentIndex < swipeView.count - 1
}

Реализация контейнеров

Container не предоставляет визуализации по умолчанию. Он используется для реализации таких контейнеров, как SwipeView и TabBar. При реализации пользовательского контейнера наиболее важной частью API является contentModel, который предоставляет содержащие элементы таким образом, что он может быть использован в качестве модели делегата для представлений элементов и повторителей.

Container {
    id: container

    contentItem: ListView {
        model: container.contentModel
        snapMode: ListView.SnapOneItem
        orientation: ListView.Horizontal
    }

    Text {
        text: "Page 1"
        width: container.width
        height: container.height
    }

    Text {
        text: "Page 2"
        width: container.width
        height: container.height
    }
}

Обратите внимание, как размеры элементов страницы задаются вручную. Это связано с тем, что пример использует обычный Container, который не делает никаких предположений о визуальном макете. Обычно не нужно указывать размеры элементов в конкретных реализациях Container, таких как SwipeView и TabBar.

См. также Контейнерные элементы управления.

Документация по свойствам

contentChildren : список<Item>

Это свойство содержит список дочерних элементов содержимого.

Список содержит все элементы, объявленные в QML в качестве дочерних элементов контейнера, а также элементы, которые были динамически добавлены или вставлены с помощью методов addItem() и insertItem() соответственно.

Примечание: В отличие от contentData, contentChildren не включает невизуальные объекты QML. Он переупорядочивается при вставке или перемещении элементов.

См. также Item::children и contentData.

[по умолчанию] contentData : список<Объект>

Это свойство содержит список данных содержимого.

Список содержит все объекты, объявленные в QML в качестве дочерних элементов контейнера, а также элементы, которые были динамически добавлены или вставлены с помощью методов addItem() и insertItem() соответственно.

Примечание: В отличие от contentChildren, contentData включает невизуальные объекты QML. Он не переупорядочивается при вставке или перемещении элементов.

См. также Item::data и contentChildren.

contentHeight : вещественное число

Это свойство содержит высоту содержимого. Оно используется для расчета общей неявной высоты контейнера.

Если явно не переопределено, высота содержимого автоматически рассчитывается на основе неявной высоты элементов в контейнере.

Это свойство было введено в QtQuick.Controls 2.5 (Qt 5.12).

См. также contentWidth.

[только для чтения] contentModel : модель

Это свойство содержит модель содержимого элементов.

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

Container {
    id: container
    contentItem: ListView {
        model: container.contentModel
    }
}

См. также contentData и contentChildren.

contentWidth : вещественное число

Это свойство содержит ширину содержимого. Оно используется для расчета общей неявной ширины контейнера.

Если явно не переопределено, ширина содержимого автоматически рассчитывается на основе неявной ширины элементов в контейнере.

Это свойство было введено в QtQuick.Controls 2.5 (Qt 5.12).

См. также contentHeight.

[только для чтения] count : целое число

Это свойство содержит количество элементов.

currentIndex : целое число

Это свойство содержит индекс текущего элемента.

См. также currentItem и Управление текущим индексом.

[только для чтения] currentItem : Item

Это свойство содержит текущий элемент.

См. также currentIndex.

Документация по методам

void addItem(item)

Добавляет элемент item.

void decrementCurrentIndex()

Уменьшает текущий индекс контейнера.

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

Этот метод был представлен в QtQuick.Controls 2.1 (Qt 5.8).

См. также currentIndex и Управление текущим индексом.

void incrementCurrentIndex()

Увеличивает текущий индекс контейнера.

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

Этот метод был представлен в QtQuick.Controls 2.1 (Qt 5.8).

См. также currentIndex и Управление текущим индексом.

void insertItem(index, Item item)

Вставляет item в позицию index.

Item itemAt(index)

Возвращает элемент в позиции index, или null если он не существует.

void moveItem(from, int to)

Перемещает элемент from в позицию to.

void removeItem(item)

Удаляет и уничтожает указанный item.

Этот метод был представлен в QtQuick.Controls 2.3 (Qt 5.10).

void setCurrentIndex(index)

Устанавливает текущий индекс контейнера.

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

См. также currentIndex и Управление текущим индексом.

Item takeItem(index)

Удаляет и возвращает элемент в позиции index.

Примечание: Владение элементом передаётся вызывающей стороне.

Этот метод был представлен в QtQuick.Controls 2.3 (Qt 5.10).