tencent cloud

PrevNext

Feedback

search by keyword

Recent Pages

Documentation
Tencent Real-Time Communication
    Documentation
    Download PDF

    Flutter

    Last updated: 2024-09-02 17:15:44
    Download PDF
      This article will introduce how to quickly integrate the Flutter RTC Engine and implement a basic audio and video call.

      Environment preparations

      Flutter 2.0 or above.
      Developing for Android:
      Android Studio 3.5 or above.
      Devices with Android 4.1 or above.
      Developing for iOS:
      Xcode 11.0 or above.
      OS X 10.11 or above
      Please ensure your project is set up with a valid developer signature.

      Step 1. Import the SDK

      Install component tencent_trtc_cloud with the following command:
      flutter pub add tencent_trtc_cloud

      Step 2. Configure the project

      1. Grant camera and microphone permissions to enable voice call features.
      iOS
      Android
      1. Add requests for camera and mic permissions in Info.plist:
      <key>NSCameraUsageDescription</key>
      <string>Video calls require camera permission.</string>
      <key>NSMicrophoneUsageDescription</key>
      <string>Voice calls require microphone permission.</string>
      2. Add the field io.flutter.embedded_views_preview and set its value to YES.
      1. Open /android/app/src/main/AndroidManifest.xml.
      2. Add the following permissions:
      <uses-permission android:name="android.permission.INTERNET" />
      <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
      <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
      <uses-permission android:name="android.permission.RECORD_AUDIO" />
      <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
      <uses-permission android:name="android.permission.BLUETOOTH" />
      <uses-permission android:name="android.permission.CAMERA" />
      <uses-feature android:name="android.hardware.camera.autofocus" />
      Note:
      If you encounter any problems during the access process, please refer to Frequently Asked Questions.

      Step 3. Create a TRTC instance

      1. Declare member variables
      late TRTCCloud trtcCloud;
      2. Call the initialization interface to create the TRTC instance and set the event callback.
      trtcCloud = (await TRTCCloud.sharedInstance())!;
trtcCloud.registerListener((type, param) async {
  switch (type) {
    case TRTCCloudListener.onError:
      print("onError errorCode:${param['errCode']} errorMsg:${param['errMsg']}")
      break;
    case TRTCCloudListener.onEnterRoom:
      if (param > 0) {
        print("Enter room success");
      } else {
        print("Enter room failed");
      }
      break;
    default:
      break;
  }
});

      Step 4. Enter a room

      1. If you run the program on an Android device, you need to request CAMERA and MICROPHONE permissions in advance.
      if (!(await Permission.camera.request().isGranted) ||
    !(await Permission.microphone.request().isGranted)) {
  print('You need to obtain audio and video permission to enter');
  return;
}
      Note:
      The permission request here uses the third-party library permission_handler.
      2. In the Tencent RTC Console click Create Application, and obtain the SDKAppID from the Application Overview.
      
      
      
      3. In UserSig Tools, select SDKAppID from the dropdown, enter your own username (UserID), and click Generate to get your own UserSig.
      
      
      
      4. After setting the room parameters TRTCParams, call the enterRoom interface function to enter the room.
      Anchor Role
      await trtcCloud.enterRoom(
    TRTCParams(
        sdkAppId: sdkAppId, // Please replace with your own SDKAppID
        userId: "denny",    // Please replace with your own userid
        userSig: '',        // Please replace with your own userSig
        role: TRTCCloudDef.TRTCRoleAnchor,
        roomId: 123321      // Please replace with your own room number
    ),
    TRTCCloudDef.TRTC_APP_SCENE_LIVE);
      Audience Role
      await trtcCloud.enterRoom(
    TRTCParams(
        sdkAppId: sdkAppId, // Please replace with your own SDKAppID
        userId: "denny",    // Please replace with your own userid
        userSig: '',        // Please replace with your own userSig
        role: TRTCCloudDef.TRTCRoleAudience,
        roomId: 123321      // Please replace with your own room number
    ),
    TRTCCloudDef.TRTC_APP_SCENE_LIVE);
      Note:
      If you enter the room as an Audience Role, sdkAppId and roomId need to be the same as those at the anchor end, while userId and userSig need to be replaced with your own values.

      Step 5. Enable the camera

      1. Add TRTCCloudVideoView in the corresponding position of the build method on the page: 
      TRTCCloudVideoView(
  key: valueKey,
  viewType: TRTCCloudDef.TRTC_VideoView_TextureView,
  onViewCreated: (viewId) async {
    setState(() {
      localViewId = viewId;
    });
  },
),
      2. Before invoking the interface startLocalPreview to enable camera preview, you can set the local preview rendering parameters by calling the interface setLocalRenderParams.
      trtcCloud.setLocalRenderParams(TRTCRenderParams(
  fillMode: TRTCCloudDef.TRTC_VIDEO_RENDER_MODE_FILL,
  mirrorType: TRTCCloudDef.TRTC_VIDEO_MIRROR_TYPE_AUTO,
  rotation: TRTCCloudDef.TRTC_VIDEO_ROTATION_0,
));

trtcCloud.startLocalPreview(isFrontCamera, viewId);
      3. You can perform operations such as "switching between front and rear cameras" and "setting the focus mode" by calling the interface TXDeviceManager.
      TXDeviceManager manager = trtcCloud.getDeviceManager();
bool autoFocusEnable = (await manager.isAutoFocusEnabled())!;
if (autoFocusEnable) {
  manager.enableCameraAutoFocus(true);
}
manager.enableCameraTorch(true);
      Note:
      The front camera is enabled by default. If you need to use the rear camera, simply call manager.switchCamera(false) to enable it.

      Step 6. Enable the microphone

      You can call startLocalAudio to enable microphone capture. This interface requires you to determine the capture mode through the quality parameter. It is recommended to select one of the following modes that suits your project.
      // Enable microphone acquisition and set the current scene to: Voice mode
// For high noise suppression capability, strong and weak network resistance
trtcCloud.startLocalAudio(TRTCCloudDef.TRTC_AUDIO_QUALITY_SPEECH);
// Enable microphone acquisition, and set the current scene to: Music mode
// For high fidelity acquisition, low sound quality loss, recommended to use with professional sound cards
trtcCloud.startLocalAudio(TRTCCloudDef.TRTC_AUDIO_QUALITY_MUSIC);

      Step 7. Play/Stop Video Streams

      Create a new project, follow the steps 1-4 to enter denny's room as a spectator. After that, you can start playing the remote user's video by calling the startRemoteView interface.
      // Play denny's camera footage
trtcCloud.startRemoteView("denny", TRTCCloudDef.TRTC_VIDEO_STREAM_TYPE_BIG, viewId);
      Then, you can stop a remote user's video by calling the stopRemoteView interface, or stop all remote users' videos by calling the stopAllRemoteView interface.
      // Stop denny's camera footage
trtcCloud.stopRemoteView("denny", TRTCCloudDef.TRTC_VIDEO_STREAM_TYPE_BIG, viewId);
// Stop all camera footage
trtcCloud.stopAllRemoteView();

      Step 8. Play/Stop Audio Streams

      You can mute the remote user Denny by calling the muteRemoteAudio("denny", true) interface.
      // Mute user with id denny
trtcCloud.muteRemoteAudio("denny", true);
      You can later unmute him by calling the muteRemoteAudio("denny",false) interface.
      // Unmute user with id denny
trtcCloud.muteRemoteAudio("denny", false);

      Step 9. Exit the room

      You can call the exitRoom interface to exit the current room. The SDK will notify you of the room exit completion with the onExitRoom(int reason) callback event.
      // Exit current room
      trtcCloud.exitRoom();
      
      // Register callback listener
      trtcCloud.registerListener(onTrtcListener);
      
      // Listen for the `onExitRoom` callback to get the reason for room exit
      onTrtcListener(type, params) async {
          if (type == TRTCCloudListener.onExitRoom) {
      if (param == 0) {
        print("Exit current room by calling the 'exitRoom' api of sdk ...");
      } else if (param == 1) {
        print("Kicked out of the current room by server through the restful api...");
      } else if (param == 2) {
        print("Current room is dissolved by server through the restful api...");
      }
    }
      }

      FAQs

      You can see the full list of functions and their descriptions in the API Reference.
      If you encounter any problems with access and use, please refer to FAQs.
      Contact Us

      Contact our sales team or business advisors to help your business.

      Contact Us
      Technical Support

      Open a ticket if you're looking for further assistance. Our Ticket is 7x24 avaliable.

      Submit a Ticket
      7x24 Phone Support
      Copyright © 2013-2024 Tencent Cloud. All Rights Reserved.
      Privacy PolicyLegalCookie Policy