Host Prepare Page | Host Streaming Page | Live Stream List | Audience Viewing Page |
![]() | ![]() | ![]() | ![]() |
flutter pubaddtencent_live_uikit
Resolving dependencies...Downloading packages.........+ tencent_live_uikit x.x.x......Changed xx dependencies!xx packages have newer versions incompatible with dependency constraints.Try `flutter pub outdated` for more information.
android/app/build.gradle file:android {......buildTypes {release {......// configuration and activation obfuscation ruleminifyEnabled trueproguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'}}}
android/app/proguard-rules.pro file. If the file does not exist, create a new one:-keep class com.tencent.** { *; }
android/app/build.gradle file.android {......defaultConfig {......// Enable Multidex supportmultiDexEnabled true}}
AndroidManifest.xml, set MainActivity's android:supportsPictureInPicture to true:<manifest xmlns:android="http://schemas.android.com/apk/res/android"><application><activityandroid:name=".MainActivity"android:supportsPictureInPicture="true"</activity></application></manifest>
Non-Global Symbols. This is required to avoid runtime errors and ensure you can enter the room.ios/Podfile:target 'xxxx' do......end......post_install do |installer|installer.pods_project.targets.each do |target|flutter_additional_ios_build_settings(target)target.build_configurations.each do |config|config.build_settings['VALID_ARCHS'] = 'arm64 arm64e x86_64'config.build_settings['VALID_ARCHS[sdk=iphonesimulator*]'] = 'x86_64'endendend
<dict> in your iOS project’s Info.plist. These messages appear in the system permission dialogs:<key>NSCameraUsageDescription</key><string>CallingApp needs camera access. Video recording with picture only after enabling</string><key>NSMicrophoneUsageDescription</key><string>CallingApp needs mic access. Recorded video will have sound when enabled</string>
Info.plist, add these preprocessor definitions in your ios/Podfile to enable camera and microphone permissions:post_install do |installer|installer.pods_project.targets.each do |target|flutter_additional_ios_build_settings(target)target.build_configurations.each do |config|config.build_settings['GCC_PREPROCESSOR_DEFINITIONS'] ||= ['$(inherited)','PERMISSION_MICROPHONE=1','PERMISSION_CAMERA=1',]endendend

TUILiveKitNavigatorObserver.instance to navigatorObservers to track route changes and manage lifecycle events.localizationsDelegates to display UI text in the appropriate system language.import 'package:tencent_live_uikit/tencent_live_uikit.dart';// Your own APP main classclass XXX extends StatelessWidget {const XXX({super.key});@overrideWidget build(BuildContext context) {return MaterialApp(// Add TUILiveKit navigator observer to listen for page routing changes and lifecycle managementnavigatorObservers: [TUILiveKitNavigatorObserver.instance],// Add localized agent to support multilingual copywriting displaylocalizationsDelegates: [...LiveKitLocalizations.localizationsDelegates,...BarrageLocalizations.localizationsDelegates,...GiftLocalizations.localizationsDelegates],// Other configuration of your APP......);}}
TUILogin.login to authenticate. This step is required before you can use any TUILiveKit features. Make sure all parameters are set correctly.login after completing your own user authentication and login logic. This prevents business logic conflicts or data inconsistencies, and ensures TUILiveKit integrates smoothly with your user management and permission system.import 'package:tencent_cloud_uikit_core/tencent_cloud_uikit_core.dart';......login() async {await TUILogin.instance.login(1400000001, // replace with the SDKAppID from the open service console"denny", // replace with your UserID"xxxxxxxxxxx", // you can calculate a UserSig in the console and fill it in this locationTUICallback(onError: (code, message) {print("TUILogin login fail, {code:$code, message:$message}");},onSuccess: () async {print("TUILogin login success");},),);}
Parameter | Type | Description |
SDKAppID | Int | |
UserID | String | The unique ID for the current user. Must contain only English letters, numbers, hyphens, and underscores. |
UserSig | String | Authentication credential for TRTC. Please note: Development Environment: You can use the local GenerateTestUserSig.genTestSig function to generate a UserSig or generate a temporary UserSig via the UserSig Generation Tool.Production Environment: To prevent key leakage, you must use a server-side method to generate UserSig. For details, see Generating UserSig on the Server. |
MaterialApp home page is displayed on the rootNavigator. To support floating window live rooms (minimize the live window during streaming and keep it floating above other pages), add a secondary navigator (secondaryNavigator) above the rootNavigator and move your home page to secondaryNavigator. secondaryNavigator, which stays resident in the app to enable the floating window effect.import 'package:tencent_live_uikit/tencent_live_uikit.dart';import 'package:tencent_live_uikit/common/widget/global.dart';// Your own App's main classclass XXX extends StatelessWidget {const XXX({super.key});@overrideWidget build(BuildContext context) {return MaterialApp(// Homepage configurationhome: Navigator(// Global.secondaryNavigatorKey is the global navigation key provided by TUILiveKit to manage floating windows.key: Global.secondaryNavigatorKey,onGenerateRoute: (settings) => MaterialPageRoute(settings: const RouteSettings(name: 'home_widget'),builder: (BuildContext context) {// HomeWidget is your own application homepage widget, replace with your actual homepage classreturn const HomeWidget();},),),// Other configuration of your App......);}}
Feature | Description | Integration Guide |
Host Streaming | The complete workflow for a host to start a stream, including pre-stream setup and various in-stream interactions. | |
Audience Viewing | Audience can watch live streaming after entering the anchor's live streaming room, with features like audience mic connection, live room information, online audience, and bullet screen display. | |
Live Stream List | Display the live stream list interface and features, including the live stream list and room information display. |
TUILogin.login is sufficient. We recommend aligning TUILogin.login and TUILogin.logout with your own authentication logic.Non-Global Symbols to preserve the necessary global symbol information. Otherwise, runtime exceptions may prevent you from entering the room.Feedback