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

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

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

Свойства

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

Методы

• void addItem(Элемент item)
• void decrementCurrentIndex()
• void incrementCurrentIndex()
• void insertItem(int index, Элемент item)
• Элемент itemAt(int index)
• void moveItem(int from, int to)
• void removeItem(Элемент item)
• void setCurrentIndex(int index)
• Элемент takeItem(int 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()

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
    }
}

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

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

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

contentChildren : список<Элемент>

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

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

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

См. также Элемент::children и contentData.

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

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

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

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

См. также Элемент::data и contentChildren.

[с QtQuick.Controls 2.5 (Qt 5.12)] contentHeight : вещественное число

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

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

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

См. также contentWidth.

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

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

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

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

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

[с QtQuick.Controls 2.5 (Qt 5.12)] contentWidth : вещественное число

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

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

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

См. также contentHeight.

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

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

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

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

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

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

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

См. также currentIndex.

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

void addItem(Элемент item)

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

[since QtQuick.Controls 2.1 (Qt 5.8)] void decrementCurrentIndex()

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

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

Этот метод был введён в QtQuick.Controls 2.1 (Qt 5.8).

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

[since QtQuick.Controls 2.1 (Qt 5.8)] void incrementCurrentIndex()

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

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

Этот метод был введён в QtQuick.Controls 2.1 (Qt 5.8).

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

void insertItem(int index, Item item)

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

Item itemAt(int index)

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

void moveItem(int from, int to)

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

[since QtQuick.Controls 2.3 (Qt 5.10)] void removeItem(Item item)

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

Этот метод был введён в QtQuick.Controls 2.3 (Qt 5.10).

void setCurrentIndex(int index)

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

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

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

[since QtQuick.Controls 2.3 (Qt 5.10)] Item takeItem(int index)

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

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

Этот метод был введён в QtQuick.Controls 2.3 (Qt 5.10).