Flutter：路由到不同的 .dart 文件失败。 Returns 黑屏

Question

我已经创建了一个社交媒体应用程序，现在我正在尝试自定义我的应用程序，我添加了一个搜索、聊天图标，我希望搜索图标可以路由到 Search 存在的页面在应用程序中。我实现了 MaterialPageRoute 但它只是 returns 黑屏（带有细绿色边框）。

调试控制台

中没有错误或日志

Flutter 医生报告

Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel dev, 1.24.0-10.2.pre, on Microsoft Windows [Version 10.0.19041.630], locale en-GB)
[√] Android toolchain - develop for Android devices (Android SDK version 30.0.2)
[√] Android Studio (version 4.1.0)
[√] VS Code (version 1.51.1)
[√] Connected device (1 available)

• No issues found

Header Widget 代码：现在我正在尝试将路由添加到 Icon(Icons.search), 图标

import 'package:flutter/material.dart';
import 'package:findemed/pages/search.dart';


class Search extends StatefulWidget {
  @override
  __SearchState createState() => __SearchState();
}

class __SearchState extends State<Search> {
  Future<List> users;
  

  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

AppBar header(context,
    {bool isAppTitle = false,
    String titleText,
    removeBackButton = false}) {
  return AppBar(
//APPBAR CODE WITH ICONS
    automaticallyImplyLeading: removeBackButton ? false : true,
    title: 
        Text(isAppTitle ? "FindeMed" : titleText),
    leading: GestureDetector(
      onTap: () {/* Write listener code here */},
      child: Icon(
        Icons.menu, // add custom icons also
      ),
    ),

    actions: <Widget>[
      Padding(
        padding: EdgeInsets.only(right: 20.0),
          child: GestureDetector(
            onTap: () {
              Navigator.push(
                context,
                MaterialPageRoute(
                  builder: (context) => Search()
                  ),
                );
              },
            child: Icon(
              Icons.search,
              size: 25.0,
            ),
          )),
      Padding(
          padding: EdgeInsets.only(right: 20.0),
          child: GestureDetector(
            onTap: () {},
            child: Icon(
              Icons.chat_bubble_outline,
              size: 20.0,
            ),
          )),
      Padding(
          padding: EdgeInsets.only(right: 20.0),
          child: GestureDetector(
            onTap: () {},
            child: Icon(Icons.notifications),
          )),
    ],
  );
}

Answer 1

那是因为您的 Search 小部件中什么都没有（只有 Container 小部件）。

尝试返回一个 Scaffold 而不是一些 body 集。默认情况下，空视图的黑屏是“正常”的。

Answer 2

解决了。

问题出在 stateless n stateful 小部件类

class Search extends StatefulWidget {
  @override
  __SearchState createState() => __SearchState();
}

class __SearchState extends State<Search> {
  Future<List> users;

我认为名称 Search 的问题与路由到 Search 页面发生冲突。我只是将其更改为 Header，即使参数为空也能正常工作

class Header extends StatefulWidget {
  @override
  __HeaderState createState() => __HeaderState();
}

class __HeaderState extends State<Header> {
  Future<List> users;

与建议的不同，即使没有声明小部件，路由仍然可以工作，即

Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => Search(),
              ),

Flutter：路由到不同的 .dart 文件失败。 Returns 黑屏

Flutter: Routing to a different .dart file failing. Returns a black screen

android

flutter

routes

materialpageroute