QtQuick の ListView.onAdd は Attached Signal

by · 公開済み · 更新済み

onAdd のドキュメント ですが、ListView のドキュメントの中の「Attached Signal Documentation」というセクションにあります。

Attached と書いてある場合は、通常のプロパティやシグナルではなく、そのエレメントの子エレメント(や子となる Component)の中に以下ののように書くことになります。

Element.property: value
Element.onSignal: variant = value

ListView.onAdd の場合は ListView の delegate の中で使われることを想定しています。

アイテムが新規に追加された祭の処理を ListView の delegate で行いたい場合に、delegate の中で以下のように記述します。

ListView {
    delegate: Item {
        ListView.onAdd: { ... }
    }
}

ListView の delegate はスクロールの位置に応じて動的に生成／破棄されるため、通常使用する Component.onCompleted は使用できません。

ListView.onAdd を使用した簡単なサンプルは以下のようになります。

import QtQuick 2.0

ListView {
    width: 180
    height: 360

    model: ListModel { id: model }
    delegate: Item {
        id: delegate
        width: ListView.view.width
        height: 60
        Rectangle {
            x: 10; y: 10; width: 60 - 20; height: delegate.height - 20
            color: model.color
        }
        Text { anchors.verticalCenter: parent.verticalCenter; x: 60; text: model.color }

        ListView.onAdd: SequentialAnimation {
            NumberAnimation { target: delegate; property: 'height'; from: 0; to: delegate.height; duration: 200; easing.type: Easing.InOutQuad }
        }
    }

    Timer {
        interval: 500
        repeat: true
        running: true
        onTriggered: {
            model.insert(0, {'color': Qt.rgba(Math.random(), Math.random(), Math.random(), 1.0).toString()})
        }
    }
}

タグ:

おすすめ