Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter Agora.io calling screen

I want to add in-app (video) calling like Messenger (Facebook) does. It works when one party creates channel and another one joins.

But is there a way to create calling screen where party B can accept or reject call? I am looking in Agora.io documentation but cannot find anything suitable for this.

This is my code though...

 Future<void> initialize() async {
    if (APP_ID.isEmpty) {
      setState(() {
        _infoStrings.add(
          'APP_ID missing, please provide your APP_ID in settings.dart',
        );
        _infoStrings.add('Agora Engine is not starting');
      });
      return;
    }

    await _initAgoraRtcEngine();
    _addAgoraEventHandlers();
    await AgoraRtcEngine.enableWebSdkInteroperability(true);
    await AgoraRtcEngine.setParameters('''
{\"che.video.lowBitRateStreamParameter\":{\"width\":320,\"height\":180,\"frameRate\":15,\"bitRate\":140}}''');
    await AgoraRtcEngine.joinChannel(null, 'Test', null, 0);
  }

  Future<void> _initAgoraRtcEngine() async {
    AgoraRtcEngine.create(APP_ID);
    AgoraRtcEngine.enableVideo();
  }

  void _addAgoraEventHandlers() {
    AgoraRtcEngine.onError = (dynamic code) {
      setState(() {
        final info = 'onError: $code';
        _infoStrings.add(info);
      });
    };

    AgoraRtcEngine.onJoinChannelSuccess = (
      String channel,
      int uid,
      int elapsed,
    ) {
      setState(() {
        final info = 'onJoinChannel: $channel, uid: $uid';
        _infoStrings.add(info);
      });
    };

    AgoraRtcEngine.onLeaveChannel = () {
      setState(() {
        _infoStrings.add('onLeaveChannel');
        _users.clear();
      });
    };

    AgoraRtcEngine.onUserJoined = (int uid, int elapsed) {
      setState(() {
        final info = 'userJoined: $uid';
        _infoStrings.add(info);
        _users.add(uid);
      });
    };

    AgoraRtcEngine.onUserOffline = (int uid, int reason) {
      setState(() {
        final info = 'userOffline: $uid';
        _infoStrings.add(info);
        _users.remove(uid);
      });
    };

    AgoraRtcEngine.onFirstRemoteVideoFrame = (
      int uid,
      int width,
      int height,
      int elapsed,
    ) {
      setState(() {
        final info = 'firstRemoteVideo: $uid ${width}x $height';
        _infoStrings.add(info);
      });
    };
  } 
like image 558
harunB10 Avatar asked Dec 15 '19 12:12

harunB10


People also ask

How do you integrate Agora in flutter?

Add dependencies yaml : Add the agora_rtc_engine dependency to integrate Agora Flutter SDK. See https://pub.dev/packages/agora_rtc_engine for the latest version of agora_rtc_engine . Add the permission_handler dependency to add the permission handling function.


2 Answers

You will need to push channelId to other user mobile in this case. The CS Guy has created very useful video on you tube to implement this step as well as calling screen.

https://www.youtube.com/watch?v=v9ngriCV0J0

like image 155
Sourab Sharma Avatar answered Oct 14 '22 03:10

Sourab Sharma


You need to use Native ConnectionService for Android and Callkit of iOS.

You can find the official Agora samples for the above feature here: https://github.com/AgoraIO/Advanced-Video/tree/master/Calling-Interface, but I don't think Agora has call-interface sample in Flutter, you have to write the wrapper on your own for now.

like image 27
Sai Avatar answered Oct 14 '22 05:10

Sai