Flutter:Navigator.of(context).pop() 返回黑屏

Posted

技术标签:

【中文标题】Flutter:Navigator.of(context).pop() 返回黑屏【英文标题】:Flutter: Navigator.of(context).pop() return black screen 【发布时间】:2021-07-31 01:51:41 【问题描述】:

所以我的代码的问题是,一旦我按下提交按钮,我的屏幕就会空白,然后我无法保存下一个响应。我希望在我提交表单后立即重置以供重用,并准备好接受用户的下一个响应,是的,黑屏也应该消失。

import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:firebase_core/firebase_core.dart';

void main() async 
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  runApp(MaterialApp(home: MyApp()));


class MyApp extends StatefulWidget 
  @override
  _MyAppState createState() => _MyAppState();


class _MyAppState extends State<MyApp> 
  TextEditingController problemBox = TextEditingController();

  final db = FirebaseFirestore.instance;

  List _listItem = ["Category 1", "Category 2", "Category 3", "Category 4"];
  List _listItem1 = [
    "Sub Category 1",
    "Sub Category 2",
    "Sub Category 3",
    "Sub Category 4"
  ];
  List _listItem2 = ["CRIS", "ADMINISTRATION", "ZONE", "DEPARTMENT"];

  String dropdownValue;
  String holder = '';

  void getDropDownItem() async 
    setState(() 
      holder = dropdownValue;
    );
  

  String dropdownValue1;
  String holder1 = '';

  void getDropDownItem1() async 
    setState(() 
      holder1 = dropdownValue1;
    );
  

  String dropdownValue2;
  String holder2 = '';

  void getDropDownItem2() async 
    setState(() 
      holder2 = dropdownValue2;
    );
  

  bool autoValidate = true;
  final GlobalKey<FormState> _formKey = GlobalKey<FormState>();

  @override
  Widget build(BuildContext context) 
    return Scaffold(
        resizeToAvoidBottomInset: false,
        appBar: AppBar(
          title: Text("Feedback"),
          centerTitle: true,
          leading: IconButton(
            onPressed: () ,
            icon: Icon(Icons.home),
          ),
        ),
        body: Container(
            child: Center(
          child: SingleChildScrollView(
            child: Form(
              autovalidateMode: AutovalidateMode.onUserInteraction,
              key: _formKey,
              child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: <Widget>[
                    Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: <Widget>[
                        Flexible(child: Text("CATEGORY")),
                        Flexible(
                            child: RichText(
                          textAlign: TextAlign.center,
                          text: TextSpan(
                            children: <TextSpan>[
                              TextSpan(
                                text: '*',
                                style: TextStyle(color: Colors.red),
                              ),
                            ],
                          ),
                        )),
                        SizedBox(width: 30),
                        Flexible(
                            child: DropdownButtonFormField<String>(
                          isExpanded: true,
                          hint: Text("Select"),
                          value: dropdownValue,
                          validator: (value) =>
                              value == null ? "Please select a value" : null,
                          items: _listItem
                              .map<DropdownMenuItem<String>>((valueItem) 
                            return DropdownMenuItem<String>(
                              value: valueItem,
                              child: Text(valueItem),
                            );
                          ).toList(),
                          onChanged: (value) 
                            setState(() 
                              dropdownValue = value;
                            );
                          ,
                        )),
                      ],
                    ),
                    SizedBox(
                      height: 10,
                    ),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: <Widget>[
                        Flexible(child: Text("SUB-CATEGORY")),
                        Flexible(
                            child: RichText(
                          textAlign: TextAlign.center,
                          text: TextSpan(
                            children: <TextSpan>[
                              TextSpan(
                                text: '*',
                                style: TextStyle(color: Colors.red),
                              ),
                            ],
                          ),
                        )),
                        SizedBox(width: 30),
                        Flexible(
                            child: DropdownButtonFormField<String>(
                          isExpanded: true,
                          hint: Text("Select"),
                          value: dropdownValue1,
                          validator: (value) =>
                              value == null ? "Please select a value" : null,
                          items: _listItem1
                              .map<DropdownMenuItem<String>>((valueItem1) 
                            return DropdownMenuItem<String>(
                              value: valueItem1,
                              child: Text(valueItem1),
                            );
                          ).toList(),
                          onChanged: (value) 
                            setState(() 
                              dropdownValue1 = value;
                            );
                          ,
                        )),
                      ],
                    ),
                    SizedBox(height: 10),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: <Widget>[
                        Flexible(child: Text("MARKED TO")),
                        Flexible(
                            child: RichText(
                          text: TextSpan(
                            children: <TextSpan>[
                              TextSpan(
                                text: '*',
                                style: TextStyle(color: Colors.red),
                              ),
                            ],
                          ),
                        )),
                        SizedBox(width: 30),
                        Flexible(
                            child: DropdownButtonFormField<String>(
                          isExpanded: true,
                          hint: Text("Select"),
                          value: dropdownValue2,
                          validator: (value) =>
                              value == null ? "Please select a value" : null,
                          items: _listItem2
                              .map<DropdownMenuItem<String>>((valueItem2) 
                            return DropdownMenuItem<String>(
                              value: valueItem2,
                              child: Text(valueItem2),
                            );
                          ).toList(),
                          onChanged: (value) 
                            setState(() 
                              dropdownValue2 = value;
                            );
                          ,
                        )),
                      ],
                    ),
                    SizedBox(height: 10),
                    Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        Padding(
                          padding: EdgeInsets.fromLTRB(70, 00, 70, 00),
                          child: TextFormField(
                            validator: (String value) 
                              if (value.isEmpty) 
                                return "Description is required";
                              
                              return null;
                            ,
                            controller: problemBox,
                            decoration: InputDecoration(
                              hintText: "Describe your problem here.",
                            ),
                            maxLength: 1000,
                            maxLines: 5,
                          ),
                        )
                      ],
                    ),
                    SizedBox(height: 10),
                    ButtonTheme(
                      child: ElevatedButton(
                        child: Text("Submit"),
                        onPressed: () 
                          if (_formKey.currentState.validate()) 
                            print(" form is validate");
                            db.collection("COLLECTION").add(
                              
                                "CATEGORY": dropdownValue,
                                "SUB-CATEGORY": dropdownValue1,
                                "MARKED TO": dropdownValue2,
                                "PROBLEM": problemBox.text,
                              ,
                            );
                            Navigator.of(context).pop();
                          
                        ,
                        style: ElevatedButton.styleFrom(
                          padding: EdgeInsets.symmetric(
                              horizontal: 25, vertical: 15),
                        ),
                      ),
                    ),
                  ]),
            ),
          ),
        )));
  

【问题讨论】:

【参考方案1】:

在任何时候,如果您发现弹出堆栈时会出现空白屏幕,这意味着当前屏幕是堆栈的最后一条路径。因此,如果您弹出最后一个可见屏幕,它会弹出最后一条路线并显示空白的黑色画布。

所以,在某些你不确定是否会弹出屏幕的地方,你可以检查一下,

if (Navigator.of(context).canPop()) 
   Navigator.of(context).pop();

如果你使用的是 NavigatorKey,那么你可以试试,

if (navigatorKey.currentState.canPop()) 
   navigatorKey.currentState.pop();

如果你不知道该怎么做,最后想尝试一些解决方法,你可以试试,

// you will need to import services API
import 'package:flutter/services.dart';

SystemNavigator.pop();

这将管理您的导航堆栈。

【讨论】:

您能否检查一下这个错误:github.com/Bhaskar2510/Final-Sem 我已经尝试解决它们,但我自己无法解决它们。【参考方案2】:

Navigator.of(context).pop(); 从导航器中弹出最靠近给定上下文的最顶层路线。

首先调用当前路由的 Route.didPop 方法。如果该方法返回 false,则该路由将保留在 Navigator 的历史记录中(该路由预计会弹出一些内部状态;参见例如 LocalHistoryRoute)。否则,此描述的其余部分适用。

如果非空,result 将作为被弹出的路由的结果;从推送弹出的路由返回的未来将完成结果。诸如对话框或弹出菜单之类的路由通常使用此机制将用户选择的值返回给创建其路由的小部件。结果的类型(如果提供)必须与弹出路由 (T) 的类的类型参数匹配。

你没有以前的路线,所以弹出会导致黑屏。

您可以清除字段/重置为默认值

`
clearFields()
problemBox.clear();
dropdownValue="";
...

【讨论】:

您能否检查一下这个错误:github.com/Bhaskar2510/Final-Sem 我已经尝试解决它们,但我自己无法解决它们。

以上是关于Flutter:Navigator.of(context).pop() 返回黑屏的主要内容,如果未能解决你的问题,请参考以下文章

在showDialog中Flutter Navigator.of(context).pop(),在ios中关闭整个应用程序

Flutter Navigator 移除直到

Flutter 移除所有路由

Flutter “孔雀开屏”的动画效果

Flutter “孔雀开屏”的动画效果

flutter 跳转至根路由