chat_ui_kit

Um kit de interface do usuário de bate -papo completo

Este pacote Flutter fornece uma estrutura de base, bem como um conjunto de ferramentas que permitem criar rapidamente uma interface do usuário de bate -papo moderna. Em vez de tentar encontrar todos os widgets que atendam às expectativas de todos, você recebe ajudantes que devem ser usados como exemplos e personalizados à vontade.

Características

• Suporte para conversas em grupo
• Lista de conversas (bate -papos)
• Avatar do grupo
• Crachá de mensagens não lidas
• Título da mensagem (usuário)
• Mensagem avatar
• Contêineres de mensagens adaptáveis, dependendo do posicionamento relativo
• Controladores com API de gerenciamento de dados (Adicionar, remover, atualizar)
• Gerenciamento de seleção automatizada
• Entrada de mensagens com eventos de digitação
• Exemplos para mensagens de texto, imagem, áudio e vídeo

Começando

Primeiro, adicione a seguinte linha às suas dependências pubSec.yaml:

chat_ui_kit : ^ [latest_version]

Em seguida, configure seus modelos para estender os modelos básicos:

 class ChatMessage extends MessageBase {
  //...

  ChatUser author;
  String text;

  @override
  DateTime get createdAt =>
      DateTime . fromMillisecondsSinceEpoch (creationTimestamp);

  @override
  String get id => messageId;

  @override
  String get url => attachment;

  @override
  MessageBaseType get messageType {
    //...
  }
}

 class ChatUser extends UserBase {
  //...

  @override
  String get name => username;

  @override
  String get id => userid;

  @override
  String get avatar => avatarURL;
}

 class Chat extends ChatBase {
  
  //...

  List < ChatUser > members;
  ChatMessage lastMessage;

  @override
  int get unreadCount => chat.unreadCount;

  @override
  String get name {
    if ((chat ? .name ?? null ). isNotNullOrEmpty ()) return chat.name;
    return membersWithoutSelf. map ((e) => e.username). toList (). join ( ", " );
  }

  @override
  String get id => chat ? .id;

  @override
  List < ChatUser > get membersWithoutSelf {
    List < ChatUser > membersWithoutSelf = [];
    final localUserId = chat ? .localUserId ??
        FirebaseAuth .instance.currentUser ? .uid;
    for ( ChatUser chatUser in members) {
      if (localUserId != chatUser.userid) membersWithoutSelf. add (chatUser);
    }
    return membersWithoutSelf;
  }
  
}

Chatslistscreen

 ChatsListController controller = ChatsListController ();

ChatsList (
    controller : _controller,
    appUserId : _currentUser.id,
    scrollHandler : _handleScrollEvent,
    groupAvatarStyle : GroupAvatarStyle (withSeparator : true ),
    builders : ChatsListTileBuilders (
        groupAvatarBuilder :
            (context, imageIndex, itemIndex, size, item) {
          final chat = item as Chat ;
          return CachedNetworkImage (
              cacheManager : CustomCacheManager (),
              imageUrl : chat.membersWithoutSelf[imageIndex].avatar,
              width : size.width,
              height : size.height,
              fit : BoxFit .cover,
              errorWidget : (ctx, url, val) =>
                  AppErrorWidget ( true , size : size));
        },
        lastMessageBuilder : _buildLastMessage,
        wrapper : _buildTileWrapper,
        dateBuilder : (context, date) => Padding (
            padding : EdgeInsets . only (left : 16 ),
            child : Text ( DateFormatter . getVerboseDateTimeRepresentation (
                context, date)))))

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

Cesca de bate -papo

 final MessagesListController _controller = MessagesListController ();

@override
void initState () {
  _controller.selectionEventStream. listen ((event) {
    setState (() {
      _selectedItemsCount = event.currentSelectionCount;
    });
  });
  super . initState ();
}

Widget _buildMessagesList () {
  IncomingMessageTileBuilders incomingBuilders = _isGroupChat
      ? IncomingMessageTileBuilders (
          bodyBuilder : (context, index, item, messagePosition) =>
              _buildMessageBody (context, index, item, messagePosition,
                  MessageFlow .incoming),
          avatarBuilder : (context, index, item, messagePosition) {
            final _chatMessage = item as ChatMessage ;
            return Padding (
                padding :
                    EdgeInsets . only (right : 16 ),
                child : _buildAvatarWithScore (_chatMessage.author));
          })
      : IncomingMessageTileBuilders (
          bodyBuilder : (context, index, item, messagePosition) =>
              _buildMessageBody (context, index, item, messagePosition,
                  MessageFlow .incoming),
          titleBuilder : null );

  return Expanded (
      child : MessagesList (
          controller : _controller,
          appUserId : _currentUser.id,
          useCustomTile : (i, item, pos) {
            final msg = item as ChatMessage ;
            return msg.isTypeEvent;
          },
          messagePosition : _messagePosition,
          builders : MessageTileBuilders (
              customTileBuilder : _buildEventMessage,
              customDateBuilder : _buildDate,
              incomingMessageBuilders : incomingBuilders,
              outgoingMessageBuilders : OutgoingMessageTileBuilders (
                  bodyBuilder : (context, index, item, messagePosition) =>
                      _buildMessageBody (context, index, item,
                          messagePosition, MessageFlow .outgoing)))));
}

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

Mais

Certifique -se de navegar na documentação inlagada da classe antes de fazer qualquer pergunta. Os PRs são muito bem -vindos!