Flutter如何根据应用语言从Firebase Realtime Database检索数据

实现方案 #

要实现根据应用当前语言读取对应Firebase节点数据，你可以按照以下步骤修改代码：

• 首先获取应用当前的语言编码：如果你的应用支持手动切换语言，直接取你本地存储的当前语言编码即可；如果是跟随系统语言，可通过Flutter本地化API获取。
  不需要context的全局获取方式：

  Locale currentLocale = WidgetsBinding.instance.platformDispatcher.locale;
  String langCode = currentLocale.languageCode; // 输出值示例：en、zh、ja等
  

  在组件build方法内通过context获取的方式：

  Locale currentLocale = Localizations.localeOf(context);
  String langCode = currentLocale.languageCode;
  

• 再修改Firebase数据库的引用路径，将语言编码作为子节点拼接进去即可。修改后的完整代码如下：

Container(
  margin: EdgeInsets.only(top: 90.0),
  child: Scaffold(
    key: _scaffoldKey,
    body: Column(
      children: [
        Expanded(
          child: Builder(
            builder: (context) {
              // 获取当前语言编码
              String langCode = Localizations.localeOf(context).languageCode;
              return StreamBuilder(
                // 拼接语言节点，读取对应语言下的CleaningList数据
                stream: FirebaseDatabase.instance
                    .reference()
                    .child('CleaningList')
                    .child(langCode)
                    .onValue,
                builder: (BuildContext context, AsyncSnapshot<Event> snapshot) {
                  if (snapshot.hasData) {
                    var map = snapshot.data.snapshot.value as Map<dynamic, dynamic>;
                    clothesModels.clear();
                    map.forEach((key, value) {
                      var clothesModel = ClothesModel.fromJson(
                          json.decode(json.encode(value)));
                      clothesModel.key = key;
                      clothesModels.add(clothesModel);
                    });
                    return GridView.builder(
                      padding: const EdgeInsets.only(
                          top: 20.0, right: 26.0, left: 26.0),
                      itemCount: clothesModels.length,
                      gridDelegate:
                      const SliverGridDelegateWithFixedCrossAxisCount(
                        crossAxisCount: 2,
                      ),
                      itemBuilder: (context, index) => Container(
                        alignment: Alignment.center,
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.center,
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Container(
                              child: Center(
                                  child: Image.network(
                                    clothesModels[index].image,
                                    width: 40.0,
                                    height: 50.0,
                                  )),
                            ),
                            // 原有剩余布局代码保持不变即可
                          ],
                        ),
                      ),
                    );
                  }
                  // 无数据时展示加载状态
                  return const Center(child: CircularProgressIndicator());
                },
              );
            }
          )
        ),
      ],
    )
  )
)

注意：如果你的数据库中语言节点使用带地区后缀的命名格式（比如zh-CN、en-US），可将langCode替换为currentLocale.toString()获取完整的语言地区标识。

内容的提问来源于stack exchange，提问作者H.Olwan