1

I've created a dynamic rectangle with a width and height of 100, and then changed its x position to 10. Spark AR shows its position as 10, but not the width/height, which appear as 0,03748

Here's a screenshot of how it looks like

const [dynamicRectangle] = await Promise.all([
        Scene.create("PlanarImage", {
            "name": "Rectangle",
            "width": 100,
            "height": 100,
            "hidden": false,
            "material": material,
        }),
    ]);

const dynamicRectangleTransform = dynamicRectangle.transform;
dynamicRectangleTransform.x = 10;


Why? I figured it might have something to do with the canvas width, because multiplying it by the rectangle width, returns the correct number, HOWEVER it seems to have broken the code somehow, because when I add these lines of code, this happens.

const newWidth = dynamicRectangle.width.mul(canvas.bounds.width);
dynamicRectangle.width = newWidth;

const newHeight = dynamicRectangle.height.mul(canvas.bounds.height);
dynamicRectangle.height = newHeight;

In case you didn't notice from the screenshot, it now properly appears as 100, but now the rectangle doesn't appear in the canvas even though it should be visible, and position is back to 0, when it should clearly be 10. It isn't visible in my example, but it also makes so every line of Diagnostics.watch() stop working.

What am I doing wrong? I've tried hundreds of things and this keeps happening.

  • 1
    How are you adding the child to the scene? AFAIK a rectangle needs to be added as a child of a canvas – JackKalish Feb 09 '21 at 17:13
  • I think this is a bug tbh. If I change the width/height afterwards instantiation, then I see the correct values in the properties inspector, but the rendering in the viewport is still broken and tiny as f*ck. (If I add the rectangle directly as a child of the 'Focal Distance' rather than the canvas, then it appears in the middle but size is again broken and rendered in a different scale) – seekingtheoptimal Dec 19 '21 at 14:59

1 Answers1

0

Try this,

  1. Convert your rectangle to a Block

  2. Using script, pass the new width and height to the block.

    Ex : block.inputs.setScalar("widthValue", 123);

  3. Within the Block, receive the value and update the rectangle using patches.

Nithin NS
  • 51
  • 6