Flickable above and below others QML types



  • Hi,

    As you can see on the pictures below, the Flickable type pass above the title and below the buttons at the bottom. I don't understand why! Any idea?

    0_1498665098775_menu1.png

    0_1498665105020_menu2.png

    0_1498665108016_menu3.png

    The code:

    import QtQuick 2.9
    import QtQuick.Controls 2.2
    import QtQuick.Layouts 1.3
    
    Page {
    
        Loader {
            id: titre
            anchors {
                top: parent.top
                topMargin: 10
                left: parent.left
                leftMargin: 10
                right: parent.right
                rightMargin: 10
            }
            source: "TitreLabel.qml"
        }
    
        Flickable {
            interactive: true
            anchors {
                top: titre.bottom
                topMargin: 10
                bottom: fButtons.top
                bottomMargin: 10
                left: parent.left
                leftMargin: 10
                right: parent.right
                rightMargin: 10
            }
            boundsBehavior: Flickable.StopAtBounds
            flickableDirection: Flickable.AutoFlickDirection
            contentHeight: column.implicitHeight
    
            ColumnLayout {
                id: column
                anchors.fill: parent
                spacing: 5
                Layout.alignment: Qt.AlignHCenter
    
                Repeater {
                    id: myList
                    model: displayMenu.choixListe
    
                    Button {
                        id: button
                        anchors {
                            left: parent.left
                            leftMargin: 12
                            right: parent.right
                            rightMargin: 12
                        }
    
                        contentItem: Text {
                            text: modelData
                            font.pixelSize: 20
                            horizontalAlignment: Text.AlignHCenter
                            verticalAlignment: Text.AlignVCenter
                            elide: Text.ElideRight
                        }
    
                        background: Rectangle {
                            color: button.pressed ? "#BBBBBB" : "#D0D0D0"
                            border.color: if (index == displayMenu.indexParDefaut) { "#0A5BC4" } else { "#808080" }
                            border.width: if (index == displayMenu.indexParDefaut) { 3 } else { 1 }
                            radius: 2
                        }
    
                        onClicked: window.setButtonClicked(index + 1000, "")
                    }
                }
            }
    
            ScrollBar.vertical: ScrollBar { }
        }
    
        RowLayout {
            id: fButtons
            anchors {
                bottom: parent.bottom
                bottomMargin: 10
                horizontalCenter: parent.horizontalCenter
            }
            spacing: 10
    
            // Bouton "F1"
            Button {
                id: buttonF1
                ...
            }
        }
    }
    

    Thanks.



  • maybe You need to add clip: true in Flickable



  • Yes, it's working now.

    Flickable {
            ...
            clip: true
            boundsBehavior: Flickable.StopAtBounds
            ...
    }
    

    Thanks.



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