How can i create vertical tab view in QML ?



  • hello i want to create vertical tabs view in which when user clicks it opens details regarding it and can go back too .

    for ex :
    tab1
    tab2
    tab3

    click on tab3 -> opens detail and can go back to

    how can i do it ?



  • @Qjay What do you mean by "go back"? In normal tab bar the buttons are visible all the time so you can always select another tab. If not, see the Quick Controls examples in Qt installation which have selectable and navigable vertical lists of views.

    A simple implementation in Controls 2 could use vertical ListView with Buttons as delegates. If you need more inspiration for a more complete implementation go to qml/QtQuick/Controls.2/ in your Qt installation and open TabBar.qml and TabButton.qml and see how they are implemented. I have done something similar in past but I hesitate to give the code because it's unnecessarily complicated, has more features than you would need and needs cleanup, so that it would probably be more work for you to understand it than to do it from scratch. If you really want I can give it. Or you can begin by yourself and ask for advice for details.


  • Qt Champions 2016

    or use a non-closable Drawer from QtQuickControls2 https://doc.qt.io/qt-5/qtquickcontrols2-sidepanel-example.html



  • @ekkescorner said in How can i create vertical tab view in QML ?:

    QtQuickControls2

    I have similar question too, Is that approach similar like using default tab system?
    I see this in example project, I want to create side left panel tab
    here the example, i need it vertical (top to bottom)
    0_1509879298854_jp.PNG
    I need it like this :)
    Panel |
    Tab 1 |
    Tab 2 |
    Tab 3 | Tab 3 is selected, i need something like this with vertical tab and vertical text
    Tab 4 |
    Tab 5 |


  • Qt Champions 2016

    @Niconi for vertical Tabs you need a Drawer



  • @ekkescorner thanks, but how to make it A non-interactive Drawer in landscape mode from begining? example file only make it non-interactive when the windows is in full screen (become landscape)
    in my case my window already in landscape mode from begining but it still become closable drawer


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.