Back to Qt.io
Contact Us Blog Download Qt

Container QML Type

コンテナに共通する機能を提供する抽象的な基本型。詳細...

Import Statement: import QtQuick.Controls
Inherits:

Control

Inherited By:

DialogButtonBox, MenuBar, SplitView, SwipeView, and TabBar

プロパティ

メソッド

詳細説明

コンテナは、アイテムの動的な挿入と削除を可能にするコンテナのようなユーザー・インターフェース・コントロールの基本型です。

コンテナの使用

通常、アイテムはコンテナの子として静的に宣言されますが、add 、insert 、move 、remove アイテムを動的に宣言することも可能です。コンテナ内のアイテムには、itemAt() またはcontentChildren を使用してアクセスできます。

ほとんどのコンテナには「カレント」アイテムの概念がある。現在のアイテムはcurrentIndex プロパティで指定され、読み取り専用のcurrentItem プロパティを使ってアクセスすることができます。

次の例では、コンテナの具体的な実装の1つである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 プロパティを互いにバインドすることで、同期を保つことができます。ユーザーがどちらかのコンテナを操作すると、そのコンテナのカレント・インデックスの変更がもう一方のコンテナに自動的に伝搬する。

ただし、JavaScriptでcurrentIndex の値を代入すると、それぞれのバインディングが削除されることに注意してください。バインディングを保持するには、以下のメソッドを使用して現在のインデックスを変更します：

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
}

コンテナの実装

コンテナはデフォルトの視覚化を提供しません。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 のような具体的な Container の実装では、アイテムのサイズを指定する必要はありません。

Container Controlsも参照してください 。

プロパティ Documentation

contentChildren : list<Item>

このプロパティは、コンテンツの子のリストを保持する。

このリストには、コンテナの子として QML で宣言されたすべてのアイテムと、それぞれaddItem() とinsertItem() メソッドを使って動的に追加または挿入されたアイテムが含まれます。

注意: contentData とは異なり、contentChildren には視覚的でない QML オブジェクトは含まれません。アイテムが挿入されたり、移動されたりすると、順序が入れ替わります。

Item::children およびcontentDataも参照 。


contentData : list<QtObject> [default]

このプロパティは、コンテンツデータのリストを保持する。

このリストには、コンテナの子オブジェクトとして QML で宣言されたすべてのオブジェクトと、addItem() メソッドおよびinsertItem() メソッドを用いて動的に追加または挿入されたアイテムが含まれます。

注意: contentChildren とは異なり、contentData には視覚的でない QML オブジェクトも含まれます。アイテムが挿入されたり移動されたりしても、並び替えは行われません。

Item::data およびcontentChildrenも参照して ください。


contentHeight : real [since QtQuick.Controls 2.5 (Qt 5.12)]

このプロパティはコンテンツの高さを保持します。コンテナの暗黙的な高さの合計を計算するために使用される。

明示的にオーバーライドされない限り、コンテンツの高さは、コンテナ内のアイテムの暗黙の高さに基づいて自動的に計算されます。

このプロパティは、QtQuick.Controls 2.5（Qt 5.12）で導入されました。

contentWidthも参照してください 。


contentModel : model [read-only]

このプロパティは、アイテムのコンテンツモデルを保持します。

コンテンツ・モデルは、視覚化のために提供されます。コンテナの内容を表示するコンテント・アイテムのモデルとして割り当てることができます。

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

contentData およびcontentChildren も参照 。


contentWidth : real [since QtQuick.Controls 2.5 (Qt 5.12)]

このプロパティは、コンテンツ幅を保持する。コンテナの暗黙的な幅の合計を計算するために使用される。

明示的にオーバーライドされない限り、コンテナの幅は、コンテナ内のアイテムの暗黙の幅に基づいて自動的に計算される。

このプロパティは、QtQuick.Controls 2.5（Qt 5.12）で導入されました。

contentHeightも参照してください 。


count : int [read-only]

このプロパティは、アイテムの数を保持します。


currentIndex : int

このプロパティは、現在のアイテムのインデックスを保持します。

currentItem およびManaging the Current Index も参照して ください。


currentItem : Item [read-only]

このプロパティは現在のアイテムを保持します。

currentIndex も参照して ください。


メソッド・ドキュメント

void addItem(Item item)

item を追加します。


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

コンテナの現在のインデックスを減らします。

このメソッドを呼び出すと、既存のcurrentIndex バインディングを壊すことなく、現在のインデックスを変更することができます。

このメソッドは QtQuick.Controls 2.1 (Qt 5.8) で導入されました。

currentIndex およびManaging the Current Indexも参照してください 。


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

コンテナの現在のインデックスをインクリメントします。

このメソッドを呼び出すと、既存のcurrentIndex バインディングを壊すことなく、現在のインデックスを変更できます。

このメソッドは QtQuick.Controls 2.1 (Qt 5.8) で導入されました。

currentIndex およびManaging the Current Indexも参照してください 。


void insertItem(int index, Item item)

index にitem を挿入します。


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)

コンテナの現在のindex を設定します。

このメソッドを呼び出すと、既存のcurrentIndex バインディングを壊すことなく、特定の現在のインデックスを設定できます。

currentIndex およびManaging the Current Indexも参照してください 。


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

index のアイテムを削除して返します。

注意: アイテムの所有権は呼び出し元に移ります。

このメソッドは QtQuick.Controls 2.3 (Qt 5.10) で導入されました。


©2024 The Qt Company Ltd. 本書に含まれる文書の著作権は、それぞれの所有者に帰属します。 本書で提供されるドキュメントは、Free Software Foundation が発行したGNU Free Documentation License version 1.3に基づいてライセンスされています。 Qtおよびそれぞれのロゴは、フィンランドおよびその他の国におけるThe Qt Company Ltd.の 商標です。その他すべての商標は、それぞれの所有者に帰属します。