QML Listview seleccionado resaltar punto del clic

Question

Hola Quiero poner este código:

highlight: Rectangle { 
    color: "black" 
    radius: 5 
    opacity: 0.7 
    focus: true 
} 

en mouseArea en onclick:

MouseArea { 
    id: mouse_area1 
    z: 1 
    hoverEnabled: false 
    anchors.fill: parent 
    onClicked: { 
    } 

Esto es todo Listview:

ListView { 
     id: listview1 
     x: 0 
     y: 82 
     // width: 574 
     // height: 967 
     width: window.width 
     height: window.height 
     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: 0 
     anchors.topMargin: 82 
       anchors.fill: parent 
       model: myModel 
       delegate:Component { 
        //id: contactDelegate 
        Item { 
         property variant myData: model 
         width: 574; height: 90 
         Column { 
          x: 12 
          y: 0 
          width: 562 
          height: 90 
          anchors.rightMargin: 0 
          anchors.bottomMargin: 0 
          anchors.leftMargin: 12 
          anchors.topMargin: 0 
          anchors.fill: parent 
          spacing: 2 
          Text { text: '<b>ID: </b> ' + id_user ; verticalAlignment: Text.AlignTop; wrapMode: Text.NoWrap; horizontalAlignment: Text.AlignHCenter; color:"steelblue"; font.family: "Helvetica"; font.pointSize: 10 } 
          Text { text: '<b>Name: </b> ' + user_name; horizontalAlignment: Text.AlignHCenter; color:"steelblue"; font.family: "Helvetica"; font.pointSize: 10 } 
          Text { text: '<b>Lastname: </b> ' + user_lastname; horizontalAlignment: Text.AlignHCenter; color:"steelblue"; font.family: "Helvetica"; font.pointSize: 10 } 
          Text { height: 16; text: '<b>Tel number: </b> ' + user_number; verticalAlignment: Text.AlignVCenter; horizontalAlignment: Text.AlignHCenter; color:"steelblue"; font.family: "Helvetica"; font.pointSize: 10 } 
          Text { text: '<b>Address: </b> ' + user address; horizontalAlignment: Text.AlignHCenter; color:"steelblue"; font.family: "Helvetica"; font.pointSize: 10 } 

          MouseArea { 
           id: mouse_area1 
           z: 1 
           hoverEnabled: false 
           anchors.fill: parent 
           onClicked: 
            Item 
           { 

           } 

          } 
         } 
         } 
       } 

       //delegate: contactDelegate 
       highlight: Rectangle 
       { 
        color:"black" 
        radius: 5 
        opacity: 0.7 
        focus: true 
       } 
} 

Por ahora, destacar solo funciona cuando se usan flechas, pero esta será una aplicación para Android, así que necesito tocar ese mismo efecto, y SEGUNDA pregunta s cómo leer ciertos datos del elemento seleccionado en la vista de lista? Dentro Tengo como id, nombre, apellido, número y dirección. Quiero poner esos valores en cuadros text_input.

Gracias

Answer 1

respuesta proporcionada por denoth: Es necesario añadir esta línea:

listview1.currentIndex = index 

Answer 2

ListView ofrece llamadas "attached properties", es decir, las propiedades disponibles en el delegate para la lista. Entre ellos Listview.view es una referencia a la lista en sí. Se puede usar para acceder a la propiedad currentIndex y actualizarla. Por lo tanto, para resolver su problema simplemente:

1. Uncomment //id: contactDelegate.
2. Conjunto contactDelegate.ListView.view.currentIndex = index en el OnClick controlador par.

Answer 3

más sencilla que nunca, puede utilizar: onCurrentItemChanged

ListView{ 
    id: listViewMainMenu 
    signal Myselect(int playmode) 
    onCurrentItemChanged: Myselect(listViewMainMenu.currentIndex) 
    // ... 
} 

Answer 4

Parece que necesita dos soluciones a su pregunta:

1. ¿Quieres ser capaz de establecer el elemento actual de la ListView cuando se hace clic en
2. Desea saber cuándo la selección actual cambia

El QT5 documentation dice esto acerca de ListView ratón y el manejo táctil:

Las vistas mango arrastrar y parpadeo de su contenido, sin embargo no manejan la interacción contacto con los delegados individuales. Para que los delegados reaccionen a la entrada táctil, p. para establecer el currentIndex, el delegado debe proporcionar una MouseArea con la lógica de manejo táctil adecuada.

de entrada clave va a funcionar fuera de la caja, pero usted tendrá que ponerse explícitamente el ratón/tocar evento en el delegado, y cambiar el valor ListView.currentIndex basado en el valor del elemento index delegado seleccionado.

Aquí hay un ejemplo completo:

import QtQuick 2.4 
import QtQuick.Window 2.2 

Window { 
    width: 640 
    height: 480 
    visible: true 

    ListModel { 
     id: model 
     ListElement { 
      name:'abc' 
      number:'123' 
     } 
     ListElement { 
      name:'efg' 
      number:'456' 
     } 
     ListElement { 
      name:'xyz' 
      number:'789' 
     } 
    } 

    ListView { 
     id: list 
     anchors.fill: parent 
     model: model 
     delegate: Component { 
      Item { 
       width: parent.width 
       height: 40 
       Column { 
        Text { text: 'Name:' + name } 
        Text { text: 'Number:' + number } 
       } 
       MouseArea { 
        anchors.fill: parent 
        onClicked: list.currentIndex = index 
       } 
      } 
     } 
     highlight: Rectangle { 
      color: 'grey' 
      Text { 
       anchors.centerIn: parent 
       text: 'Hello ' + model.get(list.currentIndex).name 
       color: 'white' 
      } 
     } 
     focus: true 
     onCurrentItemChanged: console.log(model.get(list.currentIndex).name + ' selected') 
    } 
} 

realiza las siguientes cosas:

• crea una lista y modelo simple
• utiliza un elemento MouseArea dentro del delegado elemento para actualizar el conjunto de la list.currentIndex = index que es una var local y única para el elemento seleccionado
• escucha el evento onCurrentItemChanged del ListView para mostrar cómo acceder a los valores de la opción actual modelo
• se une el valor de texto del elemento actualmente seleccionado en el ítem destacado para mostrar el uso de los valores seleccionados en ese momento en otro lugar

Answer 5

Para aquellos que utilizan destacando en un ListView con una altura específica (es decir: no está lleno al 100%):

Asegúrese de habilitar la propiedad clip de ListView, de lo contrario, el resaltado seguirá siendo visible fuera de los bordes de ListView mientras se desplaza.

ListView 
{ 
    clip: true  
} 

Como se discutió aquí: Hide the highlight of a ListView while scrolling