QML 矩形按钮高亮延迟

QML Rectangle button highlight delay

我有一个按钮列表,我想在用户按下它时单独突出显示这些按钮,直到它被释放。

问题在于,当您滚动列表时,您触摸的第一个按钮将突出显示,即使您触摸了它一毫秒。它看起来不太好,所以我想为高亮动画添加延迟。

在高亮动画发生之前稍作延迟可能会解决我认为的这个外观问题。

如何为高亮动画添加延迟?

我一直在尝试类似的方法:

Rectangle {
    id: folderButton    
    property bool pressed: false
    signal clicked

    height: mainWindoww.height * 0.1
    width: parent.width
    color: pressed ? "lightgrey" : "white"

    function release() {
        autoRepeatClicks.stop()
        folderButton.pressed = false
    }

    SequentialAnimation on pressed {
        id: autoRepeatClicks
        running: false

        PropertyAction { target: folderButton; property: "pressed"; value: true }
        ScriptAction { script: folderButton.clicked() }
        PauseAnimation { duration: 1000 }

        SequentialAnimation {
            loops: Animation.Infinite
            ScriptAction { script: folderButton.clicked() }
            PauseAnimation { duration: 500 }
        }
    }

    MouseArea {
        anchors.fill: parent

        onPressed: autoRepeatClicks.start()
        onReleased: folderButton.release()
        onCanceled: folderButton.release()
    }
}

但这段代码似乎没有添加任何时差

您可以使用 Timer 来实现这一点。例如,您可以这样做:

Item {
    Timer {
        interval: 500;
        running: true;
        repeat: true
        onTriggered: time.text = Date().toString()
    }

    Text { id: time }
}

如果您只想为颜色设置动画 属性,请尝试以下操作:

Behavior on color { ColorAnimation { duration: 1000 } }