The listview spend too much time to flick



  • i use the listview to show a list of page, every page show one picture;

    right now when i drag the listview, i find it spend too much time to flick!

    how can i accelerate the flicking speed ? or need i create a custom listview (i find it too hard to do that as the listview class in qml
    can not inherit).



  • Hi tigriswind,

    I think there is a couple of things you need check:

    1. Is the picture's size is too much to be loaded
    2. If the page hold the whole screen(which width maybe equal to the mainwindow's width), make sure the clip property of listview was set be true. It can ignore your pages out of the screen/range for rendering
    3. Make sure your code is correct for the case. :D

    Br



  • thanks for your reply;

    when i change the currentIndex for listview,every thing work well. but when i use drag to slide the

    listview, the speed is slow and the render performant is bad;

    after i deep into the declarative c++ source, i find the speed is according to multiple factors ,as the drag duration, the drag distance ......



  • you can find the similar source at qt/examples/declarative/toys/corkboards in the qt example



  • Can you paste some code?



  • Rectangle {
    width: 800; height: 480

    ListModel {
        id: list
    
        ListElement {
            name: "Sunday"
            notes: [
                ListElement { noteText: "Lunch" },
                ListElement { noteText: "Birthday Party" }
            ]
        }
    ...........................
        ListElement {
            name: "Saturday"
            notes: [
                ListElement { noteText: "Drink" },
                ListElement { noteText: "Download Qt\nPlay with QML" }
            ]
        }
    }
    
    ListView {
        id: flickable
    
        anchors.fill: parent
        focus: true
        snapMode: ListView.SnapOneItem
        highlightRangeMode: ListView.StrictlyEnforceRange
        highlightMoveSpeed: 4000
        orientation: ListView.Horizontal
        model: list
        delegate: Day { }
    }
    

    }

    //in the Day.qml only show a Image
    Component {
    ................
    Image {
    source: "cork.jpg"
    width: page.ListView.view.width
    height: page.ListView.view.height
    fillMode: Image.PreserveAspectCrop
    clip: true
    }
    ........................
    }



  • Place @ at the beginning and at the end of the code block. Its very difficult to read the code..



  • sorry

    @
    Rectangle {
    width: 800; height: 480

    ListModel {
        id: list 
        ListElement { 
            name: “Sunday” 
            notes: [ 
                    ListElement { noteText: “Lunch” },
                    ListElement { noteText: “Birthday Party” }
                    ] 
        }
    
        // ..........
        ListElement { 
            name: “Saturday” 
            notes: [ 
                    ListElement { noteText: “Drink” },
                    ListElement { noteText: “Download Qt\nPlay with QML” } 
                    ] 
        }
    } 
    
    ListView {
        id: flickable 
        anchors.fill: parent 
        focus: true 
        snapMode: ListView.SnapOneItem 
        highlightRangeMode: ListView.StrictlyEnforceRange 
        highlightMoveSpeed: 4000 
        orientation: ListView.Horizontal 
        model: list 
        delegate: Day { }
    }
    

    }

    //in the Day.qml only show a Image
    Component {
    // ..........
    Image {
    source: “cork.jpg”
    width: page.ListView.view. widht
    height: page.ListView.view.height
    fillMode: Image.PreserveAspectCrop
    clip: true
    }
    // ..........
    }
    @

    EDIT:
    I reformatted the code, please wrap code sections in a single ( at the beginning of the block and one at the end, do not wrap every line. Please use correct indentation too, to increase its readability.
    Volker


Log in to reply
 

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