QML(Qt)でListViewのサイズに合わせて何かのサイズを調節する

ListViewの内容が出来上がった時点のサイズに合わせて何かのサイズを調整したいことってあるかもしれません。

下図のようにListViewの外にある四角のサイズを調整したい場合の方法です。

 

タグ構造的には下のようになります。
 Rectangle
 └ListView
  └delegate

単純に考えれば、ListViewのwidthとheightをRectangleに指定すればOKのように思えますが。
リストの内容が完成した後にもListViewのサイズは変化しません。
明示的に指定してない場合は、横幅も高さも0のままです。

なので、delegateの「Component.onCompleted」イベントを拾って1つのアイテムのサイズと登録数を使ってRectangleのサイズを指定しなおします。

下のソースのような感じです。

2011/9/2修正
元のソースだと各アイテムの高さがまちまちの時に上手いこといきません。
また、delegateのComponent.onCompletedは各アイテムが出来上がった時に発生するので自分の高さで全体を無駄に再計算してしまいます。
なので自分の分の高さを足し込むだけにします。
その時に+1することで次のアイテムが見える状態にして生成を促します。
ListViewはアイテムが見える範囲に無いと生成をしませんのでその対策です。
これで全てのアイテムが見える四角を作れます。


import QtQuick 1.0

Rectangle {
    id: _root
    height: 1     //最初は高さ1pxで常に次のアイテムが見えるようにする

    ListView {
        id: _list
        anchors.fill: parent

        model: hogehogeModel {
        }

        delegate: hogehogeDelegate {
            id: _delegate

            Component.onCompleted: {
                _root.width = _delegate.width;
                //ここ自分の高さを足し込む
                _root.height += _delegate.height; 
            }

        }
    }
}