矩形内的Qml动画不起作用答案

【问题标题】：Qml Animation inside Rectangle not working矩形内的Qml动画不起作用
【发布时间】：2022-01-22 18:40:29
【问题描述】：

第一个动画有效而第二个无效的问题。在第一种情况下，整个矩形是动画的，这是不希望的，我只需要为标签设置动画，但是向标签添加动画并没有带来任何效果。您知道第二个动画没有动画的问题是什么吗？

第一：

import QtQuick 2.12
import QtQuick.Layouts 1.12
import QtQuick.Controls 2.12
import QtQml.Models 2.12

Rectangle{
    property alias text: label.text
    clip: true
    NumberAnimation on x {
            id: animation
            from: 100.0
            to: -100.0
            duration: 500
            running: true//label.text.length > 25
            loops: Animation.Infinite
        }
    Label {
        anchors.fill : parent
        horizontalAlignment: Text.AlignHCenter;
        verticalAlignment: Text.AlignVCenter;
        id: label
    }
}

第二：

import QtQuick 2.12
import QtQuick.Layouts 1.12
import QtQuick.Controls 2.12
import QtQml.Models 2.12

Rectangle{
    property alias text: label.text
    clip: true

    Label {
        anchors.fill : parent
        horizontalAlignment: Text.AlignHCenter;
        verticalAlignment: Text.AlignVCenter;
        id: label

        NumberAnimation on x {
            id: animation
            from: 100.0
            to: -100.0
            duration: 500
            running: true//label.text.length > 25
            loops: Animation.Infinite
        }

    }
}

【问题讨论】：

标签： qt animation qml

【解决方案1】：

我在你的第二个动画中发现了两个问题。

你的矩形应该有 width 和 height 或 anchor.fill: parent
您应该删除标签 anchor.fill: parent 以允许更改 x

查看我的代码。它现在正在工作：

import QtQuick 2.12
import QtQuick.Controls 2.12

Rectangle{
    property alias text: label.text
    clip: true
    anchors.fill: parent


    Label {
        horizontalAlignment: Text.AlignHCenter;
        verticalAlignment: Text.AlignVCenter;
        id: label
        Text {
            id: name
            text: qsTr("text")
            color: "black"
        }

        NumberAnimation on x {
            id: animation
            from: 100.0
            to: -100.0
            duration: 500
            running: true//label.text.length > 25
            loops: Animation.Infinite
        }

    }
}

【讨论】：