Pathview Issue in QML

Question

I'm designing the Spinner control (or You can Scollable list of items). Its working fine as far as the functionality is concerned

The main issue is the i want to create a circular motion feel in scrolling the items. So to give that effect in the scrolling list we decided to have preceding & trailing item size comparatively small than current item

I'm really struggling to get the different size of the items. Can any one suggest me how to proceed with the same.

Below is my code snippet

ContentModel.qml

import QtQuick 1.1

Rectangle {
    property alias model: view.model
    property alias delegate: view.delegate
    property real itemHeight: height/5

    clip: true

    PathView {
        id: view
        anchors.fill: parent
        //number of items visible on the path at any one time.
        pathItemCount: height/itemHeight
        // Ensuring the selected componenet to be at the center
        preferredHighlightBegin: 0.5
        preferredHighlightEnd: 0.5

        // select maximum distance from the path that initiate mouse dragging
        dragMargin: view.width


        //Declare the path of list
        path: Path {
            startX: view.width/2; startY: -itemHeight/2
            PathLine { x: view.width/2; y: view.pathItemCount*itemHeight + itemHeight/.8}
        }
    }
}

The main.qml snippet

main.qml

.......
ContentModel{
      id: ContentModel_spinner
      width: ContentModel_scroll.width; height: ContentModel_scroll.height
      focus: true
      model: 20
      delegate: Text { font.pixelSize: index === ContentModel_spinner.currentIndex  ?  sec_spinner.height/4 : ContentModel_spinner.height/4.5; text: formatindex(index); height: ContentModel_scroll.height }
            }

Amit Tomar Amit Tomar · Accepted Answer · 2012-11-27T05:25:49

3

votes

Check the tutorial here. They have given examples with different shapes of path views.

Pathview Issue in QML

1 Answers