Flutter文本渲染插件gemtext的使用

Flutter文本渲染插件gemtext的使用

Gemtext 是一种简单的标记语言解析器。

示例代码

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

// 导入 gemtext 包
import 'package:gemtext/gemtext.dart';

void main() {
  // 创建 Gemtext 对象并添加内容
  final res = (Gemtext()
        ..h1("arslee") // 添加一级标题
        ..text("hi! i build things.") // 添加普通文本
        ..preformatted(">o_o<", "Just a cute axolotl icon") // 添加预格式化文本
        ..h2("some links") // 添加二级标题
        ..link(Uri.parse("https://codeberg.org/arslee07"), "codeberg") // 添加链接
        ..link(Uri.parse("https://t.me/arslee07"), "telegram") // 添加链接
        ..link(Uri.parse("mailto://mail@arslee.me"), "email")) // 添加邮件链接
      .toString(); // 将结果转换为字符串

  // 解析生成的 Gemtext 字符串
  print(Gemtext.parse(res));
}

更多关于Flutter文本渲染插件gemtext的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter文本渲染插件gemtext的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


gemtext 是一个用于 Flutter 的文本渲染插件，主要用于将 Gemtext 格式的文本渲染为 Flutter 的 Widget。Gemtext 是 Gemini 协议中使用的一种轻量级标记语言，类似于 Markdown 但更简单。

安装 gemtext 插件

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

dependencies:
  flutter:
    sdk: flutter
  gemtext: ^1.0.0  # 请检查最新版本

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

使用 gemtext 插件

gemtext 插件提供了一个 GemtextWidget，可以将 Gemtext 格式的文本渲染为 Flutter 的 Widget。

基本用法

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

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Gemtext Example'),
        ),
        body: GemtextWidget(
          gemtext: '''
# 标题
## 子标题
### 三级标题

这是一段普通文本。

* 这是一个无序列表项
* 这是另一个无序列表项

> 这是一个引用。

=> https://example.com 这是一个链接
          ''',
        ),
      ),
    );
  }
}

自定义样式

你可以通过 GemtextWidget 的 style 参数来自定义不同 Gemtext 元素的样式。

GemtextWidget(
  gemtext: '''
# 标题
## 子标题
### 三级标题

这是一段普通文本。

* 这是一个无序列表项
* 这是另一个无序列表项

> 这是一个引用。

=> https://example.com 这是一个链接
  ''',
  style: GemtextStyle(
    heading1: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
    heading2: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
    heading3: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
    paragraph: TextStyle(fontSize: 14, color: Colors.black87),
    listItem: TextStyle(fontSize: 14, color: Colors.blue),
    blockquote: TextStyle(fontSize: 14, color: Colors.green),
    link: TextStyle(fontSize: 14, color: Colors.blue, decoration: TextDecoration.underline),
  ),
)

处理链接点击

你可以通过 onLinkTap 回调来处理链接的点击事件。

GemtextWidget(
  gemtext: '''
=> https://example.com 这是一个链接
  ''',
  onLinkTap: (String url) {
    print('链接被点击: $url');
    // 在这里处理链接点击事件，例如打开浏览器
  },
)
回到顶部