Loader will disturb the layout of the header of ApplicationWindow(QtQuick 2)



  • This is easier to explain by the example. Following codes work as expected

    main.qml

    import QtQuick 2.7
    import QtQuick.Controls 2.0
    import QtQuick.Layouts 1.0
    
    ApplicationWindow {
        visible: true
        width: 640
        height: 480        
    
        header: CustomToolBar{
    
        }
    }
    

    CustomToolBar.qml

    import QtQuick 2.6
    import QtQuick.Controls 2.0
    
    ToolBar {
        id : toolBar
    
        /*Loader{
            id: loader
        }//*/
    
        Row{
            spacing: 20
            anchors.fill: parent
    
            ToolButton {
                contentItem: Image {
                    fillMode: Image.PreserveAspectFit
                    horizontalAlignment: Image.AlignHCenter
                    verticalAlignment: Image.AlignVCenter
                    source: "qrc:/icons/settings.svg"
                    sourceSize.width: 40
                    width: sourceSize.width
                }            
            }
        }
    }
    

    Without the loader, the result looks good, the icon is within the Toolbar.

    no loader

    If I enable the loader, the icon will offset a little bit, this make the view looks bad

    has loader

    How could I fix this issue?Thanks



  • @tham if i'm not mistaking, the height of the header becomes smaller.
    This is about using the only element to make layout of the header.
    Try to set header height equals to row containing your toolbuttons explicitly.



  • A quote the docs:

    If only a single item is used within the ToolBar, it will resize to fit the implicit size of its contained item.
    

    If you add multiple children into ToolBar, it can no longer use the implicit size of the content, and falls back to the default height.


Log in to reply
 

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