[Web] AgoraVideoView takes the whole available screen

[gabrielginter]

agora_rtc_engine: ^6.5.0

When using a remote AgoraVideoView, the video takes all available space in the canvas regardless of how I set it up.

This is how I build the view:

final videoVideo = AgoraVideoView(
  controller: VideoViewController.remote(
  rtcEngine: _engine,
  canvas: VideoCanvas(uid: _ref.watch(remoteParticipantProvider).readableId),
  connection: RtcConnection(channelId: channelName),
  useFlutterTexture: true, // I have tried true and false, same result
);

I'm using latest stable flutter version and agora_rtc_engine: ^6.5.0.

No error are shown in the logs.

I found these PR and previous issues, but is unclear if this was fixed or not:

• fix: AgoraVideoView takes over the whole browser window #1717
• [Flutter] [Web] Adding remote track while browser not visible, video takes over whole screen/document body #1635

Am I missing something?

Platforms affected

• Web
• Android
• iOS
• macOS
• Windows

Steps to reproduce

A new project with the AgoraVideoView attempting to show remote video should trigger this behaviour.

Expected results

AgoraVideoView shows at the desired size and location

Actual results

AgoraVideoView takes the maximum size of the canvas and covers all other widgets

Code sample

No response

Screenshots or Video

In the following video I started a video call and kept the video on the remote device muted/disabled, then when I enable it you can see that it takes the whole screen instead of half.

Screenshots / Video demonstration

flutter.web.agora.480.mov

Logs

Logs

I'll try to add this soon

Flutter Doctor output

Doctor output

[✓] Flutter (Channel stable, 3.27.3, on macOS 15.2 24C101 darwin-arm64, locale en-AU)
    • Flutter version 3.27.3 on channel stable at /Users/gginter/development/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision c519ee916e (13 days ago), 2025-01-21 10:32:23 -0800
    • Engine revision e672b006cb
    • Dart version 3.6.1
    • DevTools version 2.40.2

[✓] Android toolchain - develop for Android devices (Android SDK version 35.0.0)
    • Android SDK at /Users/gginter/Library/Android/sdk
    • Platform android-35, build-tools 35.0.0
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 21.0.4+-12422083-b607.1)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 16.2)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 16C5032a
    • CocoaPods version 1.15.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2024.2)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 21.0.4+-12422083-b607.1)

[✓] VS Code (version 1.96.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension can be installed from:
      🔨 https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter

[✓] Connected device (4 available)
    • macOS (desktop)                 • macos                     • darwin-arm64   • macOS 15.2 24C101 darwin-arm64
    • Mac Designed for iPad (desktop) • mac-designed-for-ipad     • darwin         • macOS 15.2 24C101 darwin-arm64
    • Chrome (web)                    • chrome                    • web-javascript • Google Chrome 132.0.6834.160

[✓] Network resources
    • All expected network resources are available.

• No issues found!