c – Qt中的动画绑定变化

2023年3月3日 168次阅读

当绑定发生变化时,我正试图找到一种在QML元素上进行转换的方法.假设您有一个Text元素,text属性绑定到某个东西.我想要的是当绑定中的数据发生变化时,元素淡出(仍显示旧数据),切换并淡入新数据(当元素不可见时发生实际转换.)

我一直在寻找一种方法来做到这一点,但我可以搞清楚.我已尝试在QML中使用Qt Quick动画,但数据本身在动画运行之前发生了变化,不再需要动画.我已经尝试创建一个自定义的QDeclarativeItem对象,该对象在QDeclarativeItem :: paint()中调用动画,但我无法弄清楚如何让它实际运行.

我应该在这里注意,我知道我的绑定工作正常,因为显示的数据发生了变化,我无法让这些动画在适当的时间运行.

以下是我尝试使用QML的内容：

Text {
    id: focusText
    text: somedata

    Behavior on text {
         SequentialAnimation {
             NumberAnimation { target: focusText; property: "opacity"; to: 0; duration: 500 }
             NumberAnimation { target: focusText; property: "opacity"; to: 1; duration: 500 }
         }
     }
}

这是我在实现自定义QDeclarativeItem时尝试的：

// PAINTER
void AnimatedBinding::paint(QPainter *painter, const QStyleOptionGraphicsItem *option, QWidget *widget) {
    // Setup the pen
    QPen pen(m_color, 2);
    painter->setPen(pen);
    painter->setOpacity(this->opacity());

    // Draw the item
    if (m_bindingType == QString("text")) {
        QPropertyAnimation animation(this, "opacity");
        animation.setDuration(1000);
        animation.setStartValue(1);

        if (drawn) {
            animation.setStartValue(1);
            animation.setEndValue(0);
            animation.start();
        } else drawn = true;

        painter->drawText(boundingRect(), m_data.toString());
        animation.setEndValue(0);
        animation.start();
    } else {
        qCritical() << "Error unknown binding type!";
        return;
    }
}

但就像我说的那样,我在画家中开始的动画从未实际发射过.

有小费吗？有没有人曾经这样做过？我一直在敲打这个约一个星期.

最佳答案 如何在qml中这样做：

>定义您自己类型的自定义元素,其行为方式与您希望的一样.
>使用此元素代替传统元素进行动画处理.

例如.我创建了一个自定义的’AnimatedText’类型,以便在文本元素相关的文本发生变化时,对文本元素进行淡入和淡出行为.

文件1：AnimatedText.qml

import QtQuick 1.0

Item
{
    id: topParent
    property string aText: ""
    property string aTextColor: "black"
    property int aTextFontSize: 10
    property int aTextAnimationTime : 1000

    Behavior on opacity { NumberAnimation { duration: aTextAnimationTime } }

    onATextChanged:
    {
         topParent.opacity = 0
         junkTimer.running = true
    }

    Timer
    {
       id: junkTimer
       running: false
       repeat: false
       interval: aTextAnimationTime
       onTriggered:
       {
           junkText.text = aText
           topParent.opacity = 1
       }
    }

    Text
    {
        id: junkText
        anchors.centerIn: parent
        text: ""
        font.pixelSize: aTextFontSize
        color: aTextColor
    }
}

在你的main.qml中

import QtQuick 1.0

Rectangle
{
    id: topParent
    width:  360
    height: 360

    AnimatedText
    {
      id: someText

      anchors.centerIn: parent
      aText: "Click Me to change!!!.."
      aTextFontSize: 25
      aTextColor: "green"
      aTextAnimationTime: 500
    }

    MouseArea
    {
        anchors.fill: parent
        onClicked:
        {
            someText.aText = "Some random junk"
        }
    }
}
点赞