This is my first code:
Padding(
padding: const EdgeInsets.symmetric(
horizontal: 20,
vertical: 0,
),
child: Text(
" i want get data here",
style: TextStyle(
color: Color(0xFF737599),
),
),
),
thats my second code :
return Container(
color: Colors.white,
child: Container(
height: size.height * 0.4,
child: StreamBuilder<QuerySnapshot>(
stream: _statusService.getStatus(),
builder: (context, AsyncSnapshot snapshot) {
return !snapshot.hasData
? CircularProgressIndicator()
: ListView.builder(
itemCount: 1,
itemBuilder: (context, index) {
DocumentSnapshot movies = snapshot.data.docs[2];
return Padding(
padding: const EdgeInsets.symmetric(
horizontal: 20,
vertical: 0,
),
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 20,
vertical: 0,
),
child: Text(
"${movies['description']}",
style: TextStyle(
fontSize: 10,
color: Color(0xFF737599),
),
),
),
);
});
}),
),
);
I want to pull a text from firebase. I managed to do this (on a different dart page), but how can I integrate it into the code I wrote before (there was a part where I printed the text manually without using firebase, how can I integrate it into that part).
In short, I want to integrate the text part in the first code, the part where I get data from the pharaoh in the second code.
I'm sharing both parts of the code, can you help?
Ok this is not a best practice what you do but you can create class attribute and you can assgin'it in your second code like
var yourVar = "";
Padding(
padding: const EdgeInsets.symmetric(
horizontal: 20,
vertical: 0,
),
child: (yourVar!="")?Text(
yourVar,
style: TextStyle(
color: Color(0xFF737599),
),
) ?null,
),
```
in your second code
```
return Container(
color: Colors.white,
child: Container(
height: size.height * 0.4,
child: StreamBuilder<QuerySnapshot>(
stream: _statusService.getStatus(),
builder: (context, AsyncSnapshot snapshot) {
return !snapshot.hasData
? CircularProgressIndicator()
: ListView.builder(
itemCount: 1,
itemBuilder: (context, index) {
DocumentSnapshot movies = snapshot.data.docs[2];
setState(() { yourVar= newValue; });
return Padding(
padding: const EdgeInsets.symmetric(
horizontal: 20,
vertical: 0,
),
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 20,
vertical: 0,
),
child: Text(
"${movies['description']}",
style: TextStyle(
fontSize: 10,
color: Color(0xFF737599),
),
),
),
);
});
}),
),
);
Related
I want to showing list of items with ListView.builder, which wrap with BlocBuilder. My code is success connect to API, but the problem is I do not know how to display the items, instead the length of the items like picture below.
Here I attach the code:
SizedBox(
height: 350,
width: 290,
child: Padding(
padding: const EdgeInsets.only(left: 30, top: 20),
child: BlocBuilder<ExcavatorBloc, ExcavatorState>(
builder: (context, state) {
return ListView.builder(
itemCount: state.excavator.length,
itemBuilder: (context, index) {
return Row(
children: [
const SizedBox(
height: 10,
width: 10,
child: CircleAvatar(
foregroundColor:
ColorName.brandSecondaryGreen,
backgroundColor:
ColorName.brandSecondaryGreen,
),
),
const SizedBox(
width: 5,
),
Text(
state.excavator.length.toString(), //The problem is here----------
style: subtitle1(),
),
],
);
},
);
},
),
),
),
Instead of this
Text(
state.excavator.length.toString(),
style: subtitle1(),
),
use the index of the list builder
Text(
state.excavator?[index].attributeName ?? 'No value',
style: subtitle1(),
),
return Container(
color: Colors.white,
child: StreamBuilder<QuerySnapshot>(
stream: _statusService.getStatus(),
builder: (context, AsyncSnapshot snapshot) {
return !snapshot.hasData
? CircularProgressIndicator()
: ListView.builder(
itemCount: snapshot.data.docs.length,
itemBuilder: (context, index) {
DocumentSnapshot movies = snapshot.data.docs[2];
return Padding(
padding: const EdgeInsets.symmetric(
horizontal: 20,
vertical: 0,
),
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 20,
vertical: 0,
),
child: Text(
"${movies['description']}",
style: TextStyle(
fontSize: 10,
color: Color(0xFF737599),
),
),
),
);
});
}),
);
}
}
can someone help me i am trying to call some data from firebase but its called 3 times i didn't find any solution i am waiting for your answers
I think your data length was 3 but you only show doc2. For the length of doc 3, data is displayed 3 times.
change
itemCount: snapshot.data.docs.length,
To
itemCount: 1,
I am trying to create a dialog to show a list of reviews on click event. However, the code below always generate an extra bottom padding after each gridview item and i was unable to find out which widget caused this extra padding.
Hopefully, someone can help me point me to the right direction. thanks much!
showDialog(
context: context,
builder: (_) {
return Dialog(
backgroundColor: Colors.orange[200],
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(40),
),
elevation: 16,
child: Container(
padding: EdgeInsets.only(bottom: 50),
child: StreamBuilder<QuerySnapshot>(
// stream: firestoreInstance.collection("requests").snapshots(),
stream: streamForReviews,
builder: (context, snapshot) {
switch (snapshot.connectionState) {
case ConnectionState.none:
return new Text('');
case ConnectionState.waiting:
return new Text('');
default:
if (snapshot.hasError) {
return new Text('error');
}
if (snapshot.data != null) {
WidgetsBinding.instance!.addPostFrameCallback((_) {
if (snapshot.data!.docs.length > 1) {
} else if (snapshot.data!.docs.length == 1) {
} else {}
});
return GridView.builder(
gridDelegate:
const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 1,
),
scrollDirection: Axis.vertical,
shrinkWrap: true,
padding: EdgeInsets.zero,
// itemCount: snapshot.data.documents.length,
itemCount: snapshot.data!.docs.length,
itemBuilder: (context, index) {
// List rev = snapshot.data.documents.reversed.toList();
String comments =
snapshot.data!.docs[index].get("comments");
String reviewerName =
snapshot.data!.docs[index].get("name");
num rating = snapshot.data!.docs[index].get("rating");
String downloadURL =
snapshot.data!.docs[index].get("imageURL");
Timestamp reviewTimeStamp =
snapshot.data!.docs[index].get("createdDTG");
DateTime reviewDateTime =
DateTime.parse(reviewTimeStamp.toDate().toString());
DateFormat reviewDateTimeFormat =
new DateFormat('dd MMM yyyy');
String reviewDateTimeString =
reviewDateTimeFormat.format(reviewDateTime);
return Container(
padding: EdgeInsets.symmetric(
vertical: 20, horizontal: 20),
child: Column(
children: [
SizedBox(height: 10),
ClipRRect(
borderRadius: BorderRadius.circular(16.0),
child: Image.network(
downloadURL,
fit: BoxFit.fitHeight,
height: 100,
),
),
SizedBox(width: 10),
Column(
// mainAxisSize: MainAxisSize.min,
// crossAxisAlignment:
// CrossAxisAlignment.stretch,
children: [
Text(reviewDateTimeString,
style: TextStyle(
color: Colors.orange[800],
fontSize: 18,
// fontStyle: FontStyle.italic,
)),
SizedBox(height: 2),
Text(reviewerName,
style: TextStyle(
color: Colors.orange[800],
fontSize: 18,
)),
SizedBox(height: 2),
RichText(
text: TextSpan(
// style: Theme.of(context).textTheme.body1,
children: [
WidgetSpan(
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 2.0),
child: Icon(
Icons.star,
color: Colors.orange,
size: 18,
),
),
),
TextSpan(
text: rating.toString(),
style: new TextStyle(
fontSize: 16.0,
color: Colors.orange[800],
),
),
],
),
),
SizedBox(height: 2),
],
),
Align(
alignment: Alignment.centerLeft,
child: Text(comments,
style: TextStyle(
color: Colors.orange[800],
fontSize: 16,
// fontStyle: FontStyle.italic,
)),
),
Divider(color: Colors.orange, thickness: 1),
],
),
);
},
);
} else {
return new Text('data null');
}
}
},
),
));
});
You need to change the value of childAspectRatio in SliverGridDelegateWithFixedCrossAxisCount widget. The default is 1, which means that grid items will have a width that is equal to their height. In your case, the width is approximately 2x of the height. your code should be like this:
return GridView.builder(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 1,
childAspectRatio: 2, //try to change this number to see how it changes the dimensions of the grid item
What im trying to do is filling a card with the necessary data it needs which is userImage and UserFirstname from my users collection and also data from my subcollection(carReviews)in my carInfo collection where i store the necessary review data:
subcollection(carReviews)
users collection
StreamBuilder<QuerySnapshot>(
stream: FirebaseFirestore.instance
.collection('carInfo')
.doc(snapshot.data!.docs[index]
.get('CaradvId'))
.collection('carReviews')
.snapshots(),
builder: (context, snapshot5) {
return StreamBuilder<QuerySnapshot>(
stream: FirebaseFirestore.instance
.collection('users')
.where('uid',
isEqualTo: snapshot5
.data!.docs[index]
.get('reviewerId'))
.snapshots(),
builder: (context, snapshot6) {
return Container(
padding: EdgeInsets.symmetric(
horizontal: 5),
height: MediaQuery.of(context)
.size
.height *
0.225,
child: ListView.builder(
shrinkWrap: true,
scrollDirection:
Axis.horizontal,
itemCount: snapshot5
.data!.docs.length,
itemBuilder:
(BuildContext context,
int index) {
DateTime date = snapshot5
.data!.docs[index]
.get('reviewDate')
.toDate();
String dateString =
DateFormat(
'dd MMM yyyy')
.format(date);
return ConstrainedBox(
When i print snapshot5.data!.docs[index].get('reviewerId') i get the two ids who has reviewed which what is expected however the snapshot6.data!.docs.length is 1 which doesn't make any sense!
I have tried using both snapshot6.data!.docs.length & snapshot5.data!.docs.length for the itemcount if i use snapshot6.data!.docs.length i get just one item in list with no errors and if i use snapshot5.data!.docs.length i get range error because it goes through all reviews which are just 2. Me using "hasdata" if statment wont change the output i have tried.
how it looks when i use snapshot5.data!.docs.length
how it looks when i use snapshot6.data!.docs.length
Card(
elevation: 2,
child: Container(
child: Column(
mainAxisAlignment:
MainAxisAlignment
.start,
children: [
Row(
mainAxisAlignment:
MainAxisAlignment
.start,
children: [
Container(
padding: EdgeInsets.only(
left:
12.5,
top:
12.5),
height:
55,
width:
55,
child:
CircleAvatar(
backgroundImage:
NetworkImage(
snapshot6.data!.docs[index].get('userImage'),
), //userimage
radius:
40,
),
),
Container(
padding: EdgeInsets.only(
top:
15),
child:
Column(
crossAxisAlignment:
CrossAxisAlignment
.start,
children: [
Container( padding: EdgeInsets.only(
left:
5),child:
RatingBar.builder(
initialRating: double.parse(snapshot5.data!.docs[index].get('reviewRating')),
minRating: 1,
direction: Axis.horizontal,
allowHalfRating: true,
updateOnDrag: false,
itemCount: 5,
itemSize: 14,
itemPadding: EdgeInsets.symmetric(vertical: 0),
itemBuilder: (context, _) => Icon(
Icons.star,
color: Colors.amber,
),
onRatingUpdate: (rating) {
print(rating);
},
),
),
SizedBox(height: 7.5),
Row(
children: [
Container(
padding: EdgeInsets.only(
left: 7.5,
),
child: Text(
snapshot6.data!.docs[index].get('userFirstname'),
overflow: TextOverflow.ellipsis,
maxLines: 1,
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w800,
color: Colors.black87,
),
),
),
Container(
padding: EdgeInsets.only(left: 2.5),
child: Text(
dateString,
overflow: TextOverflow.ellipsis,
maxLines: 1,
style: TextStyle(
fontSize: 10,
fontWeight: FontWeight.w800,
color: Colors.black54,
),
))
],
)
],
)),
],
),
Container( padding: EdgeInsets.only(
left:
12.5,
top:
12.5),
height: 130,width: MediaQuery.of(
context)
.size
.width *
0.75,
child: Text(snapshot5
.data!
.docs[
index]
.get(
'reviewContent')),
)
],
),
)),
so I'm new to flutter. Was trying to separate the address displayed with comma.
Am I missing something?
Here's my code:
Widget buildUserAddress() {
var adr = address;
adr.toString().split(',').reversed.toList();
return Container(
width: MediaQuery.of(context).size.width,
padding: const EdgeInsets.only(top: 10, bottom: 20),
child: Text(
adr,
maxLines: 3,
textAlign: TextAlign.left,
style: TextStyle(
fontSize: 15,
),
),
);
}
Your variable "adr" is of type list, so you need to give the index to get the value.
You can do something like this inside your buildUserAddress().
Widget buildUserAddress(String getAddress) {
List adrList = getAddress.toString().split(',').reversed.toList();
return Container(
width: double.infinity,
padding: const EdgeInsets.only(top: 10, bottom: 20),
child: ListView.builder(
itemCount: adrList.length,
itemBuilder: (BuildContext ctx, index) {
return Text("${adrList[index]}");
},
),
);
}