user13846567
user13846567

Reputation: 117

How to show the content in the center in qml?

Hi there i am working on a mobile application using qml, it has different icon, buttons,labels,text etc. So i want my application to fit in every screen size. So i need to show these element on center of the device. I have used anchor.centerIn:parent but when i use this on second element, the first element gets override by the 2nd element. Here is my example

Page {
id:page
Rectangle{
    anchors.fill: parent
    color: "#8d6d89"
    Label{
        anchors.centerIn: parent
        font.pixelSize: app.titleFontSize
        font.bold: true
        wrapMode: Text.Wrap
        padding: 16*app.scaleFactor
        text: "TESTING PAGE"
    }
    Button{
        id:btn
        height: 40*scaleFactor
        width: 200*scaleFactor
        text: "CLICK HERE"
        anchors.centerIn: parent
        anchors.topMargin: 20*app.scaleFactor
    }
}

}

Upvotes: 1

Views: 365

Answers (1)

JarMan
JarMan

Reputation: 8287

Instead of this:

anchors.topMargin: 20*app.scaleFactor

Try this:

anchors.verticalCenterOffset: 20*app.scaleFactor

Upvotes: 1

Related Questions