我正在尝试制作PathView。目前,除了一个细节之外,它的效果还不错。 当我通过拖动移动PathView并将其停止时,它可以在任何位置停止。这使它没有居中对齐。
以下是错误行为的示例:
我期望得到这样的结果:(我大部分时间都得到了这个结果,但是我只是想避免上面描述的行为)
我尝试使用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)
}
}
} 有人知道我该如何迫使该物品居中?
编辑:您将找到整个玻璃杯组件。