diff --git a/lib/ui/screens/call_screen.dart b/lib/ui/screens/call_screen.dart index c794bf9..0fb17fc 100644 --- a/lib/ui/screens/call_screen.dart +++ b/lib/ui/screens/call_screen.dart @@ -1,4 +1,5 @@ import 'dart:async'; +import 'dart:math'; import 'package:comunic/helpers/calls_helper.dart'; import 'package:comunic/helpers/conversations_helper.dart'; @@ -478,7 +479,7 @@ class _CallScreenState extends SafeState { return Column( children: [ _canHideMenuBar ? Container() : _buildMembersArea(), - _buildVideosArea() + Expanded(child: LayoutBuilder(builder: _buildVideosArea)) ], ); } @@ -503,34 +504,56 @@ class _CallScreenState extends SafeState { } /// Videos area - Widget _buildVideosArea() { - return Expanded( - child: Stack( - fit: StackFit.expand, - children: [ - // Remove peers videos - Column( - children: _membersList.readyPeers - .where( - (f) => f.hasVideoStream && _renderers.containsKey(f.userID)) - .map((f) => _buildMemberVideo(f.userID)) - .toList(), - ), + Widget _buildVideosArea(BuildContext context, BoxConstraints constraints) { + final availableVideos = _membersList.readyPeers + .where((f) => f.hasVideoStream && _renderers.containsKey(f.userID)) + .toList(); - // Local peer video - isStreamingVideo && _isLocalStreamVisible - ? _buildLocalVideo() - : Container(), + final rows = List(); - // Buttons bar - _canHideMenuBar ? Container() : _buildFooterArea() - ], - ), + var numberRows = sqrt(availableVideos.length).ceil(); + var numberCols = numberRows; + + if (availableVideos.length == 2) numberRows = 1; + + final videoWidth = constraints.maxWidth / numberCols; + final videoHeight = constraints.maxHeight / numberRows; + + for (int i = 0; i < numberRows; i++) { + rows.add(Row( + children: availableVideos + .getRange(i * numberRows, + min(availableVideos.length, i * numberRows + numberCols)) + .map((f) => Container( + width: videoWidth, + height: videoHeight, + child: _buildMemberVideo(f.userID), + )) + .toList(), + )); + } + + return Stack( + fit: StackFit.expand, + children: [ + // Remove peers videos + Column( + children: rows, + ), + + // Local peer video + isStreamingVideo && _isLocalStreamVisible + ? _buildLocalVideo() + : Container(), + + // Buttons bar + _canHideMenuBar ? Container() : _buildFooterArea() + ], ); } Widget _buildMemberVideo(int peerID) { - return Expanded(child: RTCVideoView(_renderers[peerID])); + return RTCVideoView(_renderers[peerID]); } Widget _buildLocalVideo() {