Exception caught by rendering library A RenderFlex overflowed by 98349 pixels on the right. The relevant error-causing widget was AppBar - flutter

Question

[hello, i'm doing this site and impractical what happens, everything goes except the app bar (from another error that is index out of range index is 0) this site is connected to firebase, the problem i think is there just that i don't know how solve it mainly because I have looked a lot of times that the collections on firebase had the right names but still does not go does anyone have a solution?]
CollectionReference userCollectionReference =
FirebaseFirestore.instance.collection('users');
CollectionReference bookCollectionReference =
FirebaseFirestore.instance.collection('books');
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.white24,
elevation: 0.0,
toolbarHeight: 77,
centerTitle: false,
title: Row(
children: [
Text(
'A.Reader',
style: Theme.of(context).textTheme.headline6.copyWith(
color: Colors.redAccent, fontWeight: FontWeight.bold),
),
],
),
actions: [
StreamBuilder<QuerySnapshot>(
stream: userCollectionReference.snapshots(),
builder: (context, AsyncSnapshot<QuerySnapshot> snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
return Center(
child: CircularProgressIndicator(),
);
}
final userListStream = snapshot.data.docs.map((user) {
return MUser.fromDocument(user);
}).where((user) {
return (user.uid == FirebaseAuth.instance.currentUser.uid);
}).toList(); //[user]
MUser curUser = userListStream[0];
print(userListStream);
return Column(
children: [
SizedBox(
height: 40,
width: 40,
child: InkWell(
child: CircleAvatar(
radius: 60,
backgroundImage: NetworkImage(
/* curUser.avatarUrl != null
? curUser.avatarUrl
: */
'https://i.pravatar.cc/300'),
backgroundColor: Colors.white,
child: Text(''),
),
onTap: () {
showDialog(
context: context,
builder: (context) {
// return createProfileMobile(context, userListStream,
// FirebaseAuth.instance.currentUser, null);
return createProfileDialog(context, curUser);
},
);
},
),
),
Text(
curUser.displayName.toUpperCase(),
overflow: TextOverflow.ellipsis,
style: TextStyle(color: Colors.black),
)
],
);
},
),
TextButton.icon(
onPressed: () {
FirebaseAuth.instance.signOut().then((value) {
return Navigator.push(
context,
MaterialPageRoute(
builder: (context) => LoginPage(),
));
});
},
icon: Icon(Icons.logout),
label: Text(''))
],
),
floatingActionButton: FloatingActionButton(
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => BookSearchPage(),
));
},
child: Icon(Icons.add),
backgroundColor: Colors.redAccent,
),
//error:
packages/flutter/src/widgets/async.dart 124:48 build
...
Exception caught by rendering library
A RenderFlex overflowed by 98349 pixels on the right.
The relevant error-causing widget was
AppBar
lib\screens\main_screen.dart:26

Answer 1

I think You Should write wrong code formatting try it out your code like below:
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.white24,
elevation: 0.0,
toolbarHeight: 77,
centerTitle: false,
title: Text(
'A.Reader',
style: Theme.of(context).textTheme.headline6.copyWith(
color: Colors.redAccent, fontWeight: FontWeight.bold),
),
),
body:StreamBuilder<QuerySnapshot>(
stream: userCollectionReference.snapshots(),
builder: (context, AsyncSnapshot<QuerySnapshot> snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
return Center(
child: CircularProgressIndicator(),
);
}
final userListStream = snapshot.data.docs.map((user) {
return MUser.fromDocument(user);
}).where((user) {
return (user.uid == FirebaseAuth.instance.currentUser.uid);
}).toList(); //[user]
MUser curUser = userListStream[0];
print(userListStream);
return Column(
children: [
SizedBox(
height: 40,
width: 40,
child: InkWell(
child: CircleAvatar(
radius: 60,
backgroundImage: NetworkImage(
/* curUser.avatarUrl != null
? curUser.avatarUrl
: */
'https://i.pravatar.cc/300'),
backgroundColor: Colors.white,
child: Text(''),
),
onTap: () {
showDialog(
context: context,
builder: (context) {
// return createProfileMobile(context, userListStream,
// FirebaseAuth.instance.currentUser, null);
return createProfileDialog(context, curUser);
},
);
},
),
),
Text(
curUser.displayName.toUpperCase(),
overflow: TextOverflow.ellipsis,
style: TextStyle(color: Colors.black),
)
],
);
},
),
TextButton(
onPressed: () {
FirebaseAuth.instance.signOut().then((value) {
return Navigator.push(
context,
MaterialPageRoute(
builder: (context) => LoginPage(),
));
});
},
icon: Icon(Icons.logout),
label: Text(''))
floatingActionButton: FloatingActionButton(
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => BookSearchPage(),
));
},
child: Icon(Icons.add),
backgroundColor: Colors.redAccent,
));
remove your StreamBuilder inside action[] of appbar and add it to the body of scaffold