如何为 flutter 应用启用密码管理器自动填充功能？

Question

我们目前正在开发一个 Flutter 应用程序（Dart 语言）。

有一个带有两个 TextField 的登录屏幕。

密码字段有

obscureText: true,

as property，隐藏任何输入。

密码管理器

越来越多的人使用像 1password 这样的密码管理器。
我们如何在flutter中启用这个功能呢？

像这样：

目前不显示弹出窗口。官方文档中没有找到任何内容，也许谷歌有关于它的一般文档？

感谢您的帮助！！

Answer 1

查看 platform_inputs 包： https://pub.dev/packages/platform_inputs

他们的代码示例似乎与您的问题相符，它显示了当使用此包将文本字段的

textContentType

设置为

TextContentType.password

时，它将如何显示本机密码消息。

Answer 2

我在 flutter web 应用程序中遇到类似的问题。

事实证明，一些现代浏览器（chromium Firefox）不会自动填充

shadow-root

内保存的密码。

到目前为止，我发现的唯一解决方法是通过在

shadow-root

函数中编辑

embedder.dart

¹ 来强制您的应用程序不使用

_createHostNode

，以不使用

shadow-root

¹ 我的发现地点：

~/snap/flutter/common/flutter/bin/cache/flutter_web_sdk/lib/_engine/engine/embedder.dart

我的构建服务器 - 使用

cirrusci/flutter

docker 镜像位于

/sdks/flutter/bin/cache/flutter_web_sdk/flutter_web_sdk/lib/_engine/engine/embedder.dart

Answer 3

用

TextField

小部件包裹您的

AutofillGroup

，然后用适当的

TextField

标记您的

AutofillHint

，如下面的示例代码所示。然后 Google 的 Autofill 框架将显示自动填写电子邮件和密码的建议。

            return Padding(
                padding: const EdgeInsets.symmetric(horizontal: 24),
                child: AutofillGroup(
                  child: Column(
                      crossAxisAlignment: CrossAxisAlignment.stretch,
                      children: [
                        TextField(
                          autofillHints: [AutofillHints.email],
                          hintText: "Email address",
                        ),
                        const SizedBox(
                          height: 16,
                        ),
                        TextField(
                          hintText: "Password",
                          autofillHints: [AutofillHints.password, AutofillHints.newPassword],
                        ),
                       ]
              )));

下面的截图显示了结果：