如何在C++中的值更改时触发动画 qml

How to trigger an animation qml when a value from C++ change?

本文关键字：qml 动画 C++      更新时间：2023-10-16

我有一个使用C++和QML的应用程序。

在我的C++中：我读取值并将其发送到QML，以便在滑块中显示它。当我按下硬件时，我的价值会发生变化。

我的问题出在QML部分：

在QML中：

当此值更改时，我需要触发动画几秒钟。我只需要在 c++ 部分的值发生变化时显示此动画。

如果有人可以帮忙？

我已经尝试了 QML 计时器，但在值更改时不显示动画？

QML部分的一些代码用于动画：

VolumeRemote.QML

Rectangle {
id: item1
width: 550
height: 110
color: "#0a0a07"
border.color: "#ffffff"
opacity: 1

SliderComponent{
    id:slider
    x: 34
    y: 79
    width: 466
    height: 5
    minimumValue: 0
   //here i give the value from C++ to my slider
   //Controller is a global Qobject where i define some stuff
    value: Controller.volume_radio
    onValueChanged: {
    animation.running=true;
 }
PropertyAnimation {
                id:myanimation
                running: true                 
                target:item1                
                property: 'visible'
                to: false                      
                duration: 10000 
                }
      }
Text {
    id: text1
    x: 93
    y: 16
    width: 170
    height: 41
    color: "#ffffff"
    text: qsTr("Radio Volume :")
    verticalAlignment: Text.AlignVCenter
    horizontalAlignment: Text.AlignHCenter
    font.pixelSize: 24
    font.family: regular.name
}
Text {
    id: valeurslider
    x: 277
    y: 16
    // x: 618
    //y: 45
    width: 24
    height: 41
    color: "#ffffff"
    text: slider.value
    verticalAlignment: Text.AlignVCenter
    horizontalAlignment: Text.AlignHCenter
    opacity: 0.45
    font.pixelSize: 30
    font.family: regular.name
}
Image {
    id: image1
    x: 34
    y: 16
    width: 44
    height: 41
    source: "assets/ic_sound_popup_on.png"
}

}

你有两个选择

本地属性及其更改信号

readonly property qreal valueFromCpp: Controller.volume_radio
onValueFromCppChanged: // trigger animation

连接元素

Connections {
    target: Controller
    onNameOfThePropertyNotifySignal:  // trigger animation
}

如果你在C++部分使用它：Q_PROPERTY（int RadioVolume READ getval NOTIFY val_signal），你必须添加一个写入函数来更改RadioVolume。塔是说：Q_PROPERTY（int RadioVolume READ getval WRITE setVal NOTIFY val_signal）和函数setVal（）中，您必须更改RadioValume变量值，并且每次值更改时都必须发出val_signal。不要直接设置值，而是在每次设置RadioVolume值时调用setVal（）函数，然后在QML部分中输入以下内容： onVal_Signal：将动画放在这里如果您对我的回答有任何疑问，请随时询问。如果您有代码，我很乐意帮助您更改它

我使用@Beloqui和第二个答案@KevinKrammar：

1 - 声明属性可见的简单动画

2 - 滑块组合并给出值：Controller.volume_radio

3 - 使用连接以获取来自C++的信号通知：音量信号

然后我可以在从 c++ 部分发出信号时触发动画

这里有一小段代码： 

import QtQuick 2.0
import QtQuick 2.0
import Controllers 1.0
import "Logic.js" as Controller_Js
   Rectangle {
    id: item1
    width: 550
    height: 110
    color: "#0a0a07"
    border.color: "#ffffff"
   opacity: 1
   visible: Controller.stateVol
SliderComponent{
    id:slider
    x: 34
    y: 79
    width: 466
    height: 5
    minimumValue: 0
    maximumValue: 100
    value: Controller.volume_radio
  NumberAnimation {
    id: animation
    target: item1
    property: "visible"
    duration: 1000
    easing.type: Easing.InOutQuad
}
//gestion du signal
Connections{
    target:commodo
    onVolumesignal:{
        if (commodo.RadioVolume !==100){
            Controller.stateVol=true
            animation.start();
            console.log("state of controller :", Controller.stateVol)
        } else if (commodo.RadioVolume>100){
            animation.stop();
             Controller.stateVol=false
            console.log("state", Controller.stateVol)
        }
      }
  }

Cobntroller.stateVol 在我的控制器中被定义为 false.qml

谢谢大家，它真的帮助了我。

相关文章：