ListView-Modell-Funktion

Question

Ich bin gerade in Qt gestartet, und versuchen, Funktion zu machen, die ListView Modell-Elemente funktioniert.

Ich habe benutzerdefinierte Schaltfläche gemacht in "myButton.qml", die Zustände wie "normal", "gedrückt", "ausgewählt" hat usw.

ListView ist in "main.qml". Struktur ist wie folgt:

ListView{ 
    //... 

    model: nameModel 

    delegate: myButton { 
     //... 
    } 

} 

So, hier ist mein Ziel: diese Liste der Schaltflächen wie Gruppe von Radiobuttons handeln sollte - nur kann man haben ausgewählten Zustand und ausgewählten Zustand ist, wenn Sie drücken. Ich denke, dass ich Click-Handler und eine Funktion haben sollte, die auf Knopf klicken klickt. Die Funktion sollte die Liste der Tasten prüfen und wenn eine Taste ausgewählt wurde, bevor die Funktion ihren Zustand auf "Normal" ändert.

Also ich habe keine Ahnung, wie man diese Funktion schreibt und wo sollte ich es platzieren. Ich lese Qt Docs aber immer noch keine Ahnung.

Answer 1

Eine mögliche einfache Möglichkeit, dieses Problem zu lösen, ist die Ausnutzung von ExclusiveGroup. Wie in den documentation diskutiert, Unterstützung für diese Art kann jeden Typ hinzugefügt:

Es ist möglich, die Unterstützung für ExclusiveGroup für ein Objekt oder Steuerung hinzuzufügen. Es sollte eine Eigenschaft überprüft und entweder eine CheckedChanged, getoggelt() oder getoggelt (bool) Signal. Es muss auch sein, gebunden an ExclusiveGroup :: bindCheckable(), wenn die Eigenschaft ExclusiveGroup typed gesetzt ist.

Sie können eine ExclusiveGroup am ListView Ebene definieren und die erforderliche Logik in der ListView delegieren implementieren. Durch die Bindung der Delegierten ExclusiveGroup Eigenschaft an die ExclusiveGroup der ListView sollten Sie erreichen, was Sie wollen, ohne die Notwendigkeit einer Funktion, die das Modell kriecht.

Abschluss Spielzeug Beispiel die Verwendung zu demonstrieren:

import QtQuick 2.5 
import QtQuick.Window 2.2 
import QtQuick.Controls 1.4 


Window { 
    id: root 
    visible: true 
    width: 200 
    height: 500 

    ListView { 
     anchors.fill: parent 
     model: 10 
     spacing: 20 
     ExclusiveGroup { id: ex } // the group for all the delegate 

     delegate: Rectangle { 
      id: delegate 
      width: ListView.view.width 
      height: 30 
      color: checked ? "yellow" : "steelblue" 

      // code to have exclusive behaviour 
      property bool checked: false 
      property ExclusiveGroup exclusiveGroup: ex 

      onExclusiveGroupChanged: { 
       if (exclusiveGroup) 
        exclusiveGroup.bindCheckable(delegate) 
      } 

      // mouse area to trigger the property change 
      MouseArea { 
       anchors.fill: parent 
       onClicked: checked = true 
      } 
     } 
    } 
}