Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Auto-resize tabs to fit content in TabView



  • I am trying to create a TabView control with some content inside. The problem is that tab does not get re-sized to fit all the content. As the result the last label in the following example goes out from the tab border.
    @
    import QtQuick 2.1
    import QtQuick.Controls 1.1
    import QtQuick.Layouts 1.0

    ApplicationWindow {
    title: "Hello World"
    visible: true
    width: 640
    height: 480

    TabView {
        Tab {
            title: "Tab 1"            
            ColumnLayout
            {                    
                spacing: 5
                Label {text: "Label 1"}
                Label {text: "Label 2"}
                Label {text: "Label 3"}
                Label {text: "Label 4"}
                Label {text: "Label 5"}
                Label {text: "Label 6"}
            }           
        }
    }
    

    }
    @

    This is how it looks:
    !http://s18.postimg.org/3xpyaxe8p/qml_tab_view.png(Example)!

    Thanks in advance!



  • Hmmm maybe it's better to add a flickable container to the tab and add the content to the flickable container. I mean in qml a parent can change the size of the childs (anchors) but doesn't work in the other direction.



  • Yes this is indeed not a good idea. Remember that you have different content on each tab, so adjusting a tabs size to whatever is on the first tab is simply not a good idea. You can certainly hack this in place by binding size to the current tabs item but I would argue against doing this.

    You should rather just let the tab fill the parent size, and add a ScrollView in each tab if contents do not fit as dasRicardo suggested.


Log in to reply