I am struggling to find a solution to this error — ‘package:flutter/src/widgets/framework.dart’: Failed assertion: line 4692 pos 14: ‘owner!._debugCurrentBuildTarget == this’: is not true.
I am attempting to add a bottomNavigationBar to my app, but whenever I attempt to enter the app homescreen, I recieve that error. I don’t get the error when I remove the bottomNavigationBar feature.
I tried looking it up and none of the available solutions seem to work. Please help!
bottom_nav_button_bar.dart
import 'package:class_cred/home_screen.dart';
import 'package:class_cred/profile.dart';
import 'package:class_cred/quests.dart';
import 'package:class_cred/settings.dart';
import 'package:flutter/material.dart';
class BottomNavButtonBar extends StatefulWidget {
const BottomNavButtonBar({Key? key}) : super(key: key);
@override
State<BottomNavButtonBar> createState() => _BottomNavButtonBarState();
}
class _BottomNavButtonBarState extends State<BottomNavButtonBar> {
int index = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
body: IndexedStack(
index: index,
children: const [
HomeScreen(),
Quests(),
Settings(),
Profile(),
],
),
bottomNavigationBar: BottomNavigationBar(
type: BottomNavigationBarType.fixed,
currentIndex: index,
onTap: (int newIndex) {
setState(() {
index = newIndex;
});
},
items: const [
BottomNavigationBarItem(
icon: Icon(Icons.home),
label: "Home",
),
BottomNavigationBarItem(
icon: Icon(Icons.list),
label: "Quests",
),
BottomNavigationBarItem(
icon: Icon(Icons.home),
label: "Home",
),
BottomNavigationBarItem(
icon: Icon(Icons.home),
label: "Home",
),
],
),
);
}
}
main.dart
import 'package:class_cred/constants.dart';
import 'package:class_cred/home_screen.dart';
import 'package:class_cred/password_screen.dart';
import 'package:class_cred/profile.dart';
import 'package:class_cred/quests.dart';
import 'package:class_cred/register_screen.dart';
import 'package:class_cred/settings.dart';
import 'package:class_cred/start_screen.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:persistent_bottom_nav_bar/persistent_tab_view.dart';
import 'store.dart';
void main() {
runApp(const ClassCred());
}
class ClassCred extends StatelessWidget {
const ClassCred({super.key});
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'ClassCred',
//debugShowCheckedModeBanner: false,
theme: ThemeData(
inputDecorationTheme: const InputDecorationTheme(
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
width: 3,
color: Color(0xff7ed6df),
),
),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(width: 3, color: kOffWhite),
),
),
),
home: const Scaffold(),
initialRoute: '/start',
routes: {
'/start': (context) => const StartScreen(),
'/password': (context) => const PasswordScreen('email'),
'/home': (context) => const HomeScreen(),
'/register': (context) => const RegisterScreen(),
'/settings': (context) => const Settings(),
},
);
}
}
home.dart
import 'package:class_cred/bottom_nav_button.dart';
import 'package:class_cred/constants.dart';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
class HomeScreen extends StatefulWidget {
const HomeScreen({Key? key}) : super(key: key);
@override
State<HomeScreen> createState() => _HomeScreenState();
}
class _HomeScreenState extends State<HomeScreen> {
@override
Widget build(BuildContext context) {
return Scaffold(
bottomNavigationBar: const BottomNavButtonBar(),
backgroundColor: Colors.white,
body: SafeArea(
child: Stack(
children: [
SingleChildScrollView(
child: SizedBox(
child:
Image.asset('assets/images/character_and_background.png'),
),
),
Positioned(
left: 30,
top: 20,
child: Stack(
alignment: Alignment.center,
children: [
Image.asset(
'assets/images/level_back.png',
height: 200,
),
Stack(
children: [
Text(
'12',
style: GoogleFonts.lalezar(
fontSize: 125,
//color: kGreenlandGreen,
letterSpacing: 2,
color: kDullYellowColor,
),
),
Text(
'12',
style: GoogleFonts.lalezar(
fontSize: 125,
//color: kGreenlandGreen,
letterSpacing: 2,
foreground: Paint()
..style = PaintingStyle.stroke
..strokeWidth = 6
..color = Colors.black54,
),
),
],
),
],
),
),
Positioned(
top: MediaQuery.of(context).size.height * 0.6,
left: MediaQuery.of(context).size.width * 0.05,
right: MediaQuery.of(context).size.width * 0.05,
child: Column(
children: [
Container(
decoration: BoxDecoration(
color: kOffWhite,
borderRadius: BorderRadius.circular(20),
border: Border.all(width: 5, color: kGreenlandGreen),
),
padding: const EdgeInsets.symmetric(vertical: 20),
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Container(
width: 100,
height: 100,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(80),
color: Colors.red,
),
child: ClipOval(
child: Image.asset(
'assets/images/avatar_icon.png',
fit: BoxFit.cover,
),
),
),
Text('John Doe', style: kSubheadingXLTextStyle),
Text(
'XP: 200',
style: kSubheadingLargeTextStyle,
),
],
),
],
),
),
const SizedBox(
height: 4,
),
Container(
padding: const EdgeInsets.symmetric(vertical: 30),
decoration: BoxDecoration(
color: kOffWhite,
borderRadius: BorderRadius.circular(20),
border: Border.all(width: 5, color: kGreenlandGreen),
),
),
],
),
),
],
),
),
);
}
}
I am expecting to be able to add a navigation bar to the bottom of my app that will allow me to select different icons that sends me to different screens on my app.
2
Answers
I’d be glad to help you out, but it would be easier for others to assist you if your question was framed more clearly. When using Stack Overflow, it’s important to include a minimal code sample to reproduce the error and provide the relevant portion of your stack trace. It seems like the source of your problem may be in the bottom_nav_button_bar.dart file, and the code appears to be a bit unconventional. You might consider using an AppBar for the bottom bar instead. Here’s an example:
By following these suggestions, you’ll make it easier for others to understand your issue and provide the help you need.
You have used the bottom navigation bar wrongly. The class/widget
BottomNavButtonBar
you created isn’t a bottom navigation bar but a full view/screen with 4 tabs and a bottom navigation bar. DoingbottomNavigationBar: const BottomNavButtonBar()
in your homescreen is wrong and you should treat theBottomNavButtonBar()
as a full view/screen/page on its own.You may want to visit the docs here on how to use the bottom navigation bar,