qml

Text type alignment


I have a QML element as follows:

Rectangle {
    x: 0
    y: 0
    width: rightDrawer.width
    height: 35
    color: "#35FE45"
    Text {
        text: "Settings"
        font.pixelSize: 19
        font.family: "AvantGarde-Medium"
        color: "#ffffff"
        smooth: true
        verticalAlignment: Text.AlignVCenter
    }
}

Here, despite me specifying the vertical alignment as align vertical centre, it still shows the text aligned to the top of the rectangle (see attached figure). I would like to align it to the vertical centre.

enter image description here


Solution

  • Add

    anchors.verticalCenter: parent.verticalCenter 
    anchors.left: parent.left
    

    or

    anchors.fill: parent
    

    or

    anchors.top: parent.top
    anchors.bottom: parent.bottom
    anchors.left: parent.left
    

    to you Text.

    It aligns it right, but your Text item itself is in the top left corner of its parent.