How to insert videos into ListModel



  • Hello!
    I'm trying to insert videos to a ListModel QML in order to video thumbnails are shown in my application. I tried it out with pictures and it works well:
    @ListModel
    {
    id: aModel
    ListElement { name: "Image1"; icon: "/usr/images/11.jpg" }
    ListElement { name: "Image1"; icon: "/usr/images/22.jpg" }
    ListElement { name: "Image1"; icon: "/usr/images/33.jpg" }
    }@
    Do you have any ideas how to modify this piece of code for showing videos in list?



  • What is important for you to know is that in the case you are showing here, what you are providing is a path to a file. In short: feel free to link anything you want!

    Concretely, this means:

    Change your model to give the path to a video file

    Change your delegate to handle videos. For that you need to use QtMobility (check "here":http://doc.qt.nokia.com/qtmobility-1.2/qml-video.html)

    Your code would look like:
    Model:
    @ListModel {
    id: aModel
    ListElement { name : "video1"; video: "path_to_the_video_file" }
    }
    @

    Delegate:
    @ Component {
    id: aVideoDelegate
    Video {
    id: videoContainer
    width : 800
    height : 600
    source: video // Here it's coming from the model :)

         MouseArea {
             anchors.fill: parent
             onClicked: {
                 video.play()
             }
         }
    
         focus: true
         Keys.onSpacePressed: video.paused = !video.paused
         Keys.onLeftPressed: video.position -= 5000
         Keys.onRightPressed: video.position += 5000
     }
    

    }
    @
    This is how I would do, I'm not saying it's working.



  • I tried to do the following but no videos are shown on the screen:
    @
    ListModel
    {
    id: appModel
    ListElement { name: "Video1"; video: "/usr/share/video/kittens.ogv" }
    ListElement { name: "Video2"; video: "/usr/share/video/kittens.ogv" }
    ListElement { name: "Video3"; video: "/usr/share/video/kittens.ogv" }
    }

    Component
    {
    id: appDelegate

          Item
          {
              width: const_WIDTH
              height: const_HEIGHT
    
              Video
              {
                  id: myVideo
                  width: const_VIDEO_WIDTH
                  height: const_VIDEO_HEIGHT
                  anchors.horizontalCenter: parent.horizontalCenter
                  source: video
    
                  Image
                  {
                      id: iconPlay
                      source: "/usr/share/images/play.png"
                      anchors.verticalCenter: parent.verticalCenter
                      anchors.horizontalCenter: parent.horizontalCenter
                      opacity: 0.5
                  }
    
                  MouseArea
                  {
                      anchors.fill: parent
                      onClicked:
                      {
                          video.play()
                      }
                  }
    
                  focus: true
                  Keys.onSpacePressed: video.paused = !video.paused
                  Keys.onLeftPressed: video.position -= 5000
                  Keys.onRightPressed: video.position += 5000
              }
          }
     }
    
     GridView
     {
         clip: true
         anchors.bottomMargin: const_BOTTOM_MARGIN
         anchors.topMargin: const_TOP_MARGIN
         anchors.leftMargin: const_LEFT_MARGIN
         anchors.fill: parent
         cellWidth: const_CELL_WIDTH
         cellHeight: const_CELL_HEIGHT
         focus: true
         model: appModel
         delegate: appDelegate
     }
    

    @

    No errors were mentioned during compilation. Could you please advise what did I do wrong?



  • When you say: "no videos are shown" what exactly happens?
    What I'm interested in is:

    • can you see a thumbnail or anything? Maybe you can post a picture of what you have
    • have you tried different sizes? It could be a problem. I haven't used the Video element, so I don't know if you can resize a video...
    • were you able to load one single video i.e. without model/delegate? Maybe the file type is not supported...

    Try to describe what you obtain, this way we can see better what the problem could be :)


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.