Flutter多语言支持插件polyglot_flutter_sdk的使用

开发者指南

开源 我们制作工具以让您的产品支持所有语言。

让开发人员能够直接从代码中创建字符串。

翻译管理系统

团队中所有翻译人员的统一来源。

依托于Google Translate。可以即时部署字符串，快速且简单。

特性

• 从polyglot API获取本地化字符串。
• 直接从代码创建字符串 TODO

入门指南

确保在Flutter项目中添加该库作为依赖项：

dependencies:
  polyglot_flutter_sdk: ^0.0.1

示例项目

在example文件夹中有一个相当不错的示例项目。查看它。或者继续阅读以了解如何开始使用。

设置

以下是设置项目的示例代码：

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

import 'package:provider/provider.dart';
import 'package:polyglot_flutter_sdk/polyglot_flutter_sdk.dart';

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  ///
  /// 初始化polyglot_sdk
  ///
  PolyglotLanguage appLanguage = PolyglotLanguage.instance;
  await appLanguage.init(
      projectUrl:
          'https://d8wlqn7pvlrac.cloudfront.net/c81e728d9d4c2f636f067f89cc14862c/all.json',
      defaultLocale: 'en_US');
  runApp(MyApp(
    appLanguage: appLanguage,
  ));
}

class MyApp extends StatelessWidget {
  final PolyglotLanguage appLanguage;

  MyApp({required this.appLanguage});
  [@override](/user/override)
  Widget build(BuildContext context) {
    return ChangeNotifierProvider<PolyglotLanguage>(
      create: (_) => appLanguage,
      child: Consumer<PolyglotLanguage>(builder: (context, model, child) {
        return MaterialApp(
          // 设置应用语言区域
          locale: model.appLocal,
          title: "POLYGLOT",
          // 添加本地化代理
          localizationsDelegates: [
            const PolyLocalizationsDelegate(),
            GlobalMaterialLocalizations.delegate,
            GlobalWidgetsLocalizations.delegate,
            GlobalCupertinoLocalizations.delegate,
            FallbackLocalizationDelegate(),
          ],
          // 设置支持的语言列表
          supportedLocales: model.suportedLocales,
          home: MyHomePage(title: 'Flutter Demo Home Page'),
        );
      }),
    );
  }
}

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

  final String? title;

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

class _MyHomePageState extends State<MyHomePage> {
  String? title;
  String? description;
  PolyglotModel? polyModel;

  _MyHomePageState();

  [@override](/user/override)
  Widget build(BuildContext context) {
    var appLanguage = Provider.of<PolyglotLanguage>(context);
    return Scaffold(
      appBar: AppBar(
        title: Text(PolyLocalizations.of(context)?.translate('landing.translationdemo.description') ?? ""),
      ),
      body: Center(
        child: Padding(
          padding: const EdgeInsets.all(12.0),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text(
                PolyLocalizations.of(context)?.translate('landing.wemake') ?? "",
                textAlign: TextAlign.justify,
                style: TextStyle(fontSize: 18, color: Colors.red),
              ),
              Text(
                PolyLocalizations.of(context)?.translate('landing.translationdemo.description') ?? "",
                textAlign: TextAlign.center,
                style: TextStyle(fontSize: 18, color: Colors.green),
              ),
              Text(
                PolyLocalizations.of(context)?.translate('landing.backedby') ?? "",
                textAlign: TextAlign.justify,
                style: TextStyle(fontSize: 18, color: Colors.blue[400]),
              ),
              Padding(
                padding: const EdgeInsets.only(top: 20),
                child: Text(
                  PolyLocalizations.of(context)?.translate('landing.copyright') ?? "",
                  textAlign: TextAlign.center,
                  style: TextStyle(fontSize: 18, color: Colors.teal),
                ),
              ),
              Center(
                child: Wrap(
                  children: [
                    for (var lang in appLanguage.localizedStrings!.langs!.keys)
                      Container(
                        margin: const EdgeInsets.all(12),
                        child: TextButton(
                          child: Text('Polyglot $lang'),
                          onPressed: () {
                            print(lang);
                            appLanguage.changeLanguageFromString(lang);
                          },
                        ),
                      )
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}