AgoraIO-Extensions / Agora-Flutter-SDK

Flutter plugin of Agora RTC SDK for Android/iOS/macOS/Windows
https://pub.dev/packages/agora_rtc_engine
MIT License
736 stars 381 forks source link

Screen sharing from iOS flutter not working #861

Closed devsideal closed 10 months ago

devsideal commented 1 year ago

Hi,

I implemented Screen Sharing by referring given demo: https://github.com/AgoraIO-Extensions/Agora-Flutter-SDK/tree/main/example/lib/examples/advanced/screen_sharing

Screen sharing is working fine on Android But not on iOS

In iOS:-

  1. When i start the screen share it shows an alert,

IMG-7756(1)

  1. I select my created broadcast extension from the list and
  2. Click on "Start Broadcast" button
  3. The indicator turns into the Red, which looks like the extension started screen capturing,

But the screen is not showing to the users joined in the same channel.

So far i followed all the instructions given here: https://docs.agora.io/cn/video-call-4.x/screensharing_flutter_ng?platform=Flutter

Apart from this, should I need to do something else? like should I need to write any script in SampleHandler.swift of my extension?

Now my SampleHandler.swift is:

import ReplayKit

class SampleHandler: RPBroadcastSampleHandler {

    override func broadcastStarted(withSetupInfo setupInfo: [String : NSObject]?) {
        // User has requested to start the broadcast. Setup info from the UI extension can be supplied but optional. 
    }

    override func broadcastPaused() {
        // User has requested to pause the broadcast. Samples will stop being delivered.
    }

    override func broadcastResumed() {
        // User has requested to resume the broadcast. Samples delivery will resume.
    }

    override func broadcastFinished() {
        // User has requested to finish the broadcast.
    }

    override func processSampleBuffer(_ sampleBuffer: CMSampleBuffer, with sampleBufferType: RPSampleBufferType) {
        switch sampleBufferType {
        case RPSampleBufferType.video:
            // Handle video sample buffer
            break
        case RPSampleBufferType.audioApp:
            // Handle audio sample buffer for app audio
            break
        case RPSampleBufferType.audioMic:
            // Handle audio sample buffer for mic audio
            break
        @unknown default:
            // Handle other sample buffer types
            fatalError("Unknown type of sample buffer")
        }
    }
}

Related to: https://github.com/AgoraIO-Extensions/Agora-Flutter-SDK/issues/607

littleGnAl commented 1 year ago
  1. The indicator turns into the Red, which looks like the extension started screen capturing,

Can you share a screenshot for this step?

devsideal commented 1 year ago

@littleGnAl Please have a look:

IMG-7759(1)

littleGnAl commented 1 year ago

Do you call joinChannelEx to publish the screen capture stream? https://github.com/AgoraIO-Extensions/Agora-Flutter-SDK/blob/f70a581f0587bdba6435de443f0954aec70e9287/example/lib/examples/advanced/screen_sharing/screen_sharing.dart#L128

devsideal commented 1 year ago
  1. When the user click on Share Screen button,
    _engine.joinChannelEx(
                        token: screenShareAgoraToken,
                        connection: RtcConnection(
                        channelId: channelName,
                        localUid: screenShareUid),
                        options: const ChannelMediaOptions(
                        autoSubscribeVideo: true,
                        autoSubscribeAudio: true,
                        publishScreenTrack: true,
                        publishSecondaryScreenTrack: true,
                        publishCameraTrack: false,
                        publishMicrophoneTrack: false,
                        publishScreenCaptureAudio: true,
                        publishScreenCaptureVideo: true,
                        channelProfile:
                        ChannelProfileType.channelProfileLiveBroadcasting,
                        clientRoleType: ClientRoleType.clientRoleBroadcaster,
                      )); 
  2. Then from the event listener,
 _engine.registerEventHandler(RtcEngineEventHandler(
     onJoinChannelSuccess: (RtcConnection connection, int elapsed) async {
        if (connection.localUid == screenShareUid){
             _shareScreen();
        } 
     } , onLocalVideoStateChanged: (VideoSourceType source,
            LocalVideoStreamState state, LocalVideoStreamError error) { 
             switch (state) {
               case LocalVideoStreamState.localVideoStreamStateCapturing:
               case LocalVideoStreamState.localVideoStreamStateEncoding:
                  setState(() {
                    _isScreenShared = true;
                   });
               break;
            }
         } ,
   . . . . . . . . . . . . . 
  ));

     Future<void> _shareScreen() async {
      await _engine.startScreenCapture(const ScreenCaptureParameters2(
          captureAudio: false,
          captureVideo: true,
      ));

      _showRPSystemBroadcastPickerViewIfNeed();

      await _engine.updateChannelMediaOptionsEx(
      options: const ChannelMediaOptions(
        publishScreenTrack: true,
        publishSecondaryScreenTrack: true,
        publishCameraTrack: false,
        publishMicrophoneTrack: false,
        publishScreenCaptureAudio: true,
        publishScreenCaptureVideo: true,
        clientRoleType: ClientRoleType.clientRoleBroadcaster,
      ),
      connection: RtcConnection(
          channelId: channelName, localUid: screenShareUid),
    );
  }

  Future<void> _showRPSystemBroadcastPickerViewIfNeed() async {
    if (defaultTargetPlatform != TargetPlatform.iOS) {
      return;
    }
    await _iosScreenShareChannel
        .invokeMethod('showRPSystemBroadcastPickerView');
  }
  1. And in my build method,
@override
Widget build(BuildContext context) {
 return  . . . . . ..  . 
   . . . . . . . . . .
 _isScreenShared ? AgoraVideoView(
       controller: VideoViewController(
       rtcEngine: _engine,
       canvas: const VideoCanvas(
       uid: 0,  sourceType: VideoSourceType.videoSourceScreen, ),
   )) : Container()

    . . . . . . . .. . . 

}
littleGnAl commented 1 year ago

It seems the code is valid, if you first integrate the screen-sharing feature, you may need to reboot the phone at some time, maybe you can try rebooting your phone to see if helpful or not.

devsideal commented 1 year ago

I tried after rebooting the phone, but still no luck.

littleGnAl commented 1 year ago
  1. It is most likely the screen sharing works fine, but the remote user can not see the screen sharing stream, you can try this website to see if you can see the screen sharing stream. https://webdemo.agora.io/basicVoiceCall/index.html

  2. If you can see the screen-sharing stream on the website, I think you may need to share the code for how you render the remote users, I can check if it is valid or not.

  3. If you can't see the screen-sharing stream on the website, I think it's better to submit a ticket to agora support to help further investigate this issue.

devsideal commented 1 year ago
  1. It is most likely the screen sharing works fine, but the remote user can not see the screen sharing stream, you can try this website to see if you can see the screen sharing stream. https://webdemo.agora.io/basicVoiceCall/index.html

    1. If you can see the screen-sharing stream on the website, I think you may need to share the code for how you render the remote users, I can check if it is valid or not.

    2. If you can't see the screen-sharing stream on the website, I think it's better to submit a ticket to agora support to help further investigate this issue.

Looks like your given link of the web demo is for voice call, However, I found another one for video call( https://webdemo.agora.io/basicVideoCall/index.html ) and tested with that. But can't see the screen-sharing stream on the website, While I can see the camera stream on the website.

devsideal commented 1 year ago

Hi @littleGnAl, As per your suggestion, I'm going with your #3 option. I submitted a ticket to agora support, For your reference, the ticket id is CUS-29735

shaikmohammed8 commented 1 year ago

Hi @littleGnAl, As per your suggestion, I'm going with your #3 option. I submitted a ticket to agora support, For your reference, the ticket id is CUS-29735

hey can you share code cuz i dont even gitting extension screen

SagarArora312 commented 1 year ago

Hi @devsideal You Have to write the AgoraReplayKitHandler value in NSExtensionPrincipalClass in the info.plist of your extension.

Noller-BASCO commented 1 year ago

@devsideal Have you made any progress on this issue?

qiuyanli1990 commented 1 year ago

This is confirmed as resolved on the ticket

_The below change worked for me, would be great if you update the English version of the doc, Thank you so much

"- If you only need to use the functions in AgoraReplayKitExtension.framework provided by Agora, the modification method is: select Target as the newly created Extension, and in *Info, set *NSExtension > NSExtensionPrincipalClass to AgoraReplayKitHandler."

Just a small issue, After the Start Broadcast, the alert doesn't go away automatically until we touch the screen._

supermebing commented 1 year ago

我遇到了不同的问题 点击开始直播 3秒倒计时后恢复成默认状态 也没有红色显示

github-actions[bot] commented 10 months ago

Without additional information, we are unfortunately not sure how to resolve this issue. We are therefore reluctantly going to close this bug for now. If you find this problem please file a new issue with the same description, what happens, logs and the output. All system setups can be slightly different so it's always better to open new issues and reference the related ones. Thanks for your contribution.

github-actions[bot] commented 10 months ago

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please raise a new issue.