このページでは

TreeModel QML Type

単純なツリーモデルをカプセル化します。詳細...

Import Statement: import Qt.labs.qmlmodels
Since: Qt 6.10

プロパティ

方法

  • void appendRow(var treeRow)
  • void appendRow(parent, var treeRow)
  • void clear()
  • variant data(index, string role)
  • var getRow(rowIndex)
  • QModelIndex index(list<int> treeIndex, int column)
  • QModelIndex index(int row, int column, var parent)
  • void removeRow(rowIndex)
  • bool setData(index, variant value, string role)
  • void setRow(rowIndex, var treeRow)

詳細説明

TreeModel 型は、TreeView で使用できるツリーモデルのデータとして、JavaScript/JSON オブジェクトを格納します。これは、C++ でカスタムQAbstractItemModel サブクラスを作成することなく、非常に単純なモデルをサポートすることを目的としています。

import QtQuick
import QtQuick.Controls
import Qt.labs.qmlmodels

ApplicationWindow {
    visible: true
    width: 500
    height: 500

    TreeView {
        id: treeView
        anchors.fill: parent

        selectionModel: ItemSelectionModel {}

        model: TreeModel {
            id: treeModel

            TableModelColumn {
                display: "checked"
            }
            TableModelColumn {
                display: "size"
            }
            TableModelColumn {
                display: "type"
            }
            TableModelColumn {
                display: "name"
            }
            TableModelColumn {
                display: "lastModified"
            }

            rows: [{
                    checked: false,
                    size: "—",
                    type: "folder",
                    name: "Documents",
                    lastModified: "2025-07-01",
                    rows: [{
                            checked: true,
                            size: "24 KB",
                            type: "file",
                            name: "Resume.pdf",
                            lastModified: "2025-06-20",
                        }, {
                            checked: false,
                            size: "2 MB",
                            type: "folder",
                            name: "Reports",
                            lastModified: "2025-06-10",
                            rows: [{
                                    checked: true,
                                    size: "850 KB",
                                    type: "file",
                                    name: "Q2_Report.docx",
                                    lastModified: "2025-06-15",
                                }, {
                                    checked: false,
                                    size: "1.2 MB",
                                    type: "file",
                                    name: "Q3_Plan.xlsx",
                                    lastModified: "2025-06-18",
                                }]
                        }]
                },
                {
                    checked: false,
                    size: "—",
                    type: "folder",
                    name: "Pictures",
                    lastModified: "2025-05-30",
                    rows: [{
                            checked: true,
                            size: "3.5 MB",
                            type: "file",
                            name: "Vacation.jpg",
                            lastModified: "2025-05-15",
                        }, {
                            checked: false,
                            size: "2.1 MB",
                            type: "file",
                            name: "Family.png",
                            lastModified: "2025-05-20",
                        }]
                }
            ]
        }

        delegate: TreeViewDelegate {}
    }
}

モデルの初期データは、rows プロパティを使用するか、appendRow() を呼び出すことで設定されます。モデル内の各列は、TableModelColumn インスタンスを宣言することで指定されます。各インスタンスの順序によって列インデックスが決まります。モデルのComponent::completed() シグナルが発信されると、カラムとロールが確立され、モデルの寿命まで固定されます。

サポートされる行のデータ構造

各行はツリーのノードを表します。各ノードは同じタイプの列を持ちます。TreeModel は JavaScript/JSON データを扱うように設計されているため、各行は単純なキーと値のペアのリストとなります:

                {
                    checked: false,
                    size: "—",
                    type: "folder",
                    name: "Pictures",
                    lastModified: "2025-05-30",
                    rows: [{
                            checked: true,
                            size: "3.5 MB",
                            type: "file",
                            name: "Vacation.jpg",
                            lastModified: "2025-05-15",
                        }, {
                            checked: false,
                            size: "2.1 MB",
                            type: "file",
                            name: "Family.png",
                            lastModified: "2025-05-20",
                        }]
                }

ノードは子ノードを持つことができ、それらは "rows "キーに関連付けられた配列に格納される。ノードは子ノードを持つことができ、それらは "rows "キーに関連付けられた配列に格納されます。"rows "はこの目的のために予約されています。子ノードのリストのみがこのキーに関連付けられます。

モデルの操作は、QModelIndices 。特定の行/ノードにアクセスするには、getRow() 関数を使用します。rows プロパティを使ってモデルのJavaScriptデータに直接アクセスすることも可能ですが、この方法でモデルデータを変更することはできません。

新しい行を追加するには、appendRow ()を使用します。既存の行を変更するには、setRow(),removeRow(),clear() を使用します。

外部 JSON ソースでの TreeModel の使用

TreeModelの使用目的は、QMLファイル内でJSONデータを定義することですが、その構造がTreeModelによって定義された構造と一致する限り、どのようなJSONオブジェクトでもモデルと共に使用することができます。JSONオブジェクトの全ての行が、モデルで定義されたカラムに適合していれば、rowsプロパティを通して直接割り当てることができます。

JSONオブジェクトのソースはファイルでも構いません。例えば、モデルが

    TreeModel {
        id: treeModel
        objectName: "testModel"

        TableModelColumn { display: "checked" }
        TableModelColumn { display: "size" }
        TableModelColumn { display: "type" }
        TableModelColumn { display: "name" }
        TableModelColumn { display: "lastModified" }
    }

と定義され、ファイルに格納されたJSONオブジェクトが

let folders = [
    {
        "checked": false,
        "size": "—",
        "type": "folder",
        "name": "Documents",
        "lastModified": "2025-07-01",
        "rows": [
            {
                "checked": true,
                "size": "24 KB",
                "type": "file",
                "name": "Resume.pdf",
                "lastModified": "2025-06-20"
            }
        ]
    },
    {
        "checked": false,
        "size": "—",
        "type": "folder",
        "name": "Pictures",
        "lastModified": "2025-05-30",
        "rows": [
            {
                "checked": true,
                "size": "3.5 MB",
                "type": "file",
                "name": "Vacation.jpg",
                "lastModified": "2025-05-15"
            }
        ]
    }
]

としてJavaScriptファイルをインポートすることで、このオブジェクトを提供することができます。

モジュール

import "TreeData.js" as JsonData

としてJavaScriptファイルをインポートすることで提供することができます。

    Component.onCompleted: treeView.model.rows = JsonData.folders

警告 JSONデータが信頼できるソースから来たものであることを確認してください。モデルは入力に基づいて行を生成するので、不正なJSONや信頼できないJSONは予期しない動作やパフォーマンスの問題につながる可能性があります。

JSONオブジェクトが解析され、JavaScriptの配列として代入される別の例については、TableModel を参照してください。

TableModelColumn およびTreeViewも参照して ください。

プロパティのドキュメント

columnCount : int [read-only]

この読み取り専用プロパティは、モデルの列数を保持する。

列の数は、rows プロパティが設定された後、またはappendRow() が初めて呼び出された後、モデルの寿命が尽きるまで固定されます。

rows : var

このプロパティは、行の配列の形でモデル・データを保持する。

getRow(),setRow(),appendRow(),clear(),columnCountも参照

メソッド・ドキュメント

void appendRow(var treeRow)

ルート・ノードにtreeRow を追加する。

setRow() およびremoveRow()も参照のこと

void appendRow(parent, var treeRow)

treeRow の値(セル)を用いて、parent に新しい treeRow を追加する。

treeModel.appendRow(index, {
    checked: false,
    size: "-",
    type: "folder",
    name: "Orders",
    lastModified: "2025-07-02",
    rows: [
        {
            checked: true,
            size: "38 KB",
            type: "file",
            name: "monitors.xlsx",
            lastModified: "2025-07-02"
        },
        {
            checked: true,
            size: "54 KB",
            type: "file",
            name: "notebooks.xlsx",
            lastModified: "2025-07-02"
        }
    ]
});

parent は、QModelIndex によってバッ クされた匿名 QML 型です。parent が無効な場合、treeRow がルートノードに追加されます。

setRow() およびremoveRow()も参照してください

void clear()

モデルからすべての行を削除します。

removeRow()も参照してください

variant data(index, string role)

与えられたrole に属する、与えられたindexTreeModel のデータを返す。

indexQModelIndex でバッキングされた無名のQML型です。

index() およびsetData()も参照してください

var getRow(rowIndex)

モデル内の指定したインデックスの treeRow を返します。rowIndexQModelIndex でバッ クされた無名の QML 型です。

代わりに setTreeRow() を使用してください。

setRow(),appendRow(),removeRow()も参照ください

QModelIndex index(list<int> treeIndex, int column)

与えられたtreeIndexcolumn を参照するオブジェクトを返します。このオブジェクトは、data()関数に渡してそのセルのデータを取得したり、setData()に渡してそのセルの内容を編集したりすることができます。

返されるオブジェクトは、QModelIndex でバッ クされた無名の QML 型です。

最初のパラメータtreeIndex は、ルートから目的の行までの行番号のパスを表し、ツリー内のナビゲー ションに使用されます。これは例によって説明します。

ノードA~Fとインデックス・パスを示すツリー図
  • ツリーのルートは特別であり、無効なQModelIndex
  • ノードAはルートの最初の子であり、対応するtreeIndex[0] である。
  • ノードBはノードAの最初の子である。AのtreeIndex[0] なので、BのtreeIndex[0,0] となる。
  • ノードCはAの2番目の子であり、そのtreeIndex[0,1] である。
  • ノードDはAの3番目の子で、そのtreeIndex[0,2]
  • ノードEはルートの2番目の子で、そのtreeIndex[1]
  • ノードFはルートの3番目の子で、そのtreeIndex[2]

このオーバーロードを使用すると、親ノードへのQModelIndex を持たずに、ノードへのQModelIndex を得ることができる。

指定されたリストでノードが見つからない場合、無効なモデルインデックスが返されます。無効なモデル・インデックスはノードのルートを参照していることに注意してください。

QMLのQModelIndexと関連するクラスdata()も参照してください

QModelIndex index(int row, int column, var parent)

与えられたparentrowcolumn を参照するオブジェクトを返します。このオブジェクトは、data() 関数に渡してそのセルのデータを取得したり、setData() に渡してそのセルの内容を編集したりすることができます。

返されるオブジェクトはQModelIndex によってバッ クされた無名の QML 型です。

QML の QModelIndex と関連するクラスdata()も参照してください

void removeRow(rowIndex)

rowIndex によって参照される TreeRow をモデルから削除します。rowIndex は、QModelIndex によってバッ クされる匿名 QML 型です。

treeModel.removeTreeRow(rowIndex)

clear()も参照してください

bool setData(index, variant value, string role)

指定されたindex の TreeRow にrole で指定されたデータフィールドをvalue で挿入または更新します。成功した場合は true、失敗した場合は false を返します。

index は、QModelIndex で指定された無名の QML 型です。

data() およびindex()も参照して ください。

void setRow(rowIndex, var treeRow)

モデルのrowIndex にある TreeRow をtreeRow で置き換えます。rowIndexQModelIndex が返す匿名 QML 型です。

子行がある行は拒否されます。

すべての列/セルがtreeRow に存在し、正しい順序で並んでいる必要があります。その行の子行は影響を受けません。

treeModel.setRow(rowIndex, {
    checked: true,
    size: "-",
    type: "folder",
    name: "Subtitles",
    lastModified: "2025-07-07",
    iconColor: "blue"
});

appendRow()も参照してください

© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.