1

I am developing an android app using QML and want to demonstrate a gridview of a collection of video files in it. I want to show icons as thumbnails of those video files as shown in below. I don't know whether I should use QFileIconProvider or any others. I have no idea. Please help.

enter image description here

main.qml

...
     GridView {
               anchors.fill: parent
               cellWidth: 100; cellHeight: 100
               focus: true

               model: FileModel{
                   id: myModel
                   folder: "/mnt/sdcard/app_pictureFrameImage"
                   nameFilters: ["*.mp4","*.jpg"]
               }

               currentIndex: 0

               highlight: Rectangle { width: 80; height: 80; color: "lightsteelblue" }

               delegate: Item {
                   width: 100; height: 100

                   Image {
                       id: myIcon
                       y: 20; anchors.horizontalCenter: parent.horizontalCenter
                       source: icon
                   }
                   Text {
                       anchors { top: myIcon.bottom; horizontalCenter: parent.horizontalCenter }
                       text: fileName
                   }
                   MouseArea {
                       anchors.fill: parent
                       onClicked: parent.GridView.view.currentIndex = index
                   }
               }
           }
...

The following code extracts all the video or pictures found in the system. With the help of the following code, how can I make the thumbnails of video files or pictures for the icons of gridview?

filemodel.h

#ifndef FILEMODEL_H
#define FILEMODEL_H

#include <QAbstractListModel>
#include <QDirIterator>
#include <QUrl>
#include <QMetaType>
#include <QFuture>
#include <QtConcurrent/QtConcurrent>
#include <iostream>
using namespace std;

struct File
{
    Q_GADGET
    Q_PROPERTY(QString name MEMBER name)
    Q_PROPERTY(QUrl url MEMBER url)
public:
    QString name;
    QUrl url;
    File(const QString& name=""){            
        this->name = QFileInfo(name).fileName();
        this->url = QUrl::fromLocalFile(name);
    }
};
Q_DECLARE_METATYPE(File)

class FileModel : public QAbstractListModel
{
    enum dashBoardRoles {
        NameRole=Qt::UserRole+1,
        URLRole
    };
    Q_OBJECT
    Q_PROPERTY(QString folder READ folder WRITE setFolder NOTIFY folderChanged)
    Q_PROPERTY(QStringList nameFilters READ nameFilters WRITE setNameFilters NOTIFY nameFiltersChanged)
public:
    FileModel(QObject *parent=Q_NULLPTR):QAbstractListModel(parent){
    }

    Q_INVOKABLE QVariant get(int index){
        return QVariant::fromValue(m_all_dirs[index]);
    }

    int rowCount(const QModelIndex &parent=QModelIndex()) const{
        Q_UNUSED(parent)
        return m_all_dirs.count();
    }
    QVariant data(const QModelIndex &index, int role = Qt::DisplayRole) const{
        if(index.row()<0 && index.row()>= rowCount())
            return QVariant();
        File  file = m_all_dirs[index.row()];
        if(role == NameRole)
            return file.name;
        else if(role == URLRole)
            return file.url;
        return QVariant();
    }

    QHash<int, QByteArray> roleNames() const {
        QHash <int,QByteArray> roles;
        roles [NameRole]="fileName";
        roles [URLRole]="url";
        return roles;
    }

    QString folder() const{
        return mFolder;
    }

    void setFolder(const QString &folder)
    {
        if(mFolder == folder)
            return;
        mFolder = folder;
        emit folderChanged();
        findFiles();
    }

    QStringList nameFilters() const{
        return mNameFilters;
    }

    void setNameFilters(const QStringList &nameFilters){
        if(mNameFilters == nameFilters)
            return;
        mNameFilters = nameFilters;
        emit nameFiltersChanged();
        findFiles();
    }

signals:
    void folderChanged();
    void nameFiltersChanged();

private:
    void findFiles(){

        beginResetModel();
        m_all_dirs.clear();
        if(QDir(mFolder).exists()){
            QFuture<QStringList> future = QtConcurrent::run([=]() {
                QStringList files;
                QDirIterator it(mFolder, mNameFilters, QDir::Files, QDirIterator::Subdirectories);
                while (it.hasNext()){
                    files<<it.next();
                }
                return files;
            });
            QStringList fullNames = future.result();
            for(const QString& fullName: fullNames){
                File file{fullName};
                m_all_dirs << file;
            }
        }
        endResetModel();
    }
    QString mFolder;
    QList<File> m_all_dirs;
    QStringList mNameFilters;
};

#endif // FILEMODEL_H
OPfan
  • 1,625
  • 2
  • 13
  • 18
  • Do you already have thumbnail images of your videos or you want to generate then while loading? – folibis Feb 20 '18 at 10:17
  • I want to create them while loading. – OPfan Feb 21 '18 at 00:49
  • How can I make the thumbnail images as icon? – OPfan Mar 13 '18 at 03:54
  • That isn't trivial task I think. I would create some background thread which loops through all the video files, creates thumbnails (ffmpeg?, OpenCV?) and stores them. Then you can easily organize access using `QQuickImageProvider`. Maybe [this](https://stackoverflow.com/questions/30800772/how-to-grab-video-frames-in-qt) link could be useful. – folibis Mar 13 '18 at 06:55
  • Take a look at [this](http://gitlab.unique-conception.org/qt-small-apps/video-gallery) project. It looks that it uses thumbnails. – folibis Mar 13 '18 at 08:05
  • Thanks for your suggestion. – OPfan Mar 14 '18 at 08:20

0 Answers0