CODEWITHSUNDEEP
qtqml
SPlatten
SPlatten

Reputation: 5760

QML Item, Repeater children, get child by id

I am working on a project which has QML something like:

    Item {
        id: cameraButtonBar
        ...
        Row {
            Repeater {
                id: repeaterId
                model: cameraModel.cameraPositions()

                Item {

                    Rectangle {
                        id: fullSelectedCameraMarker
                        ...
                        visible: cameraButtonBar.checkCaptured(index, false, false)
                    }
                    Rectangle {
                        id: map1SelectedCameraMarker
                        ...
                        visible: cameraButtonBar.checkCaptured(index, true, false)
                    }
                    Rectangle {
                        id: map2SelectedCameraMarker
                        ...
                        visible: cameraButtonBar.checkCaptured(index, false, true)
                    }
                }
            }
        }
    }

In my script "checkCaptured" JavaScript:

        function checkCaptured(idx, left, right) {
//Can't do anything until an image is selected
            if ( root.selectedImageIdx >= 0 ) {
                var chkItem = repeaterId.itemAt(idx);

                if ( typeof chkItem === "object" ) {
                    var marker;

                    if ( left === false && right === false ) {
                        marker = chkItem.fullSelectedCameraMarker;
                    } else if ( left === true ) {
                        marker = chkItem.map1SelectedCameraMarker;
                    } else if ( right === true ) {
                        marker = chkItem.map2SelectedCameraMarker;
                    }
                    if ( marker !== undefined ) {

                    }
                }
            }
            return false;
        }

The above isn't correct and the question is, how to I access the rectangles using the IDs in each rectangle so I get the rectangle used in the repeater?

Upvotes: 1

Views: 1783

Answers (1)

Soheil Armin
Soheil Armin

Reputation: 2795

As you are using the item which contains those 3 rectangles in as a delegate, you won't have access IDs from outside of the delegate. IDs are translated to actual objects at compile time and they are not intended to reference objects at runtime.

Anyway, manipulating delegates from the outside is not a good idea. Pass the required data to your delegate and let it decide what to do itself.

You can assign the inner rectangles to a read-only property of the chkItem and reference them later in your function. 

Item {
    readonly property Rectangle _fullSelectedCameraMarker: fullSelectedCameraMarker
    readonly property Rectangle _map1SelectedCameraMarker: map1SelectedCameraMarker
    readonly property Rectangle _map2SelectedCameraMarker: map2SelectedCameraMarker

    Rectangle {
        id: fullSelectedCameraMarker
        ...
        visible: cameraButtonBar.checkCaptured(index, false, false)
    }
    Rectangle {
        id: map1SelectedCameraMarker
        ...
        visible: cameraButtonBar.checkCaptured(index, true, false)
    }
    Rectangle {
        id: map2SelectedCameraMarker
        ...
        visible: cameraButtonBar.checkCaptured(index, false, true)
    }
}

You can also name your object using objectName property and find them by iterating over children property of the chkItem and checking the rectangle by its objectName

Rectangle {

    id: fullSelectedCameraMarker
    objectName: "fullSelectedCameraMarker"
    ...
    visible: cameraButtonBar.checkCaptured(index, false, false)
}

var chkItem = repeaterId.itemAt(idx);
var chkItemChildren = chkItem.children;
// iterate over children using any machanism you prefer to filter those children
// 
for( var i = 0 ; i < chkItemChildren.length ; ++i)
{
    if(chkItemChildren[i].objectName==='fullSelectedCameraMarker'){
        // whatever you want to do
    }
}

Note: You can use Lodash in QML which will help a lot.

Upvotes: 2

Related Questions