# Screen sharing (/en/realtime-media/interactive-live-streaming/build/manage-video-and-streaming/screen-sharing/blueprint)

> For AI agents: see the complete documentation index at [llms.txt](/llms.txt).

During Interactive Live Streaming sessions, hosts use the screen sharing feature in the Agora Video SDK to share their screen content with other users or viewers in the form of a video stream. Screen sharing is typically used in the following use-cases:

| Use-case                   | Description                                                                                                    |
| :------------------------- | :------------------------------------------------------------------------------------------------------------- |
| Online education           | Teachers share their slides, software, or other teaching materials with students for classroom demonstrations. |
| Game live broadcast        | Hosts share their game footage with the audience.                                                              |
| Interactive live broadcast | Anchors share their screens and interact with the audience.                                                    |
| Video conferencing         | Meeting participants share the screen to show a presentation or documents.                                     |
| Remote control             | A controlled terminal displays its desktop on the master terminal.                                             |

      
  
      
  
      
  
      
  
      
  
      
  
      
  
      
  
      
  
      
  
      
    Agora screen sharing offers the following advantages:

    * **Ultra HD quality experience**: Supports Ultra HD video (4K resolution, 60 FPS frame rate), giving users a smoother, high-definition, ultimate picture experience.
    * **Multi-app support**: Compatible with many mainstream apps such as WPS Office, Microsoft Office Power Point, Visual Studio Code, Adobe Photoshop, Windows Media Player, and Scratch. This makes it convenient for users to directly share specific apps.
    * **Multi-device support**: Supports multiple devices sharing at the same time. Screen sharing is compatible with Windows 8 systems, devices without independent graphics cards, dual graphics card devices, and external screen devices.
    * **Multi-platform adaptation**: Supports iOS, Android, macOS, Windows, Web, Unity, Flutter, React Native, Unreal Engine, and other platforms.
    * **High security**: Supports sharing only a single app or part of the screen. Also supports blocking specified app windows, effectively ensuring user information security.

    This page shows you how to implement screen sharing in your game.

    ## Understand the tech [#understand-the-tech-10]

    The screen sharing feature provides the following screen sharing modes for use in various use-cases:

    **Screen sharing use-cases**

    ![Screen Sharing Functionality](https://assets-docs.agora.io/images/video-sdk/screen-sharing-functionality.png)

    * **Share the entire screen**: Share your entire screen, including all the information on the screen. This feature supports collecting and sharing information from two screens at the same time.
    * **Share an app window**: If you don't want to share the entire screen with other users, you can share only the area within an app window.
    * **Share a designated screen area**: If you only want to share a portion of the screen or app window, you can set a sharing area when starting screen sharing.

    Screen sharing modes are available on different platforms as follows:

    * **Desktop** (Windows and macOS): Supports all screen sharing features listed above.

    * **Mobile** (Android and iOS): Only supports sharing the entire screen.

    ## Prerequisites [#prerequisites-10]

    * Ensure that you have implemented the [SDK quickstart](../../index.mdx) in your project.

    ## Set up your project [#set-up-your-project-10]

    ### Android and iOS [#android-and-ios]

    Since Apple does not support capturing the screen in the main process of the app, you create a separate extension for the screen sharing stream. You use the iOS native `ReplayKit` framework in the extension to record the screen, and then send the screen sharing stream to the main process.

    **Screen sharing sequence**

    ![Screen Sharing Blueprint Tech Android iOS](https://assets-docs.agora.io/images/video-sdk/screen-sharing-flutter-unity-rn-blueprint.svg)

    Refer to the [iOS Screen Sharing Guide](https://github.com/AgoraIO-Extensions/Agora-Unreal-RTC-SDK/blob/main/Agora-Unreal-SDK-CPP-Example/IOS%20ScreenShare%20Guide.md) to create an Extension for your Unreal (Blueprint) project.

    ### Windows and macOS [#windows-and-macos]

    Agora currently supports the following screen sharing solutions for macOS and Windows platforms:

    * Share a specified screen or part of a specified screen using the `displayId`.
    * Share a specified window or part of a specified window using the `windowId`.

    The basic API call sequence is shown in the figure below:
    ![Screen Sharing Blueprint Tech Windows macOS](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-windows-macos-tech.png)

    ## Implement screen sharing [#implement-screen-sharing-10]

    This section shows you how to implement screen sharing in your project.

    ### Android and iOS platforms [#android-and-ios-platforms]

    This subsection describes how to start and stop screen sharing on Android and iOS mobile platforms.

    #### Create buttons [#create-buttons]

    Create two button controls named `Btn_StartScreenCapture` and `Btn_StopScreenCapture`. Users **start** or **stop** screen sharing using these two buttons as shown in the figure below:

    ![Create UMG](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-android-ios-mobile-umg.png)

    #### Join a channel and publish the screen sharing stream [#join-a-channel-and-publish-the-screen-sharing-stream]

    Refer to the following steps to join a channel and publish a screen sharing stream:

    1. In **Bind UIEvent**, bind the UI event of clicking the **Start Screen Share** button. Create a **Bind Event to On Clicked** node that connects the `Btn_StartScreenShare` button control and the `OnStartScreenShareClicked` callback functions respectively. This callback is triggered when the user clicks the **Start Screen Share** button as shown in the following figure:

       ![Bind UI Start](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-android-ios-bind-ui-start.png)

    2. Create and implement the `OnStartScreenShareClicked` callback. When a button click triggers this callback, execute the following flow:

    3. Call the **Stop Screen Capture** method to pause the ongoing screen sharing process.

    4. Call **Start Screen Capture** method to start screen capture, and check **Capture Audio** and **Capture Video** in **Make ScreenCaptureParameters2** to capture system audio and screen video.

    5. Call **Join Channel** to join the channel and configure the following parameters in **Make ChannelMediaOptions** to publish the screen-captured video stream to the channel:

       * Set **Publish Camera Track** to `AGORA FALSE VALUE` to cancel publishing the video stream collected by the camera.
       * Set **Publish Screen Capture Video** to `AGORA TRUE VALUE` to publish the screen-captured video stream.
       * Set **Publish Screen Capture Audio** to `AGORA TRUE VALUE` to publish the screen-captured audio stream.
       * Set **Auto Subscribe Video** to `AGORA TRUE VALUE` to automatically subscribe to all video streams.
       * Set **Auto Subscribe Audio** to `AGORA TRUE VALUE` to automatically subscribe to all audio streams.
       * Check **Client Role Type Set Value** and set **Client Role Type** to `CLIENT_ROLE_BROADCASTER` or `CLIENT_ROLE_AUDIENCE` to set the user role as host or audience.
       * Check **Channel Profile Set Value** and set **Channel Profile** to `CHANNEL_PROFILE_LIVE_BROADCASTING` to set the channel scene to live broadcast scene as shown below:

       ![Join Channel and Publish Screen Sharing Stream](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-android-ios-mobile-start.png)

    #### Stop screen sharing [#stop-screen-sharing-5]

    Follow the steps below to stop screen capture:

    1. In **Bind UIEvent**, bind the UI event of clicking the **Stop Screen Sharing** button. Create a **Bind Event to On Clicked** node that connects the `Btn_StopScreenShare` button control and the `OnStopScreenShareClicked` callback function respectively. This callback is triggered when the user clicks the **Stop Screen Share** button.

       ![Bind UI Event for Stop Button Click](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-android-ios-bind-ui-stop.png)

    2. Create and implement the `OnStopScreenShareClicked` callback. When a button click triggers this callback, **Stop Screen Capture** is called to stop screen sharing as shown in the following image:

       ![Bind UI Event for Stop Button Click](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-android-ios-stop.png)

    ### Windows and macOS platforms [#windows-and-macos-platforms]

    This subsection describes how to start and stop screen capture on Windows and macOS mobile platforms.

    #### Create the user interface [#create-the-user-interface]

    Refer to the following steps to create a UMG:

    1. Create a **ComboBoxString** (drop-down list box) control named `CBS_DisplayID` for the user to select the screen or window to share from a drop-down list.

    2. Create two **Button** controls named `Btn_StartScreenCapture` and `Btn_StopScreenCapture`, for the user to start or stop screen sharing.

       ![Windows macOS UMG](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-windows-macos-umg.png)

    #### Add the basic process [#add-the-basic-process]

    In **EventGraph**, add and connect the event nodes required for screen sharing as shown in the following diagram:

    ![EventGraph](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-windows-macos-event-graph.png)

    The main nodes are as follows:

    | Node                               | Description                                                                                                                                                               |
    | :--------------------------------- | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
    | Get Screen Display Id              | After initializing the Agora Engine, get information about the shareable screens and windows. Use this information to set the options and indexes in the drop-down lists. |
    | Init Default Screen Capture Config | Prepare the parameter configuration for screen sharing and save the configuration for later use.                                                                          |

    #### Get available screens and windows [#get-available-screens-and-windows]

    Follow the steps below to obtain and add available screens and windows:

    1. In **Get Screen Display Id**, refer to the following steps to get the currently available screen and window resources and add them to the options in the drop-down list:

    2. Call the **Get Screen Capture Sources** method to return a list of shareable screens and windows, and call **Get Count** to get the number of shareable screens and windows, as shown in the following figure:

       ![Get Screen Capture Sources](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-windows-macos-get-screen-capture-sources.png)

    3. Traverse the list, call **Get Source Info** to get information about a specific screen or window, and add the **Source Name** to each of the options in the drop-down list for the users to choose from. Call **Release** to release the list of shareable screens and windows. Refer to the following figure:

       ![Get Screen Capture Sources](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-windows-macos-get-source-info.png)

    4. In **Bind UIEvent**, bind the UI event of the dropdown list selection change. Create a **Bind Event to On Selection Changed** node that connects the `CBS_DisplayID` drop-down list control and the `OnCBDisplayIDSelectionChanged` callback function, respectively. This callback is triggered when the user selects the specified screen or window in the drop-down list as shown in the following figure:

       ![Bind Event On Selection Changed](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-windows-macos-bind-event-to-on-selection-changed.png)

    5. Create and implement the `OnCBDisplayIDSelectionChanged` callback. When an option change triggers this callback, it looks up the index of the option and sets the option by index as shown below:

       ![OnCBDisplayIDSelectionChanged](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-windows-macos-on-cbdisplay-id-selection-changed.png)

    #### Configure screen sharing parameters [#configure-screen-sharing-parameters]

    In **Init Default Screen Capture Config**, configure screen sharing parameters such as **Dimensions**, **Frame Rate**, and **Bitrate**. Make advanced configurations as follows:

    * **Screen Stroke**: Check **Enable High Light** and set **High Light Width** and **High Light Color** to specify the stroke width and color. The SDK strokes the shared screen or window according to your settings.

    * **Shield Window**: Set **Exclude Window List** to the list of windows you want to shield. When you subsequently call **Start Screen Capture by Display Id**, the specified window is shielded.

    Save this configuration for subsequent use when starting screen capture. Refer to the following figure:

    ![Save Screen Share Config](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-windows-macos-save-config.png)

    #### Join a channel and publish a screen sharing stream [#join-a-channel-and-publish-a-screen-sharing-stream]

    1. In **Bind UIEvent**, bind the event of clicking the **Start Screen Share** button. Create a **Bind Event to On Clicked** node that connects the `Btn_StartScreenShare` button control and the `OnStartScreenShareClicked` callback functions, respectively. This callback is triggered when the user clicks the **Start Screen Share** button as shown below:

       ![Bind Event to On Clicked](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-windows-macos-create-bind-event-to-on-clicked-node.png)

    2. Create and implement the `OnStartScreenShareClicked` callback. When the callback is triggered, the following process is executed:

    3. Call the **Stop Screen Capture** method to pause the ongoing screen sharing process.

    4. Based on the list of available screens and windows saved in the previous steps, find the element that corresponds to the option and determine whether the option is a `ScreenCaptureSourceType_Screen` (screen) or a `ScreenCaptureSourceType_Window` (window) by using the **Type** in the element.

       ![OnStartScreenShareClicked callback](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-windows-macos-on-start-screen-share-clicked.png)

    5. If the shared target is a screen, call **Start Screen Capture by Display Id** to pass in the screen ID and the parameter configuration saved in the previous steps to start capturing the video stream of the specified screen. If the shared target is a window, call **Start Screen Capture by Window Id** to pass in the window ID and the parameter configuration to start capturing the video stream of the specified window. To share a specific region of a screen or window, set the **Region Rect** parameter to the position of the region you want to share relative to the entire screen or window.

    6. Call **Join Channel** to join the channel and configure the following parameters in **Make ChannelMediaOptions** to publish the captured screen sharing stream:

       * Set **Publish Camera Track** to `AGORA FALSE VALUE` to cancel publishing camera-captured video streams.
       * Set **Publish Screen Track** to `AGORA TRUE VALUE` to publish screen-captured video streams.
       * Set **Auto Subscribe Video** to `AGORA TRUE VALUE` to automatically subscribe to all video streams.
       * Set **Auto Subscribe Audio** to `AGORA TRUE VALUE` to automatically subscribe to all audio streams.
       * Check **Client Role Type Set Value** and set **Client Role Type** to `CLIENT_ROLE_BROADCASTER` or `CLIENT_ROLE_AUDIENCE` to set the user's role as anchor or audience.
       * Check **Channel Profile Set Value** and set **Channel Profile** to `CHANNEL_PROFILE_LIVE_BROADCASTING`.

       ![Call Join Channel](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-windows-macos-call-join-channel.png)

    #### Stop screen sharing and leave the channel [#stop-screen-sharing-and-leave-the-channel]

    1. In **Bind UIEvent**, bind the event of clicking the **Stop Screen Sharing** button. Create a **Bind Event to On Clicked** node that connects the `Btn_StopScreenShare` button control and the `OnStopScreenShareClicked` callback functions respectively. This callback is triggered when the user clicks the **Stop Screen Share** button. Refer to the following figure:

       ![Bind UI Event of Stop Button Click](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-windows-macos-bind-ui-stop.png)

    2. Create and implement the `OnStopScreenShareClicked` callback. When a button click triggers this callback, **Stop Screen Capture** is called to stop screen sharing as shown below:

       ![OnStopScreenShareClicked callback](https://assets-docs.agora.io/images/video-sdk/screen-sharing-blueprint-windows-macos-on-stop-screen-share-clicked.png)

    ### Limitations [#limitations-10]

    Be aware of the following limitations:

    * The video unit price for a screen-shared stream is based on the **video resolution** you set in `FScreenCaptureParameters`. If you do not pass dimensions in `FScreenCaptureParameters`, Agora bills at the default resolution of 1920 x 1080 (2,073,600). See [Pricing](../../reference/pricing.md) for details.

    #### Android and iOS platforms [#android-and-ios-platforms-1]

    * Before starting screen sharing, call the `SetAudioScenario` method and set the **audio scenario** to `AUDIO_SCENARIO_GAME_STREAMING` (high sound quality scenario) to improve the success rate of capturing system audio during screen sharing.

    ## Reference [#reference-10]

    This section contains content that completes the information on this page, or points you to documentation that explains other aspects to this product.

    ### Sample project [#sample-project-10]

    Agora provides an open source Unreal (Blueprint) [sample project](https://github.com/AgoraIO-Extensions/Agora-Unreal-RTC-SDK/tree/main/Agora-Unreal-SDK-Blueprint-Example) on GitHub for your reference:

    * [ScreenShare](https://github.com/AgoraIO-Extensions/Agora-Unreal-RTC-SDK/tree/main/Agora-Unreal-SDK-Blueprint-Example/Content/API-Example/Advance/ScreenShare): implements screen sharing.
    * [ScreenShareWhileVideoCall](https://github.com/AgoraIO-Extensions/Agora-Unreal-RTC-SDK/tree/main/Agora-Unreal-SDK-Blueprint-Example/Content/API-Example/Advance/ScreenShareWhileVideoCall): implements screen sharing while on a video call.

    ### API reference [#api-reference-9]

    * Android, iOS
      * [`StartScreenCapture`](https://api-ref.agora.io/en/video-sdk/blueprint/4.x/API/class_irtcengine.html#api_irtcengine_startscreencapture)
      * [`StopScreenCapture`](https://api-ref.agora.io/en/video-sdk/blueprint/4.x/API/class_irtcengine.html#api_irtcengine_stopscreencapture)
      * [`UpdateScreenCapture`](https://api-ref.agora.io/en/video-sdk/blueprint/4.x/API/class_irtcengine.html#api_irtcengine_updatescreencapture)

    * macOS, Windows
      * [`GetScreenCaptureSources`](https://api-ref.agora.io/en/video-sdk/blueprint/4.x/API/class_irtcengine.html#api_irtcengine_getscreencapturesources)
      * [`StartScreenCaptureByDisplayId`](https://api-ref.agora.io/en/video-sdk/blueprint/4.x/API/class_irtcengine.html#api_irtcengine_startscreencapturebydisplayid)
      * [`StartScreenCaptureByWindowId`](https://api-ref.agora.io/en/video-sdk/blueprint/4.x/API/class_irtcengine.html#api_irtcengine_startscreencapturebywindowid)
      * [`UpdateScreenCaptureParameters`](https://api-ref.agora.io/en/video-sdk/blueprint/4.x/API/class_irtcengine.html#api_irtcengine_updatescreencaptureparameters)
      * [`UpdateScreenCaptureRegion`](https://api-ref.agora.io/en/video-sdk/blueprint/4.x/API/class_irtcengine.html#api_irtcengine_updatescreencaptureregion)
      * [`SetScreenCaptureContentHint`](https://api-ref.agora.io/en/video-sdk/blueprint/4.x/API/class_irtcengine.html#api_irtcengine_setscreencapturecontenthint)
      * [`SetScreenCaptureScenario`](https://api-ref.agora.io/en/video-sdk/blueprint/4.x/API/class_irtcengine.html#api_irtcengine_setscreencapturescenario)
      * [`StopScreenCapture`](https://api-ref.agora.io/en/video-sdk/blueprint/4.x/API/class_irtcengine.html#api_irtcengine_stopscreencapture)