tencent_float_chat_widget 1.0.0 copy "tencent_float_chat_widget: ^1.0.0" to clipboard
tencent_float_chat_widget: ^1.0.0 copied to clipboard

PlatformAndroidiOS
unlisted

A plugin providing a floating chat widget integrated with Tencent's chat services for real-time messaging.

tencent_float_chat_widget #

Demonstrates how to use the tencent_float_chat_widget plugin.

Getting Started #

Complete Project Configuration #

Since the tencent_float_chat_widget has utilized the relevant features of the GetX state management library, you need to use GetMaterialApp instead of MaterialApp in your application. Or you can set the navigatorKey property in your MaterialApp to Get.key to achieve the same effect.

// This step requires importing the get package before proceeding. 
// Since the rtc_conference_tui_kit already has a dependency on get, you don't need to make any additional configurations in your pubspec.yaml.
import 'package:get/get.dart';  

class MyApp extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
    return GetMaterialApp(  // Use GetMaterialApp to replace MaterialApp
        // Your original MaterialApp content
    );
    }
}

Login #

Before using the floating chat component, you need to initialize and log in to IM:

import 'package:tencent_cloud_chat_sdk/enum/V2TimSDKListener.dart';
import 'package:tencent_cloud_chat_sdk/enum/log_level_enum.dart';
import 'package:tencent_cloud_chat_sdk/models/v2_tim_callback.dart';
import 'package:tencent_cloud_chat_sdk/tencent_im_sdk_plugin.dart';

// Initialize
var initResult = await TencentImSDKPlugin.v2TIMManager.initSDK(
    sdkAppID: SDKAPPID,                     // Replace with your SDKAPPID
    loglevel: LogLevelEnum.V2TIM_LOG_INFO,  // Log registration level
    listener: V2TimSDKListener(),           // Event listener. When using the floating chat, pass an empty object here.
);
    
if (initResult.code == 0) { // Initialized successfully
    // Login   
    V2TimCallback imLoginResult = await TencentImSDKPlugin.v2TIMManager.login(
        userID: 'userId',   // Replace with your userID
        userSig: 'userSig', // Replace with your userSig
    );
}

Use tencent_float_chat_widget #

Introduce the floating chat

tencent_float_chat_widget provides two widgets:

  • FloatChatWidget: Contains a widget to display chat messages and a button widget to send messages. Clicking this button will pop up the input box and keyboard.
  • InputWidget: The input box and emoji widget for sending messages. You need to place this widget at the top of the stack on the page where you place the floating chat component to avoid the input box being covered or conflicting with other components.

Clear State

When you exit the page containing the floating chat component (i.e., when the floating chat component is destroyed), you need to manually clear its content and state (if you use the GetX state management library to navigate to the page containing the floating chat component, you can ignore this step):

import 'package:tencent_float_chat_widget/tencent_float_chat_widget.dart';

FloatChatManager().deleteStatus();

Note:

The current floating chat feature only supports using one object at a time. If you need to use different objects on multiple pages, please clear the state of the previous object before initializing a new FloatChatWidget.

0
likes
130
pub points
3%
popularity

Publisher

verified publishertrtc.io

A plugin providing a floating chat widget integrated with Tencent's chat services for real-time messaging.

Homepage
Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (LICENSE)

Dependencies

extended_text, extended_text_field, flutter, fluttertoast, get, tencent_cloud_chat_sdk

More

Packages that depend on tencent_float_chat_widget