clientHeight/Width of Flutter platform view is always 0

603 views Asked by At

While trying to add a third party js library inside a Flutter web application, I'm facing an issue with clientHeight and clientWidth properties:

I've added a DivElement inside my widget tree with:

 @override
  void initState() {
    super.initState();

    divElement = DivElement()
      ..id = 'viewer_div'
      ..style.width = '100vh'
      ..style.height = '100vh'
      ..style.border = '1px solid green';

    // ignore: UNDEFINED_PREFIXED_NAME
    ui.platformViewRegistry.registerViewFactory(
        'viewer', (int viewId) => dicomElement);
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      width: 512, height: 512,
      color: Colors.transparent,
      child: const HtmlElementView(viewType: 'viewer'),
    );
  }

The divElement is used by the third party js library which adds a canvas DOM element as a child of the div. But the third party library also set the size the canvas according to the divElement clientWidth and clientHeight AND these values always return 0 so the final canvas width and height are set to 0!

I've tried to call the javascript method, which adds the canvas, after the first frame has been rendered but it does not change anything.

0

There are 0 answers