Flutter未知功能插件Lyrebird的探索使用

简介

Lyrebird 是一个为 Dart 和 Flutter 项目设计的应用资源包（.arb）本地化文件可视化编辑器。它特别适合与 intl 包一起使用，帮助开发者快速进行国际化和本地化工作。

目录

• 功能
  • 已支持
  • 计划中
• 安装
• 配置
• 使用

功能

已支持

• 添加和删除本地化键
• 编辑本地化键的元数据
• 添加、编辑和删除占位符变量
• 使用可视化编辑器编辑 ICU 值（包括文本块、参数、选择分支、复数分支等）

计划中

• 更好的错误处理
• “试用”部分以测试本地化
• 创建新文件
• 深色主题
• 支持 XML 标签
• 可折叠节点
• 文本 ICU 编辑器
• 自动化机器翻译订阅服务

安装

要安装 Lyrebird 启动器，请运行以下命令：

dart pub global activate lyrebird

或使用 Flutter CLI：

flutter pub global activate lyrebird

您可以将 Lyrebird 添加到 PATH 变量中，具体请参阅Dart 文档。

配置

Lyrebird 使用由 Flutter 团队定义的 l10n.yaml 配置文件，并遵循 flutter gen-l10n 命令。具体来说，arb-dir 字段将被 Lyrebird 打开用于编辑。

arb-dir: lib/l10n
template-arb-file: app_en.arb
output-localization-file: app_localizations.dart

如果您正在开发纯 Dart 项目，也可以创建 l10n.yaml 文件而不使用 Flutter。

使用

导航到包含 l10n.yaml 文件的目录，并在终端中运行以下命令：

lyrebird

如果未将 Lyrebird 添加到 PATH 中，可以使用 Dart CLI：

dart pub global run lyrebird

或使用 Flutter CLI：

flutter pub global run lyrebird

打开标准输出中打印的 URL 在浏览器中查看。使用 Ctrl+S (Mac 上为 Cmd+S) 保存更改。

更多选项请参阅：

lyrebird --help

示例 Demo

以下是示例代码，展示了如何在 Flutter 应用中集成 Lyrebird 生成的本地化文件：

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

// Source code generated from ARB localization files
import 'package:flutter_gen/gen_l10n/app_localizations.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      localizationsDelegates: const [
        AppLocalizations.delegate,
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
      ],
      supportedLocales: const [
        Locale('en', ''),
        Locale('de', ''),
      ],
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(AppLocalizations.of(context)!.helloWorld),
            const Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headline4,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ),
    );
  }
}