Problems when using a Rectangle and a Text

tomy

Hi all,

I don't know why the text here isn't shown on the rectangle:

MyButton.qml:

import QtQuick 2.9

Item {
  property string text: myText.text

    Rectangle {
       width: 70; height: 25
       color: "lightsteelblue"
     }

    Text {
        id: myText
        width: 40; height: 20
        anchors.centerIn: parent
        color: "blue"
        font.bold: true
        font.pixelSize: 15
    }
}

main.qml:

import QtQuick 2.9
import QtQuick.Window 2.2

Window {
    visible: true
    width: 600
    height: 500
    title: qsTr("QML Test")
    color: "silver"

    Rectangle {
        id: container
        width: 400; height: 300
        color: "cadetblue"

        MyButton {
            id: start
            text: "START"
            x: 200
            y: 100
        }
    }
}

The problem might be very subtle but at this moment I can't find it! :(

I also used this version of Mybutton:

import QtQuick 2.9

 Rectangle {
    width: 70; height: 25
    color: "lightsteelblue"  
    property string text: myText.text

    Text {
        id: myText
        width: 40; height: 20
        anchors.centerIn: parent
        color: "blue"
        font.bold: true
        font.pixelSize: 15
    }
}

But no change in the result!
Also tried: Clean All, Run qmake, Rebuild all
:(

mostefa

@tomy said in Problems when using a Rectangle and a Text:

property string text: myText.text

Hi @tomy

What if you change this line

property string text: myText.text

to

property string text

And the content of myButton to something like this :

MyButton {
          id: start
          Component.onCompleted:
          {
              start.text = "start"
          }

          x: 200
          y: 100
      }

Also your Text element must look to something like this:

```

Text {
        id: myText
        text: root.text
        anchors.centerIn: parent
        color: "white"
        font.bold: true
        font.pixelSize: 15
    }

Have a look at this link

tomy

@mostefa

property string text
Text {
        id: myText
        text: root.text
        anchors.centerIn: parent
        color: "white"
        font.bold: true
        font.pixelSize: 15
    }

I used it. Thanks.
I can't mark your answer as the correct answer. I hope some moderator with top privileges does it.