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

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

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

Свойства

• contentChildren : список<Item>
• contentData : список<Объект>
• contentModel : модель
• 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(int index)
• void setCurrentIndex(int index)

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

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

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

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

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

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

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, который не делает никаких предположений о визуальной компоновке. Обычно нет необходимости указывать размеры элементов в конкретных реализациях контейнеров, таких как SwipeView и TabBar.

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

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

contentChildren : список<Item>

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

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

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

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

[default] contentData : список<Объект>

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

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

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

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

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

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

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

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

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

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

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

currentIndex : int

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

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

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

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

См. также currentIndex.

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

void addItem(Item item)

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

void decrementCurrentIndex()

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

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

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

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

void incrementCurrentIndex()

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

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

Этот метод QML был введен в 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)

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

void removeItem(int index)

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

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

void setCurrentIndex(int index)

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

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

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