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

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

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

Свойства

• contentChildren : list<Item>
• contentData : list<Object>
• contentHeight : real
• contentModel : model
• contentWidth : real
• count : int
• currentIndex : int
• 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 — базовый тип контейнерных элементов пользовательского интерфейса, позволяющий динамически вставлять и удалять элементы.

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

Обычно элементы статически объявляются как дочерние элементы 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()

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, таких как 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).