How to draw a box on an image and maintain aspect ratio (aspect ration and absolute position)

[TingTingin]

I'm trying to draw boxes over objects in images that were detected using object detection but i'm having a few issues

• when I place the image and a container in a stack and match the aspect ratios as shown below it seems to work somewhat however the ability to position the container (box) absolutely is lost if you add a top bottom left or right position to the container it disappears
• I tried using a canvas widget instead but the objects (Rect, text Etc) in the canvas seem to ignore the scale of the window when resizing
• I tried using margin as a substitute for absolute positioning but that breaks the relative scaling
• I also tried to use an offset but the container disappeared
• I also tried ft.Scale() to scale axes independently but its ignored when aspect ratio is set

I'm not sure exactly how to achieve the effect of drawing a box over an image and having it stay in the same relative position regardless of the size that the image is scaled to i.e if a box is draw over a detected face it should always be over the face regardless of scaling

img = "https://picsum.photos/1000/1500"


def main(page: ft.Page):
    image = ft.Image(expand=True,
                     src=img,
                     aspect_ratio=1)

    container = ft.Container(
        bgcolor=None,
        border=ft.border.all(20, "red"),
        aspect_ratio=1,
        scale=0.5,
    )

    page.add(ft.Stack([image, container], expand=True))


ft.app(main)