Flickable above and below others QML types

deleted357

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?

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.

Trikrista

maybe You need to add clip: true in Flickable

deleted357

Yes, it's working now.

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

Thanks.