Chatroom Screen

Introduction

The Chatroom Screen (LMChatroomScreen) serves as the primary interface for conversations. It enables users to engage in group or direct chats with customizable features such as chat bubbles, app bars, and floating action buttons.

---

1. LMChatroomScreen Widget

File Location:
chatroom.dart

Class Declaration

class LMChatroomScreen extends StatefulWidget {
  static const routeName = '/chatroom';

  /// The ID of the chatroom.
  final int chatroomId;

  const LMChatroomScreen({
    Key? key,
    required this.chatroomId,
  }) : super(key: key);

  @override
  State<LMChatroomScreen> createState() => _LMChatroomScreenState();
}

The LMChatroomScreen widget renders the chat interface, providing access to message threads and chatroom-level features.

---

2. LMChatroomBuilderDelegate

File Location:
builder.dart

Class Declaration

class LMChatroomBuilderDelegate {
  const LMChatroomBuilderDelegate();
}

The LMChatroomBuilderDelegate offers 9 methods for customizing the chatroom interface. Below are three key methods.

Methods in LMChatroomBuilderDelegate (3 out of 9 shown)

1. sendButton
   Definition: Builds the send button for messages.
   Purpose: Customizes the appearance and behavior of the send button.

   Usage Example:

   @override
   Widget sendButton(BuildContext context, LMChatButton button) {
     return button.copyWith(
       style: button.style.copyWith(backgroundColor: Colors.green),
     );
   }

2. editButton
   Definition: Builds the edit button for messages.
   Purpose: Customizes the layout of the edit button in message options.

   Usage Example:

   @override
   Widget editButton(BuildContext context, LMChatButton button) {
     return button;
   }

3. copyButton
   Definition: Builds the copy button for copying messages.
   Purpose: Allows customization of the copy button’s style.

   Usage Example:

   @override
   Widget copyButton(BuildContext context, LMChatButton button) {
     return button.copyWith(
       style: button.style.copyWith(icon: Icons.copy),
     );
   }

Remaining Methods (6 more)

Explore the complete list of methods here.

---

3. LMChatroomSetting

File Location:
setting.dart

class LMChatroomSetting {
  const LMChatroomSetting();
}

• Purpose: Defines configuration settings for the Chatroom Screen. No fields or methods are currently defined.

---

4. LMChatroomStyle

File Location:
style.dart

class LMChatroomStyle {
  const LMChatroomStyle();
}

• Purpose: Provides styling options for the Chatroom Screen. No additional fields or methods are currently defined.

---

5. LMChatroomConfig

File Location:
config.dart

Class Declaration

class LMChatroomConfig {
  final LMChatroomBuilderDelegate builder;
  final LMChatroomSetting setting;
  final LMChatroomStyle style;

  const LMChatroomConfig({
    this.builder = const LMChatroomBuilderDelegate(),
    this.setting = const LMChatroomSetting(),
    this.style = const LMChatroomStyle(),
  });
}

Usage Example: Injecting Custom Configuration

1. Create a Custom Builder:

   class CustomChatroomBuilder extends LMChatroomBuilderDelegate {
     @override
     Widget sendButton(BuildContext context, LMChatButton button) {
       return button.copyWith(
         style: button.style.copyWith(backgroundColor: Colors.purple),
       );
     }
   }

2. Pass Custom Style or Setting along with Builder:

   final customStyle = LMChatroomStyle();
   final customSetting = LMChatroomSetting();

3. Inject the Custom Builder, Style, or Setting into the Config:

   final chatroomConfig = LMChatroomConfig(
     builder: CustomChatroomBuilder(),
     style: customStyle,
     setting: customSetting,
   );

4. Initialize with Custom Config:

   LMChatCore.instance.initialize(
     config: LMChatConfig(
       chatroomConfig: chatroomConfig,
     ),
   );

---

6. Summary

The Chatroom Screen enables users to engage in conversations with customizable elements such as chat bubbles and buttons. Developers can modify core components using LMChatroomBuilderDelegate and inject configurations through LMChatroomConfig. This ensures that the chatroom experience meets specific design requirements.