Results 1 to 2 of 2

Thread: How to add color to the List View Element in QML?

Threaded View

Previous Post Previous Post   Next Post Next Post
  1. #1
    Join Date
    Nov 2011
    Posts
    45
    Qt products
    Qt4
    Platforms
    Symbian S60

    Post How to add color to the List View Element in QML?

    Hi all,
    I am new to QML and i am trying an application in which there is a list view containing number of elements.

    I need to differentiate each item in the list using different colors.How to add color to the element in the list?


    Anyone help me with this?

    Here is my code:

    javascript Code:
    1. ListView {
    2. id: listview1
    3. x: 0
    4. y: 101
    5. width: 360
    6. height: 320
    7. anchors.verticalCenterOffset: 101
    8. anchors.horizontalCenterOffset: 0
    9. anchors.topMargin: 101
    10. anchors.horizontalCenter: parent.horizontalCenter
    11. anchors.verticalCenter: parent.verticalCenter
    12. anchors.top: parent.top
    13. spacing: 12
    14. flickDeceleration: 1748
    15. clip: true
    16.  
    17. header: ListHeading {
    18. ListItemText {
    19. text: "Fruits"
    20. id: text_edit2
    21. x: 100
    22. y: 303
    23. width: 182
    24. height: 34
    25. color: "blue"
    26.  
    27. font.family: "Times New Roman"
    28. font.pixelSize: 30
    29.  
    30.  
    31. anchors.fill: parent.paddingItem
    32. role: "Heading"
    33.  
    34.  
    35.  
    36. }
    37. }
    38. delegate: ListItem {
    39. id: listItem
    40. Column {
    41. anchors.fill: parent.paddingItem
    42. ListItemText {
    43. width: parent.width
    44. text: titleText
    45. color: "yellow"
    46. role: "Title"
    47. mode: listItem.mode
    48. }
    49.  
    50. }
    51. }
    52.  
    53. model: ListModel {
    54. ListElement {
    55.  
    56. titleText: "Apple"
    57.  
    58.  
    59.  
    60. }
    61.  
    62. ListElement {
    63. titleText: "Mango"
    64.  
    65.  
    66.  
    67.  
    68.  
    69. }
    70.  
    71. ListElement {
    72. titleText: "Orange"
    73.  
    74.  
    75. }
    76.  
    77. ListElement {
    78. titleText: "Grapes"
    79.  
    80.  
    81. }
    82. }
    83.  
    84. }
    To copy to clipboard, switch view to plain text mode 

    I need to change the color of the text.For example:for apple i need to use BLUE color and for Mango i need RED color and so on.

    Regards,
    Harish
    Last edited by wysota; 11th January 2012 at 11:27. Reason: missing [code] tags

Similar Threads

  1. how to access ith element of an qstring list?
    By aurora in forum Qt Programming
    Replies: 2
    Last Post: 18th October 2011, 09:37
  2. font color of list view
    By maarvi in forum Newbie
    Replies: 7
    Last Post: 8th May 2011, 16:07
  3. Replies: 9
    Last Post: 8th March 2011, 08:35
  4. List View with sections for alphabetialy sorted list
    By woodtluk in forum Qt Programming
    Replies: 4
    Last Post: 12th October 2010, 11:50
  5. Replies: 1
    Last Post: 3rd April 2010, 15:47

Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Digia, Qt and their respective logos are trademarks of Digia Plc in Finland and/or other countries worldwide.