Flutter 聊天气泡/语音气泡小部件

chat_bubbles 插件

Flutter 聊天气泡组件，类似于 Whatsapp 和更多形状。易于使用和实现聊天气泡。

入门

将此添加到您的包的 pubspec.yaml 文件中

dependencies:
  chat_bubbles: ^1.0.0+3

用法

然后您只需导入该包

import 'package:chat_bubbles/chat_bubbles.dart'

现在您可以使用此插件来实现各种类型的聊天气泡和日期芯片。

示例

单个气泡示例

  BubbleSpecialOne(
    text: 'Hi, How are you? ',
    isSender: false,
    color: Colors.purple.shade100,
    textStyle: TextStyle(
      fontSize: 20,
      color: Colors.purple,
      fontStyle: FontStyle.italic,
      fontWeight: FontWeight.bold,
    ),
  ),

日期芯片示例

  DateChip(
    date: new DateTime(2021, 5, 7),
    color: Color(0x558AD3D5),
  ),

主示例（聊天视图）

   final now = new DateTime.now();
   return Scaffold(
     appBar: AppBar(
       title: Text(widget.title),
     ),
     body: Center(
       child: SingleChildScrollView(
         child: Column(
           mainAxisAlignment: MainAxisAlignment.center,
           children: <Widget>[
             BubbleNormal(
               text: 'bubble normal with tail',
               isSender: false,
               color: Color(0xFF1B97F3),
               tail: true,
               textStyle: TextStyle(
                 fontSize: 20,
                 color: Colors.white,
               ),
             ),
             BubbleNormal(
               text: 'bubble normal with tail',
               isSender: true,
               color: Color(0xFFE8E8EE),
               tail: true,
               sent: true,
             ),
             DateChip(
               date: new DateTime(now.year, now.month, now.day - 2),
             ),
             BubbleNormal(
               text: 'bubble normal without tail',
               isSender: false,
               color: Color(0xFF1B97F3),
               tail: false,
               textStyle: TextStyle(
                 fontSize: 20,
                 color: Colors.white,
               ),
             ),
             BubbleNormal(
               text: 'bubble normal without tail',
               color: Color(0xFFE8E8EE),
               tail: false,
               sent: true,
               seen: true,
               delivered: true,
             ),
             BubbleSpecialOne(
               text: 'bubble special one with tail',
               isSender: false,
               color: Color(0xFF1B97F3),
               textStyle: TextStyle(
                 fontSize: 20,
                 color: Colors.white,
               ),
             ),
             DateChip(
               date: new DateTime(now.year, now.month, now.day - 1),
             ),
             BubbleSpecialOne(
               text: 'bubble special one with tail',
               color: Color(0xFFE8E8EE),
               seen: true,
             ),
             BubbleSpecialOne(
               text: 'bubble special one without tail',
               isSender: false,
               tail: false,
               color: Color(0xFF1B97F3),
               textStyle: TextStyle(
                 fontSize: 20,
                 color: Colors.black,
               ),
             ),
             BubbleSpecialOne(
               text: 'bubble special one without tail',
               tail: false,
               color: Color(0xFFE8E8EE),
               sent: true,
             ),
             BubbleSpecialTwo(
               text: 'bubble special tow with tail',
               isSender: false,
               color: Color(0xFF1B97F3),
               textStyle: TextStyle(
                 fontSize: 20,
                 color: Colors.black,
               ),
             ),
             DateChip(
               date: now,
             ),
             BubbleSpecialTwo(
               text: 'bubble special tow with tail',
               isSender: true,
               color: Color(0xFFE8E8EE),
               sent: true,
             ),
             BubbleSpecialTwo(
               text: 'bubble special tow without tail',
               isSender: false,
               tail: false,
               color: Color(0xFF1B97F3),
               textStyle: TextStyle(
                 fontSize: 20,
                 color: Colors.black,
               ),
             ),
             BubbleSpecialTwo(
               text: 'bubble special tow without tail',
               tail: false,
               color: Color(0xFFE8E8EE),
               delivered: true,
             ),
           ],
         ),
       ),
     ),
   );

GitHub

https://github.com/prahack/chat_bubbles