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) 
     } 
    } 
} 
+0

我怎样才能把它放在我的代码?我的鼠标区应该在我的项目区域的列表视图?你能告诉我如何填写数据例如。 text_input1与选择的项目?我的意思是你给我展示了一个很好的例子,但是你可以在上面的例子中展示给我看吗? – 2012-02-21 12:56:40

+0

可以连接'list1.itemSelected.connect(fillTextInput1)''中Component.onCompleted',其中'函数fillTextInput1(指数)'是预示了'text_input1.text = list1.model.get(指数).name'。或者你可以把你的代码放在'ListView {onItemSelected:{...}}'中 – sergk 2012-02-23 10:45:23