Leading on AppBar Incorrectly Persisting on Different Pages - flutter

Question

I am working on a project in Flutter. The issue is that when I navigate to a different page, and then go back, there is an icon that I used a while ago while testing that appears on the home page's appbar. I went back into the code, and there wasn't leading within that page's appbar.
Here is a screenshot after a complete rebuild of the app.
After navigating to another page using Navigator.of(context).pushNamed('/streaks/edit/'):
And finally, navigating back to the home page using Navigator.of(context).pushNamed('/streaks/all/'):
main.dart code:
import 'package:flutter/material.dart';
import 'package:streaks/pages/all_streaks/all_streaks.dart';
import 'package:streaks/pages/edit_streak/edit_streak.dart';
void main() => runApp(StreaksApp());
class StreaksApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'streaks',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
initialRoute: '/streaks/all/',
routes: <String, WidgetBuilder>{
'/streaks/all/': (context) => AllStreaksPage(),
'/streaks/edit/': (context) => EditStreakPage(),
},
);
}
}
home page code (/streaks/all/):
import 'package:flutter/material.dart';
import 'streak_list.dart';
class AllStreaksPage extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('All Streaks'),
),
body: StreakList(),
floatingActionButton: FloatingActionButton(
onPressed: () {
Navigator.of(context).pushNamed('/streaks/edit/');
},
child: Icon(Icons.add, size: 40),
),
);
}
}
and the Edit Streak page (/streaks/edit/):
import 'package:flutter/material.dart';
import 'package:streaks/pages/edit_streak/streak_form.dart';
class EditStreakPage extends StatefulWidget {
#override
_EditStreakPageState createState() => _EditStreakPageState();
}
class _EditStreakPageState extends State<EditStreakPage> {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
leading: IconButton(
icon: Icon(Icons.close, color: Theme.of(context).buttonColor),
onPressed: () {
Navigator.pushNamed(context, '/streaks/all/');
}),
title: Text('Edit Streak'),
),
body: StreakForm()
);
}
}
pubspec.yaml:
name: streaks
description: An app to boost your productivity with event organization.
publish_to: "none"
version: 1.0.0+1
environment:
sdk: ">=2.7.0 <3.0.0"
dependencies:
flutter:
sdk: flutter
sqflite:
path:
flutter_iconpicker: ^2.1.5
dev_dependencies:
flutter_test:
sdk: flutter
flutter:
uses-material-design: true
Note: there aren't any errors logged into the debug console at any time.
Another Note: even after deleting the app and running again, there error persisted.
Please help. I was thinking it might be (a) a caching error or (b) there is a problem with stateless widgets as pages.

Answer 1

1st way:
In your EditStreakPage class, instead of using Navigator.pushNamed(context, '/streaks/all/'); use Navigator.pop(context)
Complete class code:
import 'package:flutter/material.dart';
import 'package:streaks/pages/edit_streak/streak_form.dart';
class EditStreakPage extends StatefulWidget {
#override
_EditStreakPageState createState() => _EditStreakPageState();
}
class _EditStreakPageState extends State<EditStreakPage> {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
leading: IconButton(
icon: Icon(Icons.close, color: Theme.of(context).buttonColor),
onPressed: () {
Navigator.pop(context); // <-- use this intead
}),
title: Text('Edit Streak'),
),
body: StreakForm()
);
}
}
2nd way:
In your AllStreaksPage class, pass the property automaticallyImplyLeading: false to the AppBar()
Complete class code:
import 'package:flutter/material.dart';
import 'streak_list.dart';
class AllStreaksPage extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
automaticallyImplyLeading: false; // <--- add this
title: Text('All Streaks'),
),
body: StreakList(),
floatingActionButton: FloatingActionButton(
onPressed: () {
Navigator.of(context).pushNamed('/streaks/edit/');
},
child: Icon(Icons.add, size: 40),
),
);
}
}

Answer 2

From what i understand you are saying that actions is appering when you Open YOur App -> EDitStreak Page->press the close button on top in editStreak page ..
The key reason for this is that instead of going back you are actually going to that page by navigating to it . in which the back button would lead you back to edit Streaks page .
Instead of Navigating You Should use
Navigator.of(context).pop()
and that should solve your issue , let me know in comments , if it helps