How do you set a current selection child's fill opacity?

Adobe XD UXP Plugin API
1

My current selection is a group. I’m trying to change one of the child’s opacity to 0. I tried looping through the children of the current selection and targeting it that way, however, I keep getting the out of context error. Also, I tried cloning the current selection and targeting the child’s fill that way but got the same error.

1

Also, I was wondering if there is any way to turn off the fill of the targeted child without making it the current selection?

1 Like
2

Could you please share the code with which you’re trying to edit the opacity?

Thank you very much in advance.

By the way: There should be no reason to change the selection. As long as a node is inside the current edit context (cf. https://adobexdplatform.com/plugin-docs/reference/core/edit-context.html), you can edit it without changing the selection (and if it isn’t, you’re also not able to select it :wink:).

3

You want to change current selection child’s fill opacity? or change one of the child’s opacity to 0? Opacity of fill and opacity of node not the same. For example, to change all group rectangles opacity need something like:

selection.items.forEach((item) => {
    item.children.forEach((children) => {
        children.opacity = 0.5;
    });
});

and to change all group rectangles fill opacity, something like:

selection.items.forEach((item) => {
    item.children.forEach((children) => {
        // for example - get current color and change opacity only
        children.fill = new Color(children.fill.value, 0.1);
    });
});
1 Like
4

You can’t always modify the nodes inside of a container – plain Groups yes, but for special containers such as a Repeat Grid or a Mask Group the user will need to double-click to drill down inside the container and unlock its contents for editing. This is what “edit context” refers to in XD.

Your screenshot shows a Mask Group (the circle-in-a-square icon), so that is probably what’s going on in this case.

5

Is there a way to have access to children.fill opacity??
Something like children.fill.opacity

7

I think there is no way to achieve this, since fill property can be color, radial/linear gradient or image.

UPD. You can get opacity (alpha value) only from Color fill object (Solid Color in XD), value would be (alpha percent / 100) * 255:

selection.items.forEach((item) => {
    console.log(item.fill.a) // would be 128 if color opacity set to 50%
});
2 Likes