Qin Peixi
Qin Peixi

Reputation: 165

Why Text's width/height and anchors conflict in QML?

I want to specify the width and height of a Text, so that the fontSizeMode:Text.Fit would work. But after that, the anchors of the Text would not work. How could this happen?

Rectangle {
    width: 360; height: 360
    Rectangle {
        width: parent.width / 3; height: parent.height / 6
        anchors.centerIn: parent
        border{ color: "red"; width: 5 }
        Text {
            anchors {
                centerIn: parent
//                verticalCenter: parent.verticalCenter
//                horizontalCenter: parent.horizontalCenter
            }

            width: parent.width
            height: parent.height
            font.pixelSize: 50
            fontSizeMode: Text.Fit
            text: "Hello, world!"
        }
    }
}

Upvotes: 2

Views: 3023

Answers (1)

Arpegius
Arpegius

Reputation: 5887

Well, they are working fine. But since you set width and height, centrerIn anchor do not change anything, as text is already in middle of parent. You should set alignment, to get proper effect:

Text {
    anchors.fill: parent
    font.pixelSize: 100
    fontSizeMode: Text.Fit
    horizontalAlignment: Text.AlignHCenter
    verticalAlignment: Text.AlignVCenter
    text: "Hello, world!"
}

Upvotes: 4

Related Questions