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 access the cover image of mp3 file from its metadata in QML?

How to access the cover image of mp3 file from its metadata in QML?

Scheduled Pinned Locked Moved Solved QML and Qt Quick
14 Posts 4 Posters 5.2k Views 3 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.
  • Nisha_RN Nisha_R
    MediaPlayer{
               id: player;
               playlist: Playlist {
                   id: playlist
                   PlaylistItem {
                           source: "file:///C:/Users/xyz/Desktop/trial/4.mp3"}
                                }
                                  }
                }
    Image{
                   x: 305
                   y: 196
                   width: 68
                   height: 49
                   source: player.metaData.coverArtUrlLarge
               }
    

    Unable to assign [undefined] to QUrl
    this is the error i get on assigning player.metaData.coverArtUrlLarge to source.

    raven-worxR Offline
    raven-worxR Offline
    raven-worx
    Moderators
    wrote on last edited by
    #2

    @Nisha_R
    are you sure that the mp3 file even has a cover art in it's meta data?

    --- SUPPORT REQUESTS VIA CHAT WILL BE IGNORED ---
    If you have a question please use the forum so others can benefit from the solution in the future

    1 Reply Last reply
    1
    • Nisha_RN Offline
      Nisha_RN Offline
      Nisha_R
      wrote on last edited by
      #3

      @raven-worx yes it has a cover art in its meta data.

      1 Reply Last reply
      1
      • p3c0P Offline
        p3c0P Offline
        p3c0
        Moderators
        wrote on last edited by
        #4

        @Nisha_R coverart URL is different than covert art image. I guess the media file contains cover art image.

        157

        1 Reply Last reply
        3
        • Nisha_RN Offline
          Nisha_RN Offline
          Nisha_R
          wrote on last edited by
          #5

          @p3c0 thank you,
          what has to be assigned to image source to access its embedded cover image from its metadata

          1 Reply Last reply
          0
          • p3c0P Offline
            p3c0P Offline
            p3c0
            Moderators
            wrote on last edited by
            #6

            @Nisha_R AFAICS there is no way to do so than using some 3rd party library for extracting it.

            157

            1 Reply Last reply
            1
            • Nisha_RN Offline
              Nisha_RN Offline
              Nisha_R
              wrote on last edited by
              #7

              @p3c0 ok i shall look for something like that.
              Thank you.

              raven-worxR 1 Reply Last reply
              1
              • Nisha_RN Nisha_R

                @p3c0 ok i shall look for something like that.
                Thank you.

                raven-worxR Offline
                raven-worxR Offline
                raven-worx
                Moderators
                wrote on last edited by
                #8

                @Nisha_R
                based on the propsals above you could use id3lib to do the following:

                1. implement a QQuickImageProvider, since images can only be set by URL in QML
                2. register this image provider with a name like "Mp3CoverArt": engine->addImageProvider(QLatin1String("Mp3CoverArt"), new MyMp3CoverArtImageProvider);
                3. in QML you can request the image with source: "image://Mp3CoverArt/<custom-id-of-mp3-file>". You could also specify the path to the mp3 file as an 'id', but make sure the URL stays valid. (e.g. you could encode the path as base64)
                4. in the image provider you will receive the url you set (convert it back from base64)
                5. use id3lib to retrieve the image: Important for you will be the Find(), GetRawBinary(), using the frame id ID3FID_PICTURE (i guess this is the right one?)
                6. create your QPixmap/QImage from the binary data using QImageReader for example

                haven't tried it, but it should work i think :)

                --- SUPPORT REQUESTS VIA CHAT WILL BE IGNORED ---
                If you have a question please use the forum so others can benefit from the solution in the future

                1 Reply Last reply
                3
                • p3c0P Offline
                  p3c0P Offline
                  p3c0
                  Moderators
                  wrote on last edited by p3c0
                  #9

                  Or once you fetch the coverart using the 3rd party library you can just convert the image to base64 and directly set it to Image's source. For eg.

                  imageObj->setProperty("source", "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAQvUlEQVRo3t2beYxd1X3Hv79zzr33LTNv3iwez+aNDOCw2WAMKSIgpTZJaUA0SkkrNWnTVhBFolG6pJIb2ihFFk3/aEBJF0VVk0pJS5eoCYVCYwjEwhTbY4PBi7A9tpkZ27O/W
                  

                  157

                  1 Reply Last reply
                  2
                  • Nisha_RN Offline
                    Nisha_RN Offline
                    Nisha_R
                    wrote on last edited by
                    #10

                    @raven-worx @p3c0 thank you:)
                    i shall try with that.

                    1 Reply Last reply
                    1
                    • Nisha_RN Offline
                      Nisha_RN Offline
                      Nisha_R
                      wrote on last edited by
                      #11

                      @p3c0 @raven-worx
                      what does metaData.coverArtUrlLarge allow us to access from its metadata?

                      1 Reply Last reply
                      0
                      • p3c0P Offline
                        p3c0P Offline
                        p3c0
                        Moderators
                        wrote on last edited by
                        #12

                        @Nisha_R I think it will be a URL for online coverart. For eg. a spotify URL
                        https://i.scdn.co/image/c3c5cbe660fe6935f2962aed480f306fa3ac1f9d
                        https://i.scdn.co/image/c0f4db566965ccc4ddad3fc0a5e6f82acc676728

                        I think they should have also provided CoverArtImage for QML mediaplayer.

                        157

                        1 Reply Last reply
                        1
                        • Nisha_RN Offline
                          Nisha_RN Offline
                          Nisha_R
                          wrote on last edited by
                          #13

                          Thank you @p3c0

                          1 Reply Last reply
                          1
                          • K Offline
                            K Offline
                            kinggiotai
                            Banned
                            wrote on last edited by
                            #14
                            This post is deleted!
                            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