User Tools

Site Tools


qt-quick-for-designers-1:all_about_lists

This is an old revision of the document!


All about lists

  • What is a model?
  • Models in QtQuick
  • ListView
  • GridView
  • Creating a model dynamically

Models in QtQuick

  • A model is the description of all data about a single item (a.k.a. record):
    • Name
    • Surname
    • Telephone Number
    • Favorite
    • Icon
  • Individual records are expressed ListElements.
  • The ListModel element is an array of ListElements.
ListModelExample.qml
import QtQuick 1.0
 
ListModel {
     id: listModel
 
     ListElement {
         picture: "images/user_1.png"
         name: "Adriel"
         surname: "Nunes Teles"
         telephone: "+1 347 715 3354"
         favorite: true
         icon: "sms"
     }
     ListElement {
         picture: "images/user_2.png"
         name: "Alex"
         surname: "Beek"
         telephone: "+44 79 3982 8778"
         favorite: false
         icon: "gps"
     }
     ListElement {
         picture: "images/no_user.png"
         name: "Alexandre"
         surname: "da Rocha Lins"
         telephone: "+1 718 249 7283"
         favorite: false
         icon: ""
     }
     ListElement {
         picture: "images/user_3.png"
         name: "Alexandre"
         surname: "Tonin"
         telephone: "+55 81 8608 3920"
         favorite: false
         icon: ""
     }
     ListElement {
         picture: "images/user_4.png"
         name: "Benjamin"
         surname: "Abbott"
         telephone: "+55 11 3962 8776"
         favorite: true
         icon: "sms"
     }
     ListElement {
         picture: "images/no_user.png"
         name: "Biln"
         surname: "Smith"
         telephone: "+32 178 8608 3920"
         favorite: false
         icon: "sms"
     }
     ListElement {
         picture: "images/no_user.png"
         name: "Brian"
         surname: "Morris"
         telephone: "+1 718 249 7283"
         favorite: false
         icon: ""
     }
     ListElement {
         picture: "images/user_5.png"
         name: "Biln"
         surname: "Smith"
         telephone: "+32 178 8608 3920"
         favorite: false
         icon: "gps"
     }
     ListElement {
         picture: "images/user_6.png"
         name: "Bruno"
         surname: "Costa"
         telephone: "+55 11 8608 3920"
         favorite: true
         icon: "sms"
     }
     ListElement {
         picture: "images/user_7.png"
         name: "John"
         surname: "Appleseed"
         telephone: "+55 81 8608 3920"
         favorite: false
         icon: ""
     }
     ListElement {
         picture: "images/no_user.png"
         name: "Brian"
         surname: "Morris"
         telephone: "+1 718 249 7283"
         favorite: false
         icon: ""
     }
     ListElement {
         picture: "images/no_user.png"
         name: "Alexandre"
         surname: "Tonin"
         telephone: "+55 81 8608 3920"
         favorite: false
         icon: ""
     }
     ListElement {
         picture: "images/user_8.png"
         name: "Bruno"
         surname: "Costa"
         telephone: "+55 11 8608 3920"
         favorite: true
         icon: "sms"
     }
     ListElement {
         picture: "images/user_9.png"
         name: "John"
         surname: "Appleseed"
         telephone: "+55 81 8608 3920"
         favorite: false
         icon: ""
     }
     ListElement {
         picture: "images/no_user.png"
         name: "Brian"
         surname: "Morris"
         telephone: "+1 718 249 7283"
         favorite: false
         icon: ""
     }
 }

Model views

ListView

GridView

Javascript and ListModel

Animating list items

qt-quick-for-designers-1/all_about_lists.1372479999.txt.gz · Last modified: 2013/06/29 04:26 by mithat

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki