Como converter tab menu horizontal para vertical no QML?



  • Eu quero converter um tab menu horizontal para tab menu vertical, escrevi o seguinte código:

    TabView {
               id: frame
               anchors.fill: parent
               anchors.margins: 4
               Tab { title: "Tab 1" }
               Tab { title: "Tab 2" }
               Tab { title: "Tab 3" }
    
               style: TabViewStyle {
                   frameOverlap: 1
                   tab: Rectangle {
                       color: styleData.selected ? "steelblue" :"lightsteelblue"
                       border.color:  "steelblue"
                       implicitWidth: Math.max(text.width + 4, 80)
                       implicitHeight: 20
                       radius: 2
                       Text {
                           id: text
                           anchors.centerIn: parent
                           text: styleData.title
                           color: styleData.selected ? "white" : "black"
                       }
                   }
                   frame: Rectangle { color: "steelblue" }
               }
           }
    


  • Gente, eu fiz muitas experiências mas quase nada funcionou até que encontrei este post https://evileg.com/en/post/191/ que me ajudou e eu usei para transformar o menu horizontal em vertical. abaixo tem o código que eu usei.

    Muito obrigado!

    // Layer with buttons that will change the fragments
    RowLayout {
        id: rowLayout
        anchors.top: parent.top
        anchors.left: parent.left
        anchors.leftMargin: 0
        anchors.margins: 15
    
        Button {
            id: button1
            anchors.left: rowLayout.left
            text: qsTr("Fragment 1")
            // Download the component from a file
            onClicked: loader.source = "Fragment1.qml"
        }
    
        Button {
            id: button2
            anchors.left: rowLayout.left
            anchors.top: button1.bottom
            text: qsTr("Fragment 2")
            // Loading setSource component through the method of installing the fragment parameters
            onClicked: loader.setSource("Fragment2.qml")
        }
    
        Button {
            id: button3
            anchors.left: rowLayout.left
            anchors.top: button2.bottom
    
            text: qsTr("Fragment 3")
            // Loading setSource component through the method of installing the fragment parameters
            onClicked: loader.setSource("Fragment3.qml")
        }
    
        Button {
            id: button4
            anchors.left: rowLayout.left
            anchors.top: button3.bottom
    
            text: qsTr("Fragment 4")
            // Installing a fragment from the Component
            onClicked: loader.sourceComponent = fragment4
        }
    
        Button {
            id: button5
            anchors.left: rowLayout.left
            anchors.top: button4.bottom
    
            text: qsTr("Fragment 5")
            // Installing a fragment from the Component
            onClicked: loader.sourceComponent = fragment5
        }
    }
    
    Loader {
        id: loader
        anchors.top: rowLayout.bottom
        anchors.left: parent.left
        anchors.right: parent.right
        anchors.bottom: parent.bottom
        anchors.topMargin: -40
        anchors.leftMargin: 63
        source: "Fragment1.qml" 
    }
    
    

Log in to reply