QML问题PathView在中心位置

时间:2018-06-21 08:46:58

标签: qt qml

我正在尝试制作PathView。目前,除了一个细节之外,它的效果还不错。 当我通过拖动移动PathView并将其停止时,它可以在任何位置停止。这使它没有居中对齐。

以下是错误行为的示例:

Wrong behaviour

我期望得到这样的结果:(我大部分时间都得到了这个结果,但是我只是想避免上面描述的行为)

Excpectations

我尝试使用snapMode属性,但未进行任何更改。 这是PathView的代码:

Rectangle {

id: container
width: 100
height: 200

Rectangle{
    anchors.centerIn: parent
    anchors.verticalCenterOffset: (container.height / 10)
    width: parent.width/2
    height: 2
    color: "black"
}

Rectangle{
    anchors.centerIn: parent
    anchors.verticalCenterOffset: -(container.height / 10)
    width: parent.width/2
    height: 2
    color: "black"
}

ListModel {
    id: tumblerModel
    ListElement{ num:"01" }
    ListElement{ num:"02" }
    ListElement{ num:"03" }
    ListElement{ num:"04" }
    ListElement{ num:"05" }
    ListElement{ num:"06" }
    ListElement{ num:"07" }
    ListElement{ num:"08" }
    ListElement{ num:"09" }
    ListElement{ num:"10" }
}

Component {
    id: tumblerDelegate

    Item {
        id: itm
        anchors.left: parent.left
        anchors.right: parent.right
        height: parent.height/5
        scale: PathView.iconScale
        opacity: PathView.iconOpacity

        Text {
            text: num;
            color: itm.PathView.isCurrentItem ? "red" : "black"
            font.pointSize: 12
            anchors.centerIn: parent
            //opacity: active ? 1 : 0.3
        }
        MouseArea{
            id: itemMouseArea
            anchors.fill: parent
            onClicked: {
                pathView.currentIndex = index

            }
        }
    }
}

PathView {
    id: pathView
    anchors.fill: parent
    model: tumblerModel
    pathItemCount: 5
    preferredHighlightBegin: 0.5
    preferredHighlightEnd: 0.5
    highlightRangeMode: PathView.StrictlyEnforceRange
    delegate: tumblerDelegate
    path: Path {
        startX: parent.width/2; startY: 0
        PathAttribute { name: "iconScale"; value: 0.7 }
        PathAttribute { name: "iconOpacity"; value: 0.2 }
        PathLine {x: parent.width/2; y: container.height/2 }
        PathAttribute { name: "iconScale"; value: 2 }
        PathAttribute { name: "iconOpacity"; value: 1 }
        PathLine {x: parent.width/2; y: container.height }
    }
    onDragEnded: {
        console.log("DragEnd")
        positionViewAtIndex(pathView.currentIndex, PathView.Center)
    }

}

} 有人知道我该如何迫使该物品居中?

编辑:您将找到整个玻璃杯组件。

0 个答案:

没有答案