tencent cloud

Chat

문서Chat

Flutter

포커스 모드
폰트 크기
마지막 업데이트 시간: 2026-03-02 17:41:33

Component Overview

ConversationList is a UI component that displays and manages user chat conversations. It provides a robust feature set for conversation listing—enabling users to view conversations and perform key actions directly from the list.
Conversation List
Conversation Actions



Component Integration

ConversationList is part of the TUIKit Flutter package. To add ConversationList to your project, integrate TUIKit Flutter following the TUIKit Flutter documentation.

Component Structure

ConversationList exposes only its initialization method. All other internal logic is handled within the component itself.

Public Methods

Method Name
Parameters
Description
ConversationList
onConversationClick: (ConversationInfo conversation) {}
Sets the callback for conversation cell clicks.
config: ConversationActionConfigProtocol
Initializes the component and configures action menu items (optional).
customActions: List
Initializes the component and defines custom action options (optional).

Basic Usage

Initialize ConversationList directly, providing an onConversationClick callback.
Parameter Name
Type
Description
onConversationClick
(ConversationInfo conversation) {}
Callback that is invoked when a conversation cell is selected.
Sample code:
Expanded(
  child: ConversationList(
    onConversationClick: (conversation) {
      // We recommend navigating to the chat page here
    },
  ),
),

Customization

You can customize the actions available in the conversation list using the following methods.

Method 1: Hide Conversation Action Items Locally

Provide a custom config when initializing ConversationList to control which menu items are visible:
Expanded(
  child: ConversationList(
    config: ChatConversationActionConfig(
      isSupportDelete: true,
      isSupportPin: true,
      isSupportClearHistory: false
    ),
    onConversationClick: (conversation) {
      // Navigate to chat page on conversation cell click
    },
  ),
),
Supported Action Toggles
Action Type
Description
isSupportDelete
Enable or disable conversation deletion.
isSupportPin
Enable or disable Pin Conversation.
isSupportClearHistory
Enable or disable clearing chat history.

Method 2: Add Custom Conversation Action Items Locally

Pass customActions during initialization to append custom actions below the default options.
Parameter Name
Type
Description
customActions
List
Custom actions shown in the conversation action menu.
Sample code:
Expanded(
  child: ConversationList(
    customActions: [
      ConversationCustomAction(
        title: 'Share',
        action: (conversation) {
          print('Share conversation: ${conversation.title}');
        })
    ],
  ),
),

Method 3: Configure Actions Globally

Set global configuration via AppBuilder:
// Configure at app startup; if omitted, the feature is not supported
await AppBuilder.init();
AppBuilder.getInstance().conversationListConfig = ConversationListConfig(
    conversationActionList: [
      AppBuilder.CONVERSATION_ACTION_DELETE,
      AppBuilder.CONVERSATION_ACTION_PIN,
      AppBuilder.CONVERSATION_ACTION_CLEAR_HISTORY
    ],
    // ... other required properties
);

// Then, initialize ConversationList. All ConversationList instances will inherit the above action configuration.
Expanded(
  child: ConversationList(
    onConversationClick: (conversation) {
      // You can navigate to the chat page here
    },
  ),
),
Note：
Local configuration takes precedence over global configuration.
Below are examples of customization effects:
Conversation Actions (Default Options)
Conversation Actions (Delete Option Hidden)
Conversation Actions (Share Option Added)



다음 주제: 제품 개요

도움말 및 지원

문제 해결에 도움이 되었나요?

피드백