Question

我正试图获得一个显示的数字，以在单击按钮时进行更改。我该怎么办？

这是我的QML代码

Button {
   id:button
   x:232
   y:250
   width:18
   height:18
   // Makes button have a transparent background
   palette {
   button: "transparent"
   }

   Image {
     anchors.fill: Button
     source:"Images/image.png"

     }
     // Moves rectangle down, on button click
     onClicked: rectangle.y-=10

     }

     Text{
      text: qsTr("12.0")
     }

我希望每次单击按钮时数字12都会增加

Answer 1

您必须声明一个{int}类型的property，对于Text和Button项均可见。

因此示例代码可以是：

import QtQuick 2.0
import QtQuick.Controls 2.0

Window {
   id: rootWindow
   visible: true
   width: 300; height: 300

   property int displayValue: 12

   Text {
      id: displayTextId
      anchors.left: addOneButtonId.right

      text: displayValue.toString() //more clear if you explicit the parent rootWindow.displayValue.toString()
   }

   Button {
      id: addOneButtonId

      text: "Add 1"
      onClicked: {
         rootWindow.displayValue += 1
      }
   }
}

或者，可以将属性声明为Text元素的局部变量（在其内部定义），但是请注意，因为属性仅对其子代可见。

顺便说一句，您的代码充满了错误。如果要创建一个包含图像和文本的按钮，最好的方法是创建一个Rectangle对象并在其中定义一个Mouse area。

代码结构应类似于：

Rectangle {
   id: root
   property int number: 12

   width: 100; height: 50
   color: "transparent"
   border.width: 1
   border.color: "black"

   Image { id: imageId }
   Text { id: textId; text: root.number.toString()  }

   MouseArea {
      anchors.fill: parent

      onClicked: {
         root.y += 10 // shift the y position down
         root.number += 1
      }
   }
}

单击按钮时，增加显示的数字qt qml

1 个答案: