WebRTC Trtc Logo
Tencent RTC Blog
Tutorial

Personal Info Settings to Your Flutter Project with 1 Line of Code

Tencent RTC - Dev Team

Personal Info Settings to Your Flutter Project with 1 Line of Code.png

In order to provide a personalized experience for users in your audio/video calling project, Tencent RTC Call (TUICallKit) offers a custom service to set your exclusive nickname and avatar photo. You could integrate the Tencent RTC Call (TUICallKit) component into your Flutter project (Flutter 3.0 or higher version).

Video Tutorial

To customize your nickname or profile photo, use the following API for update:

TUIResult result = TUICallKit.instance.setSelfInfo('userName', 'url:********');

note of the update of callee's nickname and profile photo.png

Step 0: Hand login asynchronous flow


As the login function in the Tencent RTC Call (TUICallKit)'s interface is an asynchronous flow, we need to make a simple modification to the relevant code as shown in the following steps:

  • Add 'async' after the parentheses of the ' _initCallkit() ' function.
  • Add 'await' before the ' TUICallKit.instance.login() ' function in the body of the ' _initCallkit() ' function.

login function before modification.png

image 1: before modification

login function after modification.png

image 2: after modification

Step 1: Customize personal information


Use the API provided by Tencent RTC (TUICallKit) to modify the nickname and avatar. Let's copy this line of code and navigate to your Flutter project to paste it.

TUIResult result = TUICallKit.instance.setSelfInfo('userName', 'url:********');

Then pass our user nickname and avatar URL in string format, like this:

the modifocation of setSelfInfo interface.png

image 3: modification interface

This is just an example, and you can modify them to your liking as long as you pass them in string format. Now the interface call is ready.

step 2:Run your program


Let's compile and run your code. And then you can open another device and initiate an audio call to "6666".

initiate an audio call between 2 devices.png

image 4: two prepared devices

After connecting, you will see the basic information of "6666" with "TUICalkit" as his nickname and the newly set avatar as the URL we just passed in on the other device. On the "6666" device, you will see that the user who initiated the audio call has the nickname "8888" and his avatar is displayed.

make a audio call.png

image 5: making a call

We answer the call and it works fine.

answering the audio call.png

image 6: answering the call

Conclusion


Now by using the Tencent RTC Call (TUICallKit) interface, customizing nicknames and avatars is complete. If you have more advanced requirements such as AI-powered noise cancellation and spatial audio, we offer a fully customized audio/video communication SDK & API family for web, mobile, and games. Tailor your video communication experience to meet your specific needs and captivate your audience with Tencent RTC.

If you have any questions or need assistance, our support team is always ready to help. Please feel free to get in touch with us, or join us in Discord.

Set Up
Call
Build App
Related Product
CallCall

High-quality video and voice call experience on any platform

Get 10,000 free minutes here.
Get Started for Free
Talk to Our Expert
Submit

By clicking the submit button, you agree to allow Tencent Real-Time Communication to store and process the information above for contact purposes. Please read our Privacy Policy