Flutter用于渲染文本表格的 Dart 插件barbecue的使用

barbecue简介

barbecue 是一个用于渲染文本表格的 Dart 包，特别适用于基于 CLI 的 Dart 应用程序。它移植自 Jake Wharton 的 picnic 项目，提供了丰富的表格样式和功能，如边框、填充、样式、文本对齐、行和列的跨越以及 ANSI 颜色支持。

主要特性

• 边框：支持自定义样式的边框。
• 填充：可以在单元格中添加填充。
• 样式：可以在表格、行或单元格级别应用样式。
• 文本对齐：支持上下左右的文本对齐方式。
• 行和列的跨越：可以创建跨越多行或多列的单元格。
• ANSI 颜色和背景：支持 ANSI 颜色和背景颜色。
• 有限的 emoji 和宽字符支持：部分支持 emoji 和其他宽字符。

示例代码

简单示例

import 'package:barbecue/barbecue.dart';

void main() {
  print(Table(
    tableStyle: TableStyle(border: true),
    header: TableSection(rows: [
      Row(
        cells: [
          Cell("ID"),
          Cell("Name"),
          Cell("Role"),
        ],
        cellStyle: CellStyle(borderBottom: true),
      ),
    ]),
    body: TableSection(
      cellStyle: CellStyle(paddingRight: 2),
      rows: [
        Row(cells: [
          Cell("42", style: CellStyle(alignment: TextAlignment.TopRight)),
          Cell("John Doe"),
          Cell("Secret Agent")
        ]),
        Row(cells: [
          Cell("4711"),
          Cell("Leanna E. Distefano"),
          Cell("Customer Support")
        ]),
        Row(cells: [Cell("1337"), Cell("Patrice Miller"), Cell("Accountant")])
      ],
    )
  ).render());
}

输出结果：

┌─────────────────────────────────────────────┐
│ID    Name                 Role              │
├─────────────────────────────────────────────┤
│  42  John Doe             Secret Agent      │
│4711  Leanna E. Distefano  Customer Support  │
│1337  Patrice Miller       Accountant        │
└─────────────────────────────────────────────┘

文本对齐、跨越和 ASCII 样式边框

import 'package:barbecue/barbecue.dart';
import 'package:ansicolor/ansicolor.dart';

void main() {
  print(Table(
    cellStyle: CellStyle(
      borderBottom: true,
      borderRight: true,
      borderLeft: true,
      borderTop: true,
      alignment: TextAlignment.TopLeft
    ),
    body: TableSection(
      rows: [
        Row(
          cells: [
            Cell("Real Planets",
                rowSpan: 8,
                style: CellStyle(alignment: TextAlignment.MiddleCenter)),
            Cell("Mercury")
          ],
        ),
        Row(
          cells: [Cell("Venus")],
        ),
        Row(
          cells: [Cell("Earth")],
        ),
        Row(
          cells: [Cell("Mars")],
        ),
        Row(
          cells: [Cell("Jupiter")],
        ),
        Row(
          cells: [Cell("Saturn")],
        ),
        Row(
          cells: [Cell("Uranus")],
        ),
        Row(
          cells: [Cell("Neptune")],
        ),
        Row(
          cells: [Cell("Very Fake Planets", rowSpan: 1), Cell("Pluto")],
        ),
      ],
    ),
  ).render(border: TextBorder.ASCII));
}

输出结果：

+-----------------+-------+
|                 |Mercury|
|                 +-------+
|                 |Venus  |
|                 +-------+
|                 |Earth  |
|                 +-------+
|                 |Mars   |
|  Real Planets   +-------+
|                 |Jupiter|
|                 +-------+
|                 |Saturn |
|                 +-------+
|                 |Uranus |
|                 +-------+
|                 |Neptune|
+-----------------+-------+
|Very Fake Planets|Pluto  |
+-----------------+-------+

ANSI 颜色

import 'package:barbecue/barbecue.dart';
import 'package:ansicolor/ansicolor.dart';

void main() {
  final strings = ["look", "at", "all", "these", "colors"];
  var i = 0;
  print(Table(
    tableStyle: TableStyle(border: true),
    body: TableSection(
      cellStyle: CellStyle(borderRight: true),
      rows: [
        Row(
          cells: [
            for (final pen in [
              AnsiPen()..red(bold: true),
              AnsiPen()..green(bold: true),
              AnsiPen()..blue(),
              AnsiPen()..black()..white(bg: true),
              AnsiPen()..xterm(190)
            ])
              Cell(pen(strings[i++]))
          ],
        ),
      ]
    )
  ).render());
}

输出结果（带有彩色文本）：

Emoji 和其他宽字符

默认情况下，布局算法假设所有字符具有相同的宽度。对于大多数现代“等宽”字体，这并不总是成立。为了处理这种情况，你可以使用 EmojiAwareLayout 来调整布局。

import 'package:barbecue/barbecue.dart';

void main() {
  final table = Table(
    body: TableSection(rows: [
      Row(cells: [
        Cell('🤡',
            columnSpan: 4,
            style: CellStyle(alignment: TextAlignment.MiddleCenter)),
      ]),
      Row(cells: [
        Cell('1'),
        Cell('2'),
        Cell('3'),
        Cell('4'),
      ])
    ]),
  );
  final tableString = table.render(layoutFactory: (cell) => EmojiAwareLayout(cell));
  print(tableString);
}

请注意，使用 Unicode 宽字符和半宽字符时可能会遇到问题，因为不同平台、字体和终端对这些字符的渲染方式有所不同。

总结

barbecue 是一个功能强大的 Dart 包，适用于需要在 CLI 应用程序中渲染美观文本表格的开发者。通过其丰富的样式选项和对 ANSI 颜色的支持，可以创建出非常漂亮的控制台输出。希望这些示例能帮助你更好地理解和使用这个插件。