tencent cloud

To quickly implement the audio call feature, you can use the demo we provide and adapt it to your needs. You can also use the TRTCCalling component and customize your own UI.

Using the Demo UI

Step 1. Create an application

1. Log in to the TRTC console and select Development Assistance > Demo Quick Run.
2. Enter an application name such as TestAudioCall, and click Create.

Note：

This feature uses two basic PaaS services of Tencent Cloud, namely TRTC and IM. When you activate TRTC, IM will be activated automatically. IM is a value-added service. See Pricing for its billing details.

Step 2. Download the SDK and demo source code

1. Download the SDK and demo source code for your platform.
2. Click Next.
   

Step 3. Configure the demo project file

1. In the Modify Configuration step, select your platform.
2. Find and open /example/lib/debug/GenerateTestUserSig.dart.
3. Set parameters in GenerateTestUserSig.dart as follows.
   • SDKAPPID: a placeholder by default. Set it to the actual `SDKAppID`.
   • `SECRETKEY`: a placeholder by default. Set it to the actual key.
   
4. Click Next to complete the creation.
5. After compilation, click Return to Overview Page.

Note：

• The method for generating UserSig described in this document involves configuring SECRETKEY in client code. In this method, SECRETKEY may be easily decompiled and reversed, and if your key is leaked, attackers can steal your Tencent Cloud traffic. Therefore, this method is only suitable for the local execution and debugging of the demo.
• The correct UserSig distribution method is to integrate the calculation code of UserSig into your server and provide an application-oriented API. When UserSig is needed, your application can send a request to the business server for a dynamic UserSig. For more information, see How do I calculate UserSig on the server?.

Step 4. Run the demo

Note：

An Android project must be run on a real device rather than a simulator.

1. Run flutter pub get.
2. Compile, run, and test the project.
   • Android
   • iOS

   1. Run flutter run.
   2. Open the demo project with Android Studio (3.5 or above), and click Run.

   1. Open \ios project in the source code directory with Xcode (11.0 or above).
   2. Compile and run the demo project.

Step 5. Modify the demo source code

The TRTCCallingDemo folder in the source code contains two subfolders: ui and model. The ui folder contains the UI code.

Customizing UI

The TRTCCallingDemo folder in the source code contains two subfolders: ui and model. The model subfolder contains the reusable open-source component TRTCCalling. You can find the component's APIs in TRTCCalling.dart.

You can use the open-source component TRTCCalling to customize your own UI. This means you will use the model of the demo but design the UI by yourself.

Step 1. Integrate the SDK

The audio/video call component TRTCCalling depends on the TRTC SDK and IM SDK. You can configure pubspec.yaml to download their updates automatically.

Add the following dependencies to pubspec.yaml of your project.

dependencies:
 tencent_trtc_cloud: latest version number
 tencent_im_sdk_plugin: latest version number

Step 2. Configure permission requests and obfuscation rules

<key>NSMicrophoneUsageDescription</key>
<string>Audio calls are possible only with mic access.</string>

Step 3. Import the TRTCCalling component

Copy all the files in model to your project.

/lib/TRTCCallingDemo/model

Step 4. Initialize the component and log in

1. Call TRTCCalling.sharedInstance() to get an instance of the component.
2. Call login(SDKAppID, userId, userSig) to log in to the component. For the key parameters passed in, see the table below.

   Parameter	Description
   SDKAppID	You can view `SDKAppID` in the TRTC console.
   userId	ID of the current user, which is a string that can contain only letters (a-z and A-Z), digits (0-9), hyphens (-), and underscores (_). We recommend that you keep it in line with your user account system.
   userSig	Tencent Cloud's proprietary security signature. For how to calculate and use a signature, please see UserSig.

   // Initialize
   sCall = await TRTCCalling.sharedInstance();
   sCall.login(1400000123, "userA", "xxxx");

Step 5. Make a one-to-one audio call

1. The caller calls call() of TRTCCalling, passing in the user ID of the callee (userid) and call type (type). For an audio call, the call type should be TRTCCalling.typeAudioCall.
2. The callee, if logged in, will receive the onInvited() callback and can start the corresponding view based on the call type set by the inviter, which is represented by callType in the callback.
3. The callee can call accept() to answer the call and openCamera() to turn the local camera on. He or she can also call reject() to reject the call.
4. After communication is established between the caller and callee, they will both receive the onUserAudioAvailable() event notification, which indicates that they have received each other’s audio. Remote audio will be played back automatically by default.

Component APIs

The table below lists the APIs of the TRTCCalling component.