SystemMessage not appearing.

[moritz4]

Hi,

I am following the example from the Getting Started page. I insert a textMessage and a systemMessage, but only the textMassage is appearing in the chat. Do I need to apply custom rendering to systemMessages to make them appear?

import 'dart:math';

import 'package:flutter/material.dart';
import 'package:flutter_chat_core/flutter_chat_core.dart';
import 'package:flutter_chat_ui/flutter_chat_ui.dart';

class Basic extends StatefulWidget {
  const Basic({super.key});

  @override
  BasicState createState() => BasicState();
}

class BasicState extends State<Basic> {
  final _chatController = InMemoryChatController();

  @override
  void dispose() {
    _chatController.dispose();
    super.dispose();
  }

  @override
  void initState() {
    super.initState();

    final systemMessageTest = SystemMessage(
      id: '12345',
      authorId: 'system',
      text: 'System message',
    );

    final textMessageTest = TextMessage(
      id: '12346',
      authorId: 'system',
      text: 'Text message',
    );
    _chatController.insertMessage(textMessageTest);
    _chatController.insertMessage(systemMessageTest);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Chat(
        builders: Builders(
          chatAnimatedListBuilder: (context, itemBuilder) {
            return ChatAnimatedListReversed(itemBuilder: itemBuilder);
          },
        ),
        chatController: _chatController,
        currentUserId: 'user3',
        onMessageSend: (text) {
          _chatController.insertMessage(
            TextMessage(
              // Better to use UUID or similar for the ID - IDs must be unique
              id: '${Random().nextInt(1000) + 1}',
              authorId: 'user3',
              createdAt: DateTime.now().toUtc(),
              text: text,
            ),
          );
        },
        resolveUser: (UserID id) async {
          return User(id: id, name: 'Mary Doe');
        },
      ),
    );
  }
}

[moritz4]

Answered my own question after a bit of research:

 @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Chat(
        builders: Builders(
          chatAnimatedListBuilder: (context, itemBuilder) {
            return ChatAnimatedListReversed(itemBuilder: itemBuilder);
          },
          systemMessageBuilder:
              (
                BuildContext context,
                SystemMessage message,
                int messageWidth, {
                MessageGroupStatus? groupStatus,
                required bool isSentByMe,
              }) {
                return Center(
                  child: Container(
                    padding: const EdgeInsets.all(8.0),
                    margin: const EdgeInsets.symmetric(vertical: 4.0),
                    decoration: BoxDecoration(
                      color: const Color.fromARGB(63, 255, 149, 0),
                      borderRadius: BorderRadius.circular(8),
                    ),
                    child: Text(
                      message.text,
                      textAlign: TextAlign.center,
                      style: const TextStyle(color: Colors.black),
                    ),
                  ),
                );
              },
        ),
        chatController: _chatController,
        currentUserId: 'user3',
        onMessageSend: (text) {
          _chatController.insertMessage(
            TextMessage(
              // Better to use UUID or similar for the ID - IDs must be unique
              id: '${Random().nextInt(1000) + 1}',
              authorId: 'user3',
              createdAt: DateTime.now().toUtc(),
              text: text,
            ),
          );
        },
        resolveUser: (UserID id) async {
          return User(id: id, name: 'Mary Doe');
        },
      ),
    );
  }
}