nice_chat_bubble 是一个用于 Flutter 的聊天气泡插件，可以帮助你轻松地在应用中创建类似于聊天应用中的消息气泡。它提供了多种自定义选项，例如气泡颜色、边框、圆角、阴影等。

安装 nice_chat_bubble

首先，你需要在 pubspec.yaml 文件中添加 nice_chat_bubble 依赖：

dependencies:
  flutter:
    sdk: flutter
  nice_chat_bubble: ^1.0.0  # 请查看最新版本

然后运行 flutter pub get 来安装依赖。

使用 nice_chat_bubble

基本用法

import 'package:flutter/material.dart';
import 'package:nice_chat_bubble/nice_chat_bubble.dart';

class ChatScreen extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Chat Bubble Example'),
      ),
      body: ListView(
        children: [
          // 发送者消息气泡
          NiceChatBubble(
            message: 'Hello, how are you?',
            isSender: true,
            color: Colors.blue,
            textColor: Colors.white,
          ),
          SizedBox(height: 10),
          // 接收者消息气泡
          NiceChatBubble(
            message: 'I\'m fine, thank you!',
            isSender: false,
            color: Colors.grey[300],
            textColor: Colors.black,
          ),
        ],
      ),
    );
  }
}

自定义选项

nice_chat_bubble 提供了多种自定义选项，例如：

• message: 消息内容。
• isSender: 是否为发送者消息。
• color: 气泡背景颜色。
• textColor: 消息文本颜色。
• borderRadius: 气泡的圆角半径。
• borderColor: 气泡边框颜色。
• borderWidth: 气泡边框宽度。
• shadowColor: 气泡阴影颜色。
• shadowOffset: 气泡阴影偏移量。
• shadowBlurRadius: 气泡阴影模糊半径。
• padding: 气泡内边距。
• margin: 气泡外边距。

NiceChatBubble(
  message: 'Customized chat bubble',
  isSender: true,
  color: Colors.green,
  textColor: Colors.white,
  borderRadius: BorderRadius.circular(20),
  borderColor: Colors.black,
  borderWidth: 2,
  shadowColor: Colors.grey,
  shadowOffset: Offset(2, 2),
  shadowBlurRadius: 5,
  padding: EdgeInsets.all(12),
  margin: EdgeInsets.symmetric(vertical: 5, horizontal: 10),
),

完整示例

以下是一个完整的示例，展示了如何在 Flutter 应用中使用 nice_chat_bubble 插件：

import 'package:flutter/material.dart';
import 'package:nice_chat_bubble/nice_chat_bubble.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Nice Chat Bubble Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: ChatScreen(),
    );
  }
}

class ChatScreen extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Chat Bubble Example'),
      ),
      body: ListView(
        children: [
          NiceChatBubble(
            message: 'Hello, how are you?',
            isSender: true,
            color: Colors.blue,
            textColor: Colors.white,
          ),
          SizedBox(height: 10),
          NiceChatBubble(
            message: 'I\'m fine, thank you!',
            isSender: false,
            color: Colors.grey[300],
            textColor: Colors.black,
          ),
          SizedBox(height: 10),
          NiceChatBubble(
            message: 'Customized chat bubble',
            isSender: true,
            color: Colors.green,
            textColor: Colors.white,
            borderRadius: BorderRadius.circular(20),
            borderColor: Colors.black,
            borderWidth: 2,
            shadowColor: Colors.grey,
            shadowOffset: Offset(2, 2),
            shadowBlurRadius: 5,
            padding: EdgeInsets.all(12),
            margin: EdgeInsets.symmetric(vertical: 5, horizontal: 10),
          ),
        ],
      ),
    );
  }
}