How to design Page layout for portrait and landscape?

strekazoid

I have a Page element, which contains the view. Page was originally locked to the portrait screen mode. Now I need to add support for landscape as well. How do I design a Page layout for both portrait and landscape? Ideally I need a custom placement for every element for both screen modes.

strekazoid

Ok, after some research I came up with this solution:

@Page {
id: mainPage
anchors.fill: parent

onWidthChanged: {
    if(width > height) {
        // Landscape mode
        mainPage.state = "Landscape"
    }
    else {
        // Portrait mode
        mainPage.state = "Portrait"
    }
}@