Split image into cells QML/QT

Question

I was wondering if there was a way to split image into cells (ie 4*4 grid) in QML or C++? So say I load an image in a window/rectangle and want to split it in a grid, to be later able to manipulate each cell separately. Thanks in advance.

Answer 1

Also you can load an image into Image item with offset. Since once loaded image is cached there will be no additional overhead.

Window {
    visible: true
    width: 600
    height: 600

    Component {
        id: imgComponent
        Item {
            property int row: index / 3
            property int col: index % 3
            x: col * (200)
            y: row * (200)
            width: 200
            height: 200
            clip: true
            Image {
                x: col * (-200)
                y: row * (-200)
                width: 600
                height: 600
                fillMode: Image.Pad
                source: "http://images.all-free-download.com/images/graphiclarge/green_homes_polar_coordinates_02_hd_picture_165795.jpg"
                Component.onCompleted: console.log(row, col);
            }
            MouseArea {
                anchors.fill: parent
                drag.target: parent
            }
        }
    }

    Repeater {
        model: 9
        delegate: imgComponent
    }
}