Black Screen on iOS and Full-Screen Video Not Rendering on Both Android & iOS with flutter_zoom_videosdk: ^2.1.10

Video SDK Flutter
, , ,
42

For everyone who has having black screen issues, I’ve found something that can be useful…

It seem that some of those black screen errors are related to how Flutter handles hybrid composition - For example, ZoomVideo SDK uses UiKitView to render the video on iOS and our app is applying rounded corners or any other transformation on Flutter side. This was causing a rendering error and leading to the black screen view.

After doing some tests I was able to get rid of those errors by removing everything that’s transforming the view. Even using a `Stack → Positioned` can cause this error.

1 Like
43

@Emerson1 Thank you for sharing your findings on this. Engineering is still looking into this currently and I’ve shared this and your logs with them so that should give them more insight.

1 Like
44

Hello, what’s the status of this issue.
Best regards.
Thank you

45

Hello All,

The black screen issue on iOS (and sometimes Android) occurs because of how Flutter’s hybrid composition interacts with Zoom’s UiKitView (on iOS) or PlatformView (on Android).

Zoom renders its video surface using a native platform view, and if Flutter applies any transformation (e.g., rounded corners, opacity, clipping, overlays, or using Stack + Positioned), the native view may fail to render properly — resulting in a blank / black screen.

This is my working code on IOS and Android:

class VideoGrid extends StatelessWidget {
  final List<ZoomVideoSdkUser> users;

  const VideoGrid({super.key, required this.users});

  @override
  Widget build(BuildContext context) {
    if (users.isEmpty) {
      return const Center(child: CircularProgressIndicator());
    }
    // ✅ Avoid GridView → Use Wrap for stable layout
    return LayoutBuilder(
      builder: (context, constraints) {
        final isSingle = users.length <= 1;
        final width = isSingle
            ? constraints.maxWidth
            : (constraints.maxWidth / 2) - 2;
        final height = isSingle
            ? constraints.maxHeight
            : (constraints.maxHeight / (users.length > 2 ? 2 : 1)) - 2;

        return Center(
          child: Wrap(
            direction: Axis.vertical,
            spacing: 0,
            runSpacing: 2,
            children: users
                .map(
                  (user) => SizedBox(
                    width: width,
                    height: height,
                    child: _SafeZoomView(user: user),
                  ),
                )
                .toList(),
          ),
        );
      },
    );
  }
}

class _SafeZoomView extends StatelessWidget {
  final ZoomVideoSdkUser user;

  const _SafeZoomView({required this.user});

  @override
  Widget build(BuildContext context) {
    // ✅ No Material, Container, or decoration!
    return ClipRect(
      // Only ClipRect is safe — doesn’t transform native layer
      child: zoom_view.View(
        key: Key(user.userId),
        creationParams: {
          "userId": user.userId,
          "videoAspect": VideoAspect.FullFilled,
          "fullScreen": false,
        },
      ),
    );
  }
}
46

Hello @ticorrian.heard

Can you please let us know when the latest version of “flutter_zoom_videosdk” will be released?

Best Regards,

47

@Maulik We have Flutter 2.3.5 releasing this month. I’ll try to get you a specific date.