I am using Iframe element to show camera for barcode scanner.

Widget build(BuildContext context) {
String createdViewId = DateTime.now().microsecondsSinceEpoch.toString();
String? barcodeNumber;

final html.IFrameElement iframe = html.IFrameElement()
  ..src = PackageConstant.barcodeFileWebPath
  ..style.border = 'none'
  ..height = "100%"
  ..width = "100%"
  ..style.width = '100%' // Set width to 100%
  ..style.height = "100%" // Set height to 100%
  ..onLoad.listen((event) async {
    /// Barcode listener on success barcode scanned
    html.window.onMessage.listen((event) {
      /// If barcode is null then assign scanned barcode
      /// and close the screen otherwise keep scanning
      if (barcodeNumber == null) {
        barcodeNumber = event.data;
        onScanned(barcodeNumber!);
      }
    });
  });
ui.platformViewRegistry
    .registerViewFactory(createdViewId, (int viewId) => iframe);

return HtmlElementView(
  viewType: createdViewId,
);
}

the problem is that it does not take the full height.

usage:

 Column(
  children: [
    Expanded(
      child: Container(
        color: Colors.red,
       child: BarcodeScanner(
          
        ),
      ),
    )
  ],
)

result: