0

我是 QML 和 QT 的新手,所以如果这个问题对你们中的大多数人来说听起来很愚蠢,请不要怪我,但我在互联网上进行了搜索,但没有任何运气找到答案。


我正在尝试做的事情:

我有 a ScrollViewwhich 里面有 aScrollBar和 a ListView

我希望在滚动 ListView 元素的那一刻也能将栏从ScrollBar. 换句话说,我想用它ScrollBar作为你当前位置的整体视图,你不应该触摸它,它的唯一目的是为了查看。


我的代码:

   ScrollView{
        implicitHeight: 100
        implicitWidth: 50
        anchors.fill: parent
        ScrollBar.horizontal: ScrollBar{
            id: hbar
            active: true
            policy: ScrollBar.AlwaysOn
            anchors {
                    left: parent.left
                    top: parent.top
                    right: parent.right
            }

            background: Rectangle {
                implicitWidth: 100
                implicitHeight: 50
                opacity: enabled ? 1 : 0.3
                color: hbar.down ? "#red" : "black"
            }
            contentItem: Rectangle {
                implicitWidth: 6
                implicitHeight: 100
                radius: width / 2
                color: hbar.pressed ? "#81e889" : "#c2f4c6"
            }

        }
        ListView {
            id: listViewParent
            height: listViewID.height/10*6

            contentHeight: height*2
            contentWidth: width*2

            clip: false
            interactive: false
            keyNavigationWraps: true
            anchors.right: parent.right
            anchors.rightMargin: 0
            anchors.left: parent.left
            anchors.leftMargin: 0
            enabled: true
            scale: 1
            transformOrigin: Item.Center
            anchors.verticalCenter: parent.verticalCenter
            boundsBehavior: Flickable.DragAndOvershootBounds
            flickableDirection: Flickable.HorizontalFlick
            highlightMoveDuration: 0
            cacheBuffer: 300
            snapMode: ListView.SnapToItem
            layoutDirection: Qt.LeftToRight
            orientation: ListView.Vertical
            model: 1

            delegate:
                ListView {

                width: parent.width;
                height: parent.height;
                spacing: listViewID.width/8/9
                model: MovieListModel {}
                orientation: ListView.Horizontal
                id: listid
                delegate:
                    Rectangle {
                    property int recDynamicHeight: listViewID.height/10*6
                    property int recOriginalHeight: listViewID.height/10*6
                    property int recDynamiclWidth: listViewID.width/7
                    property int recOriginalWidth: listViewID.width/7
                    id: rectPer
                    width: recDynamiclWidth
                    height: recDynamicHeight

                    Image {
                        id: image1
                        anchors.fill: parent;
                        source: model.imgUrl
                    }
                    Text {
                        property bool isVisible: false
                        color: "#ffffff"
                        anchors.fill: parent
                        visible: textid.isVisible
                        id: textid
                        text: model.title
                        font.bold: true
                        horizontalAlignment: Text.AlignLeft
                        font.pixelSize: listViewID.width/8/9
                        topPadding: listViewID.width/8/9
                        leftPadding: listViewID.width/8/9
                    }
                    Text {
                        anchors.topMargin: listViewID.width/8/9
                        color: "#ffffff"
                        anchors.fill: parent
                        visible: textid.isVisible
                        id: yearId
                        text: model.year
                        horizontalAlignment: Text.AlignLeft
                        font.pixelSize: listViewID.width/8/9
                        topPadding: listViewID.width/8/9*2
                        leftPadding: listViewID.width/8/9
                    }

                    MouseArea {
                        anchors.fill: parent
                        onPressed: {
                            rectPer.recDynamicHeight = rectPer.recOriginalHeight;
                            rectPer.recDynamicHeight += rectPer.recOriginalHeight/10;
                            rectPer.recDynamiclWidth += rectPer.recOriginalWidth/10;
                            console.log(textid.isVisible);
                            textid.isVisible = true;
                            textid.visible = textid.isVisible;
                            console.log(sideButtonID.x);
                            console.log(sideButtonID.y);
                            console.log(model.year + " clicked");
                        }
                        onClicked: {
                            console.log("INDEX: " + model.id)
                            load_page(PageType.movie_detailed_view, model.title, model.description, model.imgUrl, model.type, model.year)
                        }
                        onReleased: {
                            rectPer.recDynamicHeight = rectPer.recOriginalHeight;
                            rectPer.recDynamiclWidth = rectPer.recOriginalWidth;
                            textid.isVisible = false;
                            textid.visible = textid.isVisible;
                        }
                    }
                }
            }
        }
    }

布局:

在此处输入图像描述


4

1 回答 1

0

您可以尝试使用 aFlickable而不是 aScrollView并在那里生成 a ListView(代表:矩形)。然后,在Scrollbar内部生成ListView

于 2020-04-11T11:27:51.820 回答