Screen sharing

What's screen sharing?

Screen sharing refers to the process of broadcasting the contents of one screen to another device or multiple devices in a video call or interactive video scene.

Starts screen sharing	Screen shared by mobile apps	Screen shared by web apps	Landscape mode

Implementation

Add Permissions

To enable the screen sharing feature, navigate to the "app/src/main" directory, open the "AndroidManifest.xml" file, and add the following permissions:

<uses-permission android:name="android.permission.FOREGROUND_SERVICE" />
<uses-permission android:name="android.permission.FOREGROUND_SERVICE_MEDIA_PROJECTION" />

<uses-permission android:name="android.permission.FOREGROUND_SERVICE" />
<uses-permission android:name="android.permission.FOREGROUND_SERVICE_MEDIA_PROJECTION" />

Share the screen

Screen sharing is only supported in the gallery layout. To share your screen, you will need to set the layout inside the ZegoUIKitPrebuiltLiveStreamingConfig to Gallery first.

To decide whether to use the full-screen mode by default during screen sharing, you will need to configure the showNewScreenSharingViewInFullscreenMode inside the ZegoLayoutGalleryConfig. Set it to true, meaning that the shared screen will automatically be in full screen when the screen sharing starts.

Meanwhile, the full-screen mode button is customizable, you can decide the way how it shows. To set it, configure the showScreenSharingFullscreenModeToggleButtonRules inside the ZegoLayoutGalleryConfig:

• SHOW_WHEN_SCREEN_PRESSED: show the full-screen mode button when clicking the shared screen.
• ALWAYS_SHOW: always shows the full-screen mode button.
• ALWAYS_HIDE: always hides the full-screen mode button.

To start the screen sharing, add the ZegoMenuBarButtonName.SCREEN_SHARING_TOGGLE_BUTTON config to the bottomMenuBarConfig to let the screen sharing button show.

Here is the reference code:

public class LiveActivity extends AppCompatActivity {
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_live);

    long appID = YourAppID;
    String appSign = YourAppSign;
    String userID = "userID";
    String userName = "userName";
    String liveID = "testLiveID";

    // Modify your custom configurations here.
    ZegoUIKitPrebuiltLiveStreamingConfig config;
    if (isHost) {
        config = ZegoUIKitPrebuiltLiveStreamingConfig.host();
    } else {
        config = ZegoUIKitPrebuiltLiveStreamingConfig.audience();
    }
    config.bottomMenuBarConfig.hostButtons = Arrays.asList(ZegoMenuBarButtonName.TOGGLE_CAMERA_BUTTON,
       ZegoMenuBarButtonName.TOGGLE_MICROPHONE_BUTTON,ZegoMenuBarButtonName.SWITCH_CAMERA_FACING_BUTTON, ZegoMenuBarButtonName.SCREEN_SHARING_TOGGLE_BUTTON);

    ZegoLayoutGalleryConfig galleryConfig = new ZegoLayoutGalleryConfig();
    galleryConfig.removeViewWhenAudioVideoUnavailable = true;
    galleryConfig.showNewScreenSharingViewInFullscreenMode = true;
    galleryConfig.showScreenSharingFullscreenModeToggleButtonRules  = ZegoShowFullscreenModeToggleButtonRules.SHOW_WHEN_SCREEN_PRESSED;
    config.zegoLayout = new ZegoLayout(ZegoLayoutMode.GALLERY, galleryConfig);

    ZegoUIKitPrebuiltLiveStreamingFragment fragment = ZegoUIKitPrebuiltLiveStreamingFragment.newInstance(appID, appSign, userID, userName, liveID, config);

    getSupportFragmentManager()
            .beginTransaction()
            .replace(R.id.fragment_container, fragment)
            .commitNow();
  }
}

public class LiveActivity extends AppCompatActivity {
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_live);

    long appID = YourAppID;
    String appSign = YourAppSign;
    String userID = "userID";
    String userName = "userName";
    String liveID = "testLiveID";

    // Modify your custom configurations here.
    ZegoUIKitPrebuiltLiveStreamingConfig config;
    if (isHost) {
        config = ZegoUIKitPrebuiltLiveStreamingConfig.host();
    } else {
        config = ZegoUIKitPrebuiltLiveStreamingConfig.audience();
    }
    config.bottomMenuBarConfig.hostButtons = Arrays.asList(ZegoMenuBarButtonName.TOGGLE_CAMERA_BUTTON,
       ZegoMenuBarButtonName.TOGGLE_MICROPHONE_BUTTON,ZegoMenuBarButtonName.SWITCH_CAMERA_FACING_BUTTON, ZegoMenuBarButtonName.SCREEN_SHARING_TOGGLE_BUTTON);

    ZegoLayoutGalleryConfig galleryConfig = new ZegoLayoutGalleryConfig();
    galleryConfig.removeViewWhenAudioVideoUnavailable = true;
    galleryConfig.showNewScreenSharingViewInFullscreenMode = true;
    galleryConfig.showScreenSharingFullscreenModeToggleButtonRules  = ZegoShowFullscreenModeToggleButtonRules.SHOW_WHEN_SCREEN_PRESSED;
    config.zegoLayout = new ZegoLayout(ZegoLayoutMode.GALLERY, galleryConfig);

    ZegoUIKitPrebuiltLiveStreamingFragment fragment = ZegoUIKitPrebuiltLiveStreamingFragment.newInstance(appID, appSign, userID, userName, liveID, config);

    getSupportFragmentManager()
            .beginTransaction()
            .replace(R.id.fragment_container, fragment)
            .commitNow();
  }
}

Screen rotation

To support screen rotation, do the following:

1. Turn off the rotation lock function in the phone settings.

2. Add the android:configChanges="locale|keyboardHidden|fontScale|orientation|screenSize|screenLayout|layoutDirection|density|uiMode" attribute to the manifest file configuration of the Activity that adds the fragment. Taking LiveActivity as an example:

<activity
    android:name=".LiveActivity"
    android:configChanges="locale|keyboardHidden|fontScale|orientation|screenSize|screenLayout|layoutDirection|density|uiMode"
    android:exported="false" />

<activity
    android:name=".LiveActivity"
    android:configChanges="locale|keyboardHidden|fontScale|orientation|screenSize|screenLayout|layoutDirection|density|uiMode"
    android:exported="false" />