Flutter富文本编辑插件easy_rich_text的使用

easy_rich_text 是一个简化了Flutter中RichText使用的插件。通过使用正则表达式，它能够高效地根据定义在 EasyRichTextPattern 列表中的模式分割字符串，从而实现文本样式的多样化。

安装

首先，在您的 pubspec.yaml 文件中添加依赖：

dependencies:
  easy_rich_text: '^2.0.0'

然后运行 flutter pub get 来安装包。

示例Demo

下面是一个完整的示例demo，展示了如何使用 easy_rich_text 插件来创建各种样式的富文本。

主要功能演示

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'EasyRichText Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'EasyRichText Demo'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Padding(
        padding: const EdgeInsets.all(8.0),
        child: SingleChildScrollView(
          child: Column(
            children: <Widget>[
              // 简单示例
              EasyRichText(
                "I want blue font. I want bold font. I want italic font.",
                patternList: [
                  EasyRichTextPattern(
                    targetString: 'blue',
                    style: TextStyle(color: Colors.blue),
                  ),
                  EasyRichTextPattern(
                    targetString: 'bold',
                    style: TextStyle(fontWeight: FontWeight.bold),
                  ),
                  EasyRichTextPattern(
                    targetString: 'italic',
                    style: TextStyle(fontStyle: FontStyle.italic),
                  ),
                ],
              ),
              // 商标示例
              EasyRichText(
                "ProductTM is a superscript trademark symbol. This TM is not a trademark.",
                patternList: [
                  EasyRichTextPattern(
                    targetString: 'TM',
                    superScript: true,
                    stringBeforeTarget: 'Product',
                    matchWordBoundaries: false,
                    style: TextStyle(color: Colors.blue),
                  ),
                ],
              ),
              // 默认样式
              EasyRichText(
                "This is a EasyRichText example with default grey font. I want blue font here.",
                defaultStyle: TextStyle(color: Colors.grey),
                patternList: [
                  EasyRichTextPattern(
                    targetString: 'blue',
                    style: TextStyle(color: Colors.blue),
                  ),
                ],
              ),
              // 可选文本
              EasyRichText(
                "This paragraph is selectable...",
                selectable: true,
              ),
            ],
          ),
        ),
      ),
    );
  }
}

这个例子展示了如何设置不同的文本样式（如颜色、粗体、斜体）、处理商标符号、设置默认样式以及如何让文本可选择。您可以根据需要扩展此示例，探索更多功能，例如条件匹配、匹配选项、上标和下标、大小写敏感性、URL链接等。

通过这些基本示例，您应该能够快速上手并开始构建自己的富文本显示组件。如果对某个特定功能感兴趣或有疑问，请参考插件的官方文档或源码获取更多信息。