Overlapping images in ListView QML

Zhukov

I want ListView to take images from the FolderListModel and display them sequentially on the screen. FolderListModel uses FileDialog to take an images from the folder specified by the user:

import QtQuick.Controls 1.3
import QtQuick 2.6
import QtQuick.Dialogs 1.0
import QtQuick.Window 2.1
import Qt.labs.folderlistmodel 1.0

ApplicationWindow {

visible: true
title: "Test"
width: 400
height: 1000

Button {
    id: but
      text: "Chose folder"
      onClicked: fileDialog.open()
 }

FileDialog {
    id: fileDialog
    title: "Choose a folder with some images"
    selectFolder: true
    folder: picturesLocation
    onAccepted: {
        folderModel.folder = fileUrl + "/";
        but.visible=false;
        listview.visible=true;
    }
}

FolderListModel {
    id: folderModel
    objectName: "folderModel"
    showDirs: false
    nameFilters: imageNameFilters
}

ListView {
    id: listview
    anchors.fill: parent
    visible: false

    Component {
        id: fileDelegate
        Image {
            id: image
            anchors.centerIn: parent
            fillMode: Image.PreserveAspectFit
            source: folderModel.folder + fileName
            antialiasing: true
        }
    }

    model: folderModel
    delegate: fileDelegate
}

}

After starting the program, I select the folder where the files are stored .jpg images (3 small squares of different colors).

What I approximately want to see:

What the program prints:

Zhukov

decided https://www.cyberforum.ru/qml/thread2606971.html