How to get z-index/order of layers in document

Adobe XD UXP Plugin API
1

Hey there,

So I understand that the selection.items is ordered by how the user selected or the order has no meaning (random) if selected by marquee. Is there a way to get the layers’ z-index in the document though?

We currently display a preview of the user’s selected layers (just the colors of two selected layers), but I can’t find a way to make it so that their bottom-most layer is always on the bottom. We’d like the preview to match how it looks in their document if possible.

Thanks!

1 Like
2

@fookay you can traverse back to the selection’s parent like an artboard and get the list of the artboard’s children. This will return items in z order. Once you are at the artboard level, you can do something like this to check the order:

.children.forEach(child => {
    console.log(child)
})
3

Thanks…

How would you change an element’s z-index ?

I notice there is commands.bringToFront , or parent.addChild.

But if I have an element already added, and then want to re-order, how can this be done?

bringToFront appears to be only useful for items selected

thanks

4

I ended up programatically selecting the desired node, then doing a bringToFront() .

selection.items=node;
commands.bringToFront();

this worked fine for what I needed, although I’d still like to know how I could specify precisely in the z-order where I wanted the layer moved.

5

try using
addChildAfter(node, relativeTo)
or
addChildBefore(node, relativeTo)