PhotoAlbumViewer - Data Duplication

Anas A. Ismail

I was extending one of qt examples, it's simply loading images from local disk, then show them in albums view ..
I make something like this,

main.qml
ListModel{
id: photosModel
}

// File dialog for selecting image file from local file system
FileDialog {
    id: fileDialog
    title: "Choose a folder"
    nameFilters: [ "Image files (*.png *.jpg *.jpeg)"]
    selectFolder: true
    onAccepted: {
        mainWindow.editMode = false
        photosModel.append({folder: fileDialog.folder + "/"})
    }
}

function getFolderUrl(){
    return fileDialog.fileUrl + "/"
}

DelegateModel { id: albumVisualModel; model: photosModel; delegate: AlbumDelegate {} }

GridView {
    id: albumView; width: parent.width; height: parent.height; cellWidth: 210; cellHeight: 220
    model: albumVisualModel.parts.album; visible: albumsShade.opacity != 1.0
}

AlbumDelegate.qml

Item {
Package.name: 'album'
id: albumWrapper; width: 210; height: 220

        DelegateModel {
            id: visualModel; delegate: ImageDelegate { }
            model: FilesModel { id: rssModel; folder: mainWindow.getFolderUrl()}
        }

....
}

ImageDelegate.qml
.....
Image {
id: originalImage; antialiasing: true; asynchronous: true
source: "image://provider/"+ rssModel.folder +fileName;cache: false;
fillMode: Image.PreserveAspectFit; width: photoWrapper.width; height: photoWrapper.height
}
....
}

The main problem is that when I load more than one folder I got all folders point to the same url like this image, any help in this ?

SGaist

Hi,

If you want to show the content of several folders, you should build a list of these folders and use that to feed your DelegateModel

Anas A. Ismail

@SGaist Do you mean something like ListModel of FolderListModel, right that ?
may you show me some starter code for this if it's possible ?

SGaist

Use the same technique you have with your photosModel

Anas A. Ismail

Thanks for your help,
The problem was that the model was always referring to the same directory because of using this method

function getFolderUrl(){
return fileDialog.fileUrl + "/"
}
I fixed this by setting the directory for each instance like this.
DelegateModel { id: albumVisualModel; model: photosModel; delegate: AlbumDelegate {folderURL: model.folder
} }

SGaist

Good !

Since you have it working now, please mark the thread as solved using the "Topic Tool" button so other forum users may know a solution has been found :)