Тип QML Container

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

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

Свойства

• contentChildren : list<Item>
• contentData : list<Object>
• contentHeight : real
• contentModel : model
• contentWidth : real
• count : int
• currentIndex : int
• currentItem : Item

Методы

• void addItem(Item item)
• void decrementCurrentIndex()
• void incrementCurrentIndex()
• void insertItem(int index, Item item)
• Item itemAt(int index)
• void moveItem(int from, int to)
• void removeItem(Item item)
• void setCurrentIndex(int index)
• Item takeItem(int 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(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)

Добавляет элемент 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(int index, Item item)

Вставляет item по индексу index.

Item itemAt(int index)

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

void moveItem(int from, int to)

Перемещает элемент from в другой индекс to.

void removeItem(Item item)

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

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

void setCurrentIndex(int index)

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

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

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

Item takeItem(int index)

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

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

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