QML listview读取当前和触摸区域
问题描述:
我有这个问题。我有我从QT代码填充的listview,但我想列表视图是可触摸的,所以当我点击我实际上可以选择某些项目。现在我可以用箭头上下导航,但是当我将它移植到Android时,它不起作用。我试图添加鼠标区域,但我无法使它与listview一起工作。所以这是问题1,第二个问题是关于获取选定的项目。所以当我点击列表中的特定项目时,我想从中读取数据。QML listview读取当前和触摸区域
以下是一段我的代码,如果你需要更多的只是让我知道:
ListView {
id: listview1
x: 0
y: 82
width: 395
height: 942
visible: true
keyNavigationWraps: false
boundsBehavior: Flickable.DragAndOvershootBounds
opacity: 1
maximumFlickVelocity: 2500
anchors.leftMargin: 0
highlightMoveSpeed: 489
contentWidth: 0
preferredHighlightEnd: 2
spacing: 5
highlightRangeMode: ListView.NoHighlightRange
snapMode: ListView.SnapToItem
anchors.bottomMargin: 0
anchors.rightMargin: 179
anchors.topMargin: 82
anchors.fill: parent
model: myModel
delegate:Component {
// id: contactDelegate
Item {
property variant myData: model
width: 450; height: 90
Column {
Text { text: '<b>ID: </b> ' + id_korisnika ; color:"steelblue"; font.family: "Helvetica"; font.pointSize: 8 }
Text { text: '<b>Ime: </b> ' + ime_korisnika ; color:"steelblue"; font.family: "Helvetica"; font.pointSize: 8 }
Text { text: '<b>Prezime: </b> ' + prezime_korisnika; color:"steelblue"; font.family: "Helvetica"; font.pointSize: 8 }
Text { text: '<b>Broj telefona: </b> ' + broj_korisnika ; color:"steelblue"; font.family: "Helvetica"; font.pointSize: 8 }
Text { text: '<b>Adresa: </b> ' + adresa_korisnika ; color:"steelblue"; font.family: "Helvetica"; font.pointSize: 8 }
}
}
}
// delegate: contactDelegate
highlight: Rectangle {color:"black"; radius: 5; opacity: 0.7 }
focus: true
}
BorderImage {
id: border_image1
x: 0
y: 0
width: 501
height: 81
source: "slike/naslov.png"
MouseArea {
id: mouse_area1
x: 0
y: 81
anchors.fill: parent
}
}
Rectangle {
id: rectangle1
x: 395
y: 82
width: 100
height: 718
gradient: Gradient {
GradientStop {
position: 0
color: "#f3eeee"
}
GradientStop {
position: 1
color: "#621717"
}
}
Image {
id: image1
x: 2
y: 314
width: 100
height: 100
source: "slike/Button-Next-icon.png"
}
}
//dodaj korisnika
Flipable {
id: flipable
x: 401
y: 98
width: 87
height: 70
property bool flipped: false
front: Image { x: 0; y: 0; width: 60; height: 58; source: "slike/dodaj_korisnika.png"; anchors.centerIn: parent }
back: Image { x: 0; y: 0; width: 60; height: 58; source: "slike/accept.png"; anchors.centerIn: parent }
transform: Rotation {
id: rotation
origin.x: flipable.width/2
origin.y: flipable.height/2
axis.x: 1; axis.y: 0; axis.z: 0 // set axis.y to 1 to rotate around y-axis
angle: 0 // the default angle
}
states: State {
name: "back"
PropertyChanges { target: rotation; angle: 180 }
when: flipable.flipped
}
transitions: Transition {
NumberAnimation { target: rotation; property: "angle"; duration: 500 }
}
MouseArea {
x: 7
y: 9
width: 73
height: 76
anchors.rightMargin: 7
anchors.leftMargin: 7
anchors.topMargin: 9
anchors.bottomMargin: 9
hoverEnabled: false
anchors.fill: parent
onClicked: {
if(Varijabla.unos_korisnika==1)
{ window.state == 'State1' ? window.state = "" : window.state = 'State1'; flipable.flipped = !flipable.flipped; Varijabla.povecaj() }
else if(Varijabla.unos_korisnika==2)
{
window.state == "" ? window.state = 'State1' : window.state = ""; flipable.flipped = !flipable.flipped; Varijabla.reset();
funkcije.dodaj_korisnika(text_input1.text,text_input2.text,text_input3.text,text_input4.text);
}
}
}
这些都是可用的文本变量:
TextInput {
id: text_input1
x: 59
y: 131
width: 80
height: 20
font.pixelSize: 12
opacity: 0
}
TextInput {
id: text_input3
x: 59
y: 246
width: 80
height: 20
font.pixelSize: 12
opacity: 0
}
TextInput {
id: text_input4
x: 59
y: 305
width: 80
height: 20
font.pixelSize: 12
opacity: 0
}
TextInput {
id: text_input2
x: 59
y: 190
width: 80
height: 20
font.pixelSize
: 12
opacity: 0
}
答
鼠标区域内的代表应该工作得很好,申报信号在ListView中并从委托/ MouseArea发出。您可以发出任意的数据,但在大多数情况下,模型指标是不够的:
ListView {
signal itemSelected(int index)
delegate: Rectangle {
MouseArea {
anchors.fill: parent
onClicked: itemSelected(model.index)
}
}
}
我怎样才能把它放在我的代码?我的鼠标区应该在我的项目区域的列表视图?你能告诉我如何填写数据例如。 text_input1与选择的项目?我的意思是你给我展示了一个很好的例子,但是你可以在上面的例子中展示给我看吗? – 2012-02-21 12:56:40
可以连接'list1.itemSelected.connect(fillTextInput1)''中Component.onCompleted',其中'函数fillTextInput1(指数)'是预示了'text_input1.text = list1.model.get(指数).name'。或者你可以把你的代码放在'ListView {onItemSelected:{...}}'中 – sergk 2012-02-23 10:45:23