为什么当我从 Iphone 或 Ipad 上单击 TextField 时，Flutter Web 中的对话框会关闭

Question

我有一个带有登录表单的对话框，当我打开键盘时想从手机输入文本时，对话框会关闭，当我在 ios 或 android 上运行 flutter 时，此错误不存在，我在网络中执行此操作

showDialog(
                      context: context,
                      barrierDismissible: false,
                      builder: (BuildContext context) {
                        return AlertDialog(
                          title: const Text('AlertDialog Title'),
                          content: SingleChildScrollView(
                            child: ListBody(
                              children: <Widget>[
                                TextFormField(
                                  autofocus: true,
                                  decoration: InputDecoration(
                                    hintText: 'Email',
                                    hintStyle: TextStyle(fontSize: 14),
                                    prefixIcon: Icon(Icons.email),
                                    contentPadding: EdgeInsets.symmetric(horizontal: 10, vertical: 12),
                                    border: OutlineInputBorder(
                                      borderRadius: BorderRadius.circular(14),
                                      borderSide: BorderSide(width: 1, style: BorderStyle.solid),
                                    ),
                                    filled: true,
                                    fillColor: colorInputField,
                                    enabledBorder: OutlineInputBorder(
                                      borderRadius: BorderRadius.circular(14),
                                      borderSide: BorderSide(
                                        color: colorBackgroundSecondary,
                                        width: 1,
                                      ),
                                    ),
                                    focusedBorder: OutlineInputBorder(
                                      borderRadius: BorderRadius.circular(14),
                                      borderSide: BorderSide(
                                        color: colorPrimary,
                                        width: 1,
                                      ),
                                    ),
                                  ),
                                  keyboardType: TextInputType.emailAddress,
                                  validator: (value) {
                                    if (value == null || value.isEmpty || !value.contains('@')) {
                                      return 'Please enter a valid email address';
                                    }
                                    return null;
                                  },
                                  controller: emailController,
                                ),
                              ],
                            ),
                          ),
                          actions: <Widget>[
                            TextButton(
                              child: const Text('Approve'),
                              onPressed: () {
                                Navigator.of(context).pop();
                              },
                            ),
                          ],
                        );
                      },
                    );

链接到出现错误的视频

我认为问题出在重建小部件的控制器上，但我删除了它们，当我单击文本字段时对话框仍然关闭，模态的类似问题

Answer 1

嘿，我认为发生这种情况是因为对话框尝试重用与键盘相同的上下文。因此，将您的对话框包装在一个新的状态中，这将允许访问不同的上下文