ScrollView doesn't scrolling
-
Hi to everyone.
I'm trying to set a scrollview on one of my application pages to hold number of fields. Fields are been shown but scroll doesn't work. What I'm doing wrong.
My code is shown below
import QtQuick 2.9
import QtQuick.Window 2.3
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.11Page {
id: userPage
width: Screen.width / 2
height: Screen.height / 2header: Label { id: headerLabel text: "User" horizontalAlignment: Text.AlignHCenter font.pixelSize: Qt.application.font.pixelSize * 2 padding: 10 } ScrollView { id: scrollView anchors.fill: parent anchors.margins: 10 clip: true Rectangle { id: userPageContent Rectangle { id: userName width: scrollView.width height: userPage.height / 6 color: "#ee3030" anchors.top: parent.top anchors.topMargin: 10 } Rectangle { id: userSurname width: scrollView.width height: userPage.height / 6 color: "#ee3030" anchors.top: userName.bottom anchors.topMargin: 10 } Rectangle { id: userEmail width: scrollView.width height: userPage.height / 6 color: "#ee3030" anchors.top: userSurname.bottom anchors.topMargin: 10 } Rectangle { id: userBirthDate width: scrollView.width height: userPage.height / 6 color: "#ee3030" anchors.top: userEmail.bottom anchors.topMargin: 10 } Rectangle { id: userWeightHeightBmi width: scrollView.width height: userPage.height / 6 color: "#ee3030" anchors.top: userBirthDate.bottom anchors.topMargin: 10 } Rectangle { id: userPump width: scrollView.width height: userPage.height / 6 color: "#ee3030" anchors.top: userWeightHeightBmi.bottom anchors.topMargin: 10 } } }
}
-
Hi @Mitya,
You can correct your code by specifying the implicit size of your
userPageContent
element:Rectangle { id: userPageContent implicitHeight: childrenRect.height implicitWidth: childrenRect.width ... }
Note: setting the
height
andwidth
ofuserPageContent
instead does not work, you really need to set the implicit size.The reason for this is explained in:
https://doc.qt.io/qt-5.11/qml-qtquick-controls2-scrollview.html
which is the correct page if you useQuick.Controls 2.x
, since you use:import QtQuick.Controls 2.2
I suspect that you may have been looking at:
http://doc.qt.io/qt-5/qml-qtquick-controls-scrollview.html
which is for version 1.I found this so confusing when I first learned QML...
So, always check this line at the top of the doc pages:Import Statement: import QtQuick.Controls 1.4
vs
Import Statement: import QtQuick.Controls 2.4
Cheers!
-
@Diracsbracket said in ScrollView doesn't scrolling:
implicitHeight: childrenRect.height
implicitWidth: childrenRect.widthThanks a lot. That worked.