How to generate a responsive Image?

[Berrysoft]

I would like to generate a image which is reponsive to the avaliable size. For example, the layout is

VerticalBox {
    Image {
        // Need source here.
    }
    Button {
        text: "Some other functionalities";
    }
}

I would like the Image widget occupy all remaining spaces, and generate an bitmap (e.g. a plot from plotters).

My questions are the following:

• How to know the remaining spaces in a VerticalBox?
• How to response the resize event of the window?
• Or, how to response the redraw event of the Image widget?

Either the solutions below is OK, I think:

• Property changed event. Have callback emitted when a property changes #112
• Window resize event.
• Widget redraw event.

[Berrysoft]

Specifically, for plots, there's another solution: enable Image to load SVG from memory.

[ogoffart]

Maybe you want to do somehing like:

export global ImageSource {
   pure callback generate_image(length, length, string) -> image;
}

export component Example {
  VerticalBox {
    Rectangle {
        Image {
            x: 0px; y: 0px; // ensure there is no binding loop
            width: 100%; height: 100%;
            source: ImageSource.generate_image(self.width, self.height, "maybe_some_id_here");
        }
    }
    Button {
        text: "Some other functionalities";
    }
  }
}

The Rectangle layer of indirection ensure there are no binding loop.
And the native callback will be called every time the size is changed.