如何在Flutter上布局Agora视频画面？

Question

如何布局屏幕，让它们只出现在Flutter App的角落里？我只需要4个视频框给其他用户看。

Answer 1

正如这里的快速入门指南中提到的。https:/github.comAgoraIO-CommunityAgora-Flutter-Quickstart。

你可以使用Column widgets将4个视频放置在4个不同的角落。

/// Helper function to get list of native views   List<Widget>
_getRenderViews() {
    final List<AgoraRenderWidget> list = [
      AgoraRenderWidget(0, local: true, preview: true),
    ];
    _users.forEach((int uid) => list.add(AgoraRenderWidget(uid)));
    return list;   }

  /// Video view wrapper   Widget _videoView(view) {
    return Expanded(child: Container(child: view));   }

  /// Video view row wrapper   Widget _expandedVideoRow(List<Widget> views) {
    final wrappedViews = views.map<Widget>(_videoView).toList();
    return Expanded(
      child: Row(
        children: wrappedViews,
      ),
    );   }

  /// Video layout wrapper   Widget _viewRows() {
    final views = _getRenderViews();
    switch (views.length) {
      case 1:
        return Container(
            child: Column(
          children: <Widget>[_videoView(views[0])],
        ));
      case 2:
        return Container(
            child: Column(
          children: <Widget>[
            _expandedVideoRow([views[0]]),
            _expandedVideoRow([views[1]])
          ],
        ));
      case 3:
        return Container(
            child: Column(
          children: <Widget>[
            _expandedVideoRow(views.sublist(0, 2)),
            _expandedVideoRow(views.sublist(2, 3))
          ],
        ));
      case 4:
        return Container(
            child: Column(
          children: <Widget>[
            _expandedVideoRow(views.sublist(0, 2)),
            _expandedVideoRow(views.sublist(2, 4))
          ],
        ));
      default:
    }
    return Container();   }