Going Back is showing Black Screen in Flutter

Viewed 4786

I am trying to use Navigator.pop(context); in an appbar but the problem is that it shows a black screen and then you have to press the back button on android then it pops current black screen, so where is this black screen coming from that I don't know and in iPhone there is no back button so that why it is stuck in that screen. Please do help me

This is the code where I am using this Navigator code.

 @override
 Widget build(BuildContext context) {
 return new Scaffold(
  backgroundColor: Color.fromRGBO(30, 30, 30, 1.0),
  appBar: new AppBar(
    elevation: 0.0,
    backgroundColor: Color.fromRGBO(30, 30, 30, 1.0),
    actions: <Widget>[
      new IconButton(
          icon: Icon(Icons.settings_power),
          onPressed: () {
            Navigator.pop(context);
          }),
    ],
    title: new Text(
      "PROLOG",
      style: new TextStyle(color: Colors.white),
    ),
    centerTitle: true,
  ),
 );
}

and the most strange thing is that I am using this piece of code in another class its working fine. So where is the problem...

1 Answers

The reason why you're getting a black/blank screen after calling Navigator.pop(context) is because there's no widget/screen beyond the current Navigator stack.

In Flutter, SystemChannels.platform.invokeMethod('SystemNavigator.pop') is used to remove the topmost Flutter instance. As mentioned in the docs, the method should remove the current Activity from the stack in Android. The behavior is a bit different on iOS though.

If you're trying to implement this function to close the app, this is highly discouraged. This is pointed out on Apple's archived doc. I'm trying to search for an updated reference, but navigating through Apple's Developer docs is challenging.

Anyway, I've made some changes to your code snippet if you'd like to try this out.

Add this in your imports

import 'dart:io' show Platform, exit;

As for the code, exit(int) is used for iOS. It's recommended to use an exit code from the range 0...127 as mentioned in the docs. While SystemChannels.platform.invokeMethod('SystemNavigator.pop') is used for other platforms (mainly Android in this case).

Widget build(BuildContext context) {
  return new Scaffold(
    backgroundColor: Color.fromRGBO(30, 30, 30, 1.0),
    appBar: new AppBar(
      elevation: 0.0,
      backgroundColor: Color.fromRGBO(30, 30, 30, 1.0),
      actions: <Widget>[
        new IconButton(
          icon: Icon(Icons.settings_power),
          // if Platform is iOS call exit(0)
          // else call the preferred method
          // https://api.flutter.dev/flutter/services/SystemNavigator/pop.html
          onPressed: () => Platform.isIOS
              ? exit(0)
              : SystemChannels.platform.invokeMethod('SystemNavigator.pop'),
        ),
      ],
      title: new Text(
        "PROLOG",
        style: new TextStyle(color: Colors.white),
      ),
      centerTitle: true,
    ),
  );
}

Demo

enter image description here

Related