Qt 在qml中滚动屏幕左侧的视图

Qt 在qml中滚动屏幕左侧的视图,qt,listview,qml,scrollview,Qt,Listview,Qml,Scrollview,我试图将scrollview放在qml中ListView的左侧 import QtQuick 2.0 import QtQuick.Controls 1.4 Item { width: 1580 height: 687 Rectangle { anchors.fill: parent color: "Gray" } ListModel { id: phonecontactsMode

我试图将scrollview放在qml中ListView的左侧

import QtQuick 2.0
import QtQuick.Controls 1.4

Item {

    width: 1580 
    height: 687 

    Rectangle
    {
        anchors.fill: parent
        color: "Gray"
    }

    ListModel
    {
        id: phonecontactsModel

        ListElement {
            // name :firstname+" "+lastname
            firstname:"Alexander"
            lastname:"Wurz"
            contactimg: "graphics/Phone/contacts/contact_pic1.png"
            contactimgSq: ""
            phonenum:"02476 000 001"
            favstatus:0
        }

        ListElement{
            //name:firstname+" "+lastname
            firstname:"Bernie"
            lastname:"Ecclestone"
            contactimg:"graphics/Phone/contacts/contact_pic1.png"
            contactimgSq: "graphics/Phone/contacts/contact_pic1.png"
            phonenum:"02476 000 002"
            favstatus:1
        }
        ListElement{
            //name:firstname+" "+lastname
            firstname:"Bernie"
            lastname:"Ecclestone"
            contactimg:"graphics/Phone/contacts/contact_pic1.png"
            contactimgSq: "graphics/Phone/contacts/contact_pic1.png"
            phonenum:"02476 000 002"
            favstatus:1
        }
        ListElement{
            //name:firstname+" "+lastname
            firstname:"Bernie"
            lastname:"Ecclestone"
            contactimg:"graphics/Phone/contacts/contact_pic1.png"
            contactimgSq: "graphics/Phone/contacts/contact_pic1.png"
            phonenum:"02476 000 002"
            favstatus:1
        }
        ListElement{
            //name:firstname+" "+lastname
            firstname:"Bernie"
            lastname:"Ecclestone"
            contactimg:"graphics/Phone/contacts/contact_pic1.png"
            contactimgSq: "graphics/Phone/contacts/contact_pic1.png"
            phonenum:"02476 000 002"
            favstatus:1
        }
        ListElement{
            //name:firstname+" "+lastname
            firstname:"Bernie"
            lastname:"Ecclestone"
            contactimg:"graphics/Phone/contacts/contact_pic1.png"
            contactimgSq: "graphics/Phone/contacts/contact_pic1.png"
            phonenum:"02476 000 002"
            favstatus:1
        }
        ListElement{
            //name:firstname+" "+lastname
            firstname:"Bernie"
            lastname:"Ecclestone"
            contactimg:"graphics/Phone/contacts/contact_pic1.png"
            contactimgSq: "graphics/Phone/contacts/contact_pic1.png"
            phonenum:"02476 000 002"
            favstatus:1
        }
        ListElement{
            //name:firstname+" "+lastname
            firstname:"Bernie"
            lastname:"Ecclestone"
            contactimg:"graphics/Phone/contacts/contact_pic1.png"
            contactimgSq: "graphics/Phone/contacts/contact_pic1.png"
            phonenum:"02476 000 002"
            favstatus:1
        }
    }

    ScrollView {
        id: id_scrollView
        anchors.fill: parent
        objectName: "ScrollView"
        frameVisible: true
        highlightOnFocus: true
    ListView
    {
        height: parent.height
        width: parent.width
        model: phonecontactsModel
        delegate: contacts_delegate
        spacing: 6 
        anchors.left: parent.left
        anchors.leftMargin: 360 
        clip: true

    }
}


    Component
    {
        id: contacts_delegate

        Item {
            id: wrapper
            height: 150 
            width: 1080 

            Rectangle
            {
                color: "#99000000"
                height: parent.height
                width: parent.width -150
            }


            Image {
                width: parent.height
                height: parent.height
                id: contactImage
                source: contactimg
                fillMode: Image.PreserveAspectFit
                anchors.left: parent.left
            }

            Text {
                id: contactName
                text: firstname
                anchors.left: contactImage.right
                anchors.leftMargin: 70  
                color: "White"
                font.pointSize: 25  
                anchors.verticalCenter: parent.verticalCenter
            }

            Image {
                id: messageContact
                source: "graphics/Phone/messaging_icon.png"
                anchors.right: parent.right
                anchors.verticalCenter: parent.verticalCenter
            }



        }
    }
}
我无法指定scrollview的宽度或高度,也无法指定它在视图左侧的位置。如何实现这一点

我正试图创造这样的东西


如果我的猜测是正确的,您可以使用
QtQuick.Controls 2.0滚动条而不是使用滚动视图

e、 g:

您可以根据自己的喜好自定义此滚动条。

请参见此处:

这对您有用吗?我这样尝试时看不到滚动条您可能仍然会剪辑ListView,而我将滚动条放在ListView的正外部-因此您会剪辑滚动条。或者你只是不喜欢基本的风格。。。它会自动消失。是的,我现在可以看到它们了!!现在如何剪辑listview?我试着剪下滚动条?没有效果例如,您可以将整个内容包装在一个
项目中,然后进行剪辑。另一种修复剪辑的方法是,将滚动条移动到
列表视图的同级,然后只设置
滚动条。垂直:i滚动条
。然后,您应该能够将
列表视图设置为以前的剪辑方式。
ListView {
    id: lview
    anchors.right: parent.right
    width: 300
    anchors.top: parent.top
    anchors.bottom: parent.bottom
    model: 100
    delegate: Rectangle { width: 300; height: 50; border.color: 'grey' }
    spacing: 6

    ScrollBar.vertical: ScrollBar {
        anchors.right: lview.left
        width: 50
        active: true
        background: Item {
            Rectangle {
                anchors.centerIn: parent
                height: parent.height
                width: parent.width * 0.2
                color: 'grey'
                radius: width / 2
            }
        }

        contentItem: Rectangle {
            radius: width / 3
            color: 'yellow'
        }
    }
}