Question

我想将QtGraphicalEffect ColorOverlay应用于Image委托中的Repeater。问题是我必须将id的{{1}}设置为Image的{{1}}，但我不知道source ，因为它是由ColorOverlay动态创建的。

id

如何设置Repeater和import QtQuick 2.4 import QtGraphicalEffects 1.0 Item { id:mainItem width: 800 height: 400 property string vorneColor: "red" ListModel { id: safeRailModel ListElement {name: "vorne"; imageSource:"images/saferail/ring_vorne.png";} ListElement {name: "vorneLinks"; imageSource:"images/saferail/ring_vorne_links.png"; } } Component { id: imageDelegate Image { source: imageSource anchors.horizontalCenter: parent.horizontalCenter anchors.bottom: parent.bottom fillMode: Image.PreserveAspectFit opacity: 1 visible: true } } Repeater { id: safeRailRepeater model: safeRailModel delegate: imageDelegate } Component { id: effectsDelegate Item{ id:effectsItem ColorOverlay { anchors.fill: safeRailRepeater.itemAt(index)// <-- This doesn't work source: safeRailRepeater.itemAt(index)// <-- This doesn't work color: vorneColor } } } Repeater { id: safeRailEffectsRepeater model: safeRailModel delegate: effectsDelegate } }属性？

我到处搜索，但我只发现source或anchors.fill的内容，但前者和后者都没有。

附注：safeRailRepeater.itemAt(index)不需要在单独的委托和safeRailRepeater.itemAt(index).item中。

如果有人能解决这个问题，或者能指出正确的方向，那就太好了。

非常感谢！

Answer 1

问题是itemAt()函数调用返回null，因为另一个Repeater尚未加载其项目。此外，函数调用永远不会被重新评估，因为它的参数都没有改变，所以你总是得到null。

虽然设计有点奇怪;我建议将ColorOverlay移到同一个代理中，正如您所提到的那样，它不必单独放在Repeater中：

import QtQuick 2.0
import QtQuick.Window 2.0
import QtGraphicalEffects 1.0

Window {
    id: mainItem
    width: 800
    height: 400
    visible: true

    property string vorneColor: "red"

    ListModel {
        id: safeRailModel
        ListElement { name: "vorne"; vorneColor: "salmon"; }
        ListElement { name: "vorneLinks"; vorneColor: "steelblue"; }
    }
    Component {
        id: imageDelegateComponent
        Rectangle {
            id: delegate
            color: "grey"
            opacity: 1
            visible: true
            width: 64
            height: 64

            layer.enabled: true
            layer.effect: ColorOverlay {
                color: vorneColor
            }
        }
    }
    Row {
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.bottom: parent.bottom

        Repeater {
            id: safeRailRepeater
            model: safeRailModel
            delegate: imageDelegateComponent
        }
    }
}

使用Item Image API是指定图形效果的便捷方式。

我还将Rectangle更改为Repeater，因为我们无权访问这些图片，并将send, abc放在一行中，以便您可以看到所有代表们。

如何在QML中应用Qt图形效应对中继器的委托

1 个答案: