Search Conversation Screen
Introduction
The Search Conversation Screen (LMChatSearchConversationScreen
) provides a unified interface to search conversations in a chatroom. Developers can customize the UI, interactions, and loading logic using the associated builder, setting, and style classes.
1. LMChatSearchConversationScreen
Widget
File Location:
search_conversation.dart
Class Declaration
class LMChatSearchConversationScreen extends StatefulWidget {
static const routeName = '/searchConversation';
/// The chatroom id where the search will be performed.
final int chatRoomId;
const LMChatSearchConversationScreen({super.key, required this.chatRoomId});
State<LMChatSearchConversationScreen> createState() =>
_LMChatSearchConversationScreenState();
}
This screen initiates a search experience scoped to a specific chatRoomId
. The widget uses a PagingController
for infinite scroll and a Bloc
for handling state updates.
2. LMSearchBuilderDelegate
File Location:
builder.dart
Class Declaration
class LMSearchBuilderDelegate {
const LMSearchBuilderDelegate();
}
The LMSearchBuilderDelegate
provides 6 methods for customizing the Participants Screen. Below are three key methods.
Methods in LMSearchBuilderDelegate
(3 out of 13 shown)
appBarBuilder
Definition: Builds the app bar for the Participants Screen.
Purpose: Customizes the app bar’s layout, title, and actions.Usage Example:
PreferredSizeWidget appBarBuilder(
BuildContext context,
LMChatAppBar appBar,
) {
return appBar;
}
backButton
Definition: Builds the back button for the search screen.
Purpose: Customizes the back button's appearance and behavior.Usage Example:
Widget backButton(BuildContext context, LMChatButton backButton) {
return backButton;
}firstPageProgressIndicatorBuilder
Definition: Builds the loading indicator for the first page of participants.
Purpose: Customizes the loading animation during the initial fetch.Usage Example:
Widget firstPageProgressIndicatorBuilder(BuildContext context) {
return CircularProgressIndicator();
}
Remaining Methods (10 more)
Explore the complete list of methods here.
3. LMSearchSetting
File Location:
setting.dart
class LMSearchSetting {
const LMSearchSetting();
}
- Purpose: Provides configuration settings for the Search in Chatroom Screen. No additional fields or methods are defined.
4. LMSearchStyle
File Location:
style.dart
class LMSearchStyle {
const LMSearchStyle();
}
- Purpose: Provides style configurations for the Search in Chatroom Screen. No additional fields or methods are defined.
5. LMChatParticipantConfig
File Location:
config.dart
Class Declaration
class LMSearchConversationConfig {
final LMSearchBuilderDelegate builder;
final LMSearchSetting setting;
final LMSearchStyle style;
const LMSearchConversationConfig({
this.builder = const LMSearchBuilderDelegate(),
this.setting = const LMSearchSetting(),
this.style = const LMSearchStyle(),
});
}
Usage Example: Injecting Custom Configuration
Create a Custom Builder:
class CustomSearchBuilder extends LMSearchBuilderDelegate {
Widget conversationTile(BuildContext context, LMChatConversationViewData conversation, LMChatTile conversationTile) {
return ListTile(
title: conversationTile.title,
subtitle: Text("Tap to view conversation"),
trailing: Icon(Icons.arrow),
);
}
}Pass Custom Style or Setting along with Builder:
final customSearchStyle = LMChatParticipantStyle();
final customSearchSetting = LMChatParticipantSetting();Inject the Custom Builder, Style, or Setting into the Config:
final searchConfig = LMSearchConversationConfig(
builder: CustomSearchBuilder(),
style: customSearchStyle,
setting: customSearchSetting,
);Initialize with Custom Config:
LMChatCore.instance.initialize(
config: LMChatConfig(
searchConversationConfig: searchConfig,
),
);
6. Summary
The Search Conversation Screen enables users to search through conversations within a specific chatroom. It supports features like infinite scrolling, custom UI elements, and state management. Developers can use the Developers can use LMSearchBuilderDelegate
to customize key components like the app bar and conversationTile. Additional customization can be achieved through LMSearchConversationConfig
by injecting custom builders, styles, and settings.