Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. How to select a item(ex.image) in listview and display it in a new page?
Forum Updated to NodeBB v4.3 + New Features

How to select a item(ex.image) in listview and display it in a new page?

Scheduled Pinned Locked Moved QML and Qt Quick
12 Posts 2 Posters 7.8k Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • N Offline
    N Offline
    Naufal
    wrote on last edited by
    #3

    Hi,
    I had displayed my code which you have asked me to add!! But, I am getting errors.as
    Invalid property assignment: unsupported type "UserType"

    @ ListView {
    id: listview1
    x: 0
    y: 0
    width: 360
    height: 640
    clip: true
    header: ListHeading {
    ListItemText {
    text: "ListHeading"
    anchors.fill: parent.paddingItem
    role: "Heading"
    }
    }
    delegate: ListItem {
    id: listItem
    ListItem {
    onClicked: {
    mainPage.pageStack.push( Qt.resolvedUrl( "hi.qml" ), { "model" : mode , "index" : index } )
    }
    }

            Column {
                anchors.fill: parent.paddingItem
                ListItemText {
                    width: parent.width
                    Text {
                        x: 100
                        y: 5
                        color: blue
                        text: titleText
                    }
                    Image {
                        id:li
                        x: 0
                        y: 5
                        width: 50
                        height: 50
                        source: model.red
                    }
                }
            }
        }
        model:
             id:mode
            ListModel {
            ListElement {
                titleText: "jellyfish"
                blue: "white"
                red: "jellyfish.JPG"
    
    
            }
    
            ListElement {
                titleText: "Koala"
                blue: "white"
                red: "Koala.JPG"
            }
    
            ListElement {
                titleText: "Lighthouse"
                blue: "white"
                red: "Lighthouse.JPG"
            }
    
            ListElement {
                titleText: "Penguins"
                blue: "white"
                red: "Penguins.JPG"
            }
    
            ListElement {
                titleText: "Tulips"
                blue: "white"
                red: "Tulips.JPG"
            }
        }
    }
    

    } @

    Thanks if you find me a solution!

    Regards,
    Naufal.A

    1 Reply Last reply
    0
    • N Offline
      N Offline
      Naufal
      wrote on last edited by
      #4

      Hi,
      I can able to send the call to next page.. but i am having trouble in this part..

      { "model" = yourModelId, "index" = index } )

      where it says: Error: Cannot assign to non-existent property "model"

      Regards,
      Naufal.A

      1 Reply Last reply
      0
      • T Offline
        T Offline
        task_struct
        wrote on last edited by
        #5

        In hi.qml in main element you should define property model :

        @
        property ListModel model
        @

        "Most good programmers do programming not because they expect to get paid or get adulation by the public, but because it is fun to program."

        • Linu...
        1 Reply Last reply
        0
        • N Offline
          N Offline
          Naufal
          wrote on last edited by
          #6

          Hi,
          This is the code i tried in hi.qml

          @import QtQuick 1.0
          import com.nokia.symbian 1.0

          Rectangle {
          property ListModel model

          width: 360
          height: 640
          

          }@

          I am getting error as - Error: Cannot assign QString to QDeclarativeListModel*

          Regards,
          Naufal.A

          1 Reply Last reply
          0
          • T Offline
            T Offline
            task_struct
            wrote on last edited by
            #7

            I'm sorry. My mistake. Passing arguments is without ""

            @
            { model = yourModelId, currIndex = index }
            @

            "Most good programmers do programming not because they expect to get paid or get adulation by the public, but because it is fun to program."

            • Linu...
            1 Reply Last reply
            0
            • N Offline
              N Offline
              Naufal
              wrote on last edited by
              #8

              HI,
              It's Ok sir.But still i am getting error as: Cannot assign to non-existent property "model".. Even though i have removed the double quotes and tried it.. What should i give in hi.qml? I have simply declared what u have said earlier..
              I thought that index should be set for all the images and when clicked it should display in a new page and when flicked it should retrive all the images in a queue i guess..
              Do you get my point sir.

              Regards,
              Naufal.A

              1 Reply Last reply
              0
              • T Offline
                T Offline
                task_struct
                wrote on last edited by
                #9

                Hi,

                I can't unterstand what is the problem. But I can suggest you this solution:

                Store you model in separate file: Model.qml
                @
                import QtQuick 1.1

                ListModel {
                ListElement {
                titleText: "jellyfish"
                blue: "white"
                red: "jellyfish.JPG"
                }

                ListElement {
                    titleText: "Koala"
                    blue: "white"
                    red: "Koala.JPG"
                }
                
                ListElement {
                    titleText: "Lighthouse"
                    blue: "white"
                    red: "Lighthouse.JPG"
                }
                
                ListElement {
                    titleText: "Penguins"
                    blue: "white"
                    red: "Penguins.JPG"
                }
                
                ListElement {
                    titleText: "Tulips"
                    blue: "white"
                    red: "Tulips.JPG"
                }
                

                }
                @

                In fist page you've got:
                @
                import QtQuick 1.1
                import com.nokia.symbian 1.1

                Page {
                id: mainPage

                ListView {
                    id: listview1
                
                    anchors.fill: parent
                
                    x: 0
                    y: 0
                    width: 360
                    height: 640
                    clip: true
                    header: ListHeading {
                        ListItemText {
                            text: "ListHeading"
                            anchors.fill: parent.paddingItem
                            role: "Heading"
                        }
                    }
                    delegate: ListItem {
                        id: listItem
                        ListItem {
                            onClicked: {
                                mainPage.pageStack.push( Qt.resolvedUrl( "hi.qml" ), { "currIndex" : index } )
                            }
                        }
                
                        Column {
                            anchors.fill: parent.paddingItem
                            ListItemText {
                                width: parent.width
                                Text {
                                    x: 100
                                    y: 5
                                    color: blue
                                    text: titleText
                                }
                                Image {
                                    id:li
                                    x: 0
                                    y: 5
                                    width: 50
                                    height: 50
                                    source: model.red
                                }
                            }
                        }
                    }
                    model: Model {}
                }
                

                }
                @

                And in hi.qml something like this:
                @
                Page {
                id: mainPage

                property int currIndex: 0
                property ListModel model:
                
                Model {
                    id: model
                }
                
                Image {
                    id: img
                    anchors.fill: parent
                
                    source: model.get( currIndex ).red
                
                    MouseArea {
                        anchors.fill: parent
                
                        onClicked: mainPage.currIndex++
                    }
                }
                

                }
                @

                "Most good programmers do programming not because they expect to get paid or get adulation by the public, but because it is fun to program."

                • Linu...
                1 Reply Last reply
                0
                • N Offline
                  N Offline
                  Naufal
                  wrote on last edited by
                  #10

                  Hi Sir,
                  Thank you very much!!! I got the required result
                  Again a huge thanks...

                  Regards,
                  Naufal.A

                  1 Reply Last reply
                  0
                  • N Offline
                    N Offline
                    Naufal
                    wrote on last edited by
                    #11

                    Hi,
                    one thing i could not do is, i am not able to move the picture back.I mean both sides.
                    The picture is moving only on one direction.. I want to move it both left and right.
                    Whether i have to assign index value for all the images or i should change the condition which you had given...

                    Regards,
                    Naufal.A

                    1 Reply Last reply
                    0
                    • T Offline
                      T Offline
                      task_struct
                      wrote on last edited by
                      #12

                      Hi,

                      change the condition. currIndex is the index of current image in the model. You can modify this index whatever you want ( increase, decrease, set to some value ). Also you can get model "size":http://doc.qt.nokia.com/4.7-snapshot/qml-listmodel.html#count-prop and check if currIndex is bigger. In that case you can stop increasing currIndex or go back to 0.

                      "Most good programmers do programming not because they expect to get paid or get adulation by the public, but because it is fun to program."

                      • Linu...
                      1 Reply Last reply
                      0

                      • Login

                      • Login or register to search.
                      • First post
                        Last post
                      0
                      • Categories
                      • Recent
                      • Tags
                      • Popular
                      • Users
                      • Groups
                      • Search
                      • Get Qt Extensions
                      • Unsolved