Question

我正在尝试使用Flutter构建一个演示聊天应用程序。在主屏幕之后，我正在使用Navigator.push转到详细信息屏幕。问题的屏幕截图：

第一个屏幕的构建方法：

@override
 Widget build(BuildContext context) {
return Scaffold(
    appBar: AppBar(
      title: const Text("Chat Thread App"),
      actions: <Widget>[
        IconButton(
          icon: Icon(Icons.settings),
          onPressed: () {
            Navigator.pushNamed(context, '/settings');
          },
        )
      ],
    ),
    body: isLoading
        ? Center(
            child: CircularProgressIndicator(),
          )
        : new ChatThreadListCard(messageThreads: _messageThreadLists, user: _user,),
);
}

Navigator.push方法的代码：

Navigator.push(context, MaterialPageRoute(
        builder: (context) => ChatDetailsScreen(threadModel: new ThreadModel(
              user.id, 
              user.fullName, 
              user.pic, 
              "otherId", 
              "otherName", 
              "otherPic", 
              post.threadId
            )
          ),
      ),);

产生问题的第二个屏幕的构建方法：

return Scaffold(
  appBar: AppBar(
    title: Text("Chat demo"),
  ),
  body: WillPopScope(
    child: isLoading
        ? Center(
            child: CircularProgressIndicator(),
          )
        : Stack(
            alignment: AlignmentDirectional.bottomCenter,
            children: <Widget>[
              SizedBox(
                width: 300,
                height: 300,
              ),
              Column(
                children: <Widget>[
                  buildChat(),
                  buildInput(),
                ],
              )
            ],
          ),
    onWillPop: onBackPress,
  ),
);

Answer 1

问题出在我脚手架上，我正在创建一个MaterialApp小部件。因此，当调用onTap方法时，在MaterialApp的区域中替换了新屏幕。没有取代整个屏幕。

诀窍是删除return new MaterialApp()。

感谢大家。

Answer 2

我猜您在设置Material App的地方有问题吗？

app.dart：

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: HomePage());
  }
}

首页和第二页

import 'package:flutter/material.dart';

class HomePage extends StatefulWidget {
  @override
  State createState() => HomePageState();
}

class HomePageState extends State<HomePage> with TickerProviderStateMixin {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text('First Page'),
        ),
        body: Container(
          child: Center(child: RaisedButton(child: Text('Forward'), onPressed: () async {
            await Navigator.push(context, MaterialPageRoute(builder: (context) => SecondPage()));
          },)),
        ));
  }
}

class SecondPage extends StatefulWidget {
  @override
  State createState() => SecondPageState();
}

class SecondPageState extends State<SecondPage> with TickerProviderStateMixin {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text('Second Page'),
        ),
        body: Container(
          child: Center(child: RaisedButton(child: Text('Backward'), onPressed: () {
            Navigator.of(context).pop();
          },)),
        ));
  }
}

哪个会产生：

如何在Flutter中删除第二个应用栏

2 个答案: