Grouped list and sub items group in flutter - android

Image result now
I have created a main list of items now i need a sub list items group also, but when i want to create sub list items group then it appears that without height i cant place them and when i set height then this is just a scrollable containter thats the problem. Can any one help me.
Thanks in advance.
List<Reply> replyList = [];
// sub Items
buildItemItem(List<Reply> reply){
return Container(
height: 65,
margin: EdgeInsets.only(left: 30),
child: ListView.builder(
itemCount: reply.length,
itemBuilder: (context, index) {
return Container(
padding: EdgeInsets.only(left: 40, top: 8, right: 10, bottom: 8),
child: Row(
children: [
Container(
height: 40,
width: 40,
child: CircleAvatar(
backgroundImage: NetworkImage(reply[index].photo),
),
),
Expanded(
flex: 4,
child: Container(
margin: EdgeInsets.only(left: 10),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('${reply[index].name}',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 12
),),
Text('${reply[index].Item}'),
Text('${reply[index].createdAt}',
style: TextStyle(
fontSize: 10,
color: Colors.grey
),
),
],
),
),
),
),
);
},
),
);
}
// main Item list
#override
Widget build(BuildContext context) {
return Column(
children: [
Container(
padding: EdgeInsets.only(left: 15, top: 8, right: 10, bottom: 8),
child: Row(
children: [
Container(
height: 40,
width: 40,
child: CircleAvatar(
backgroundImage: NetworkImage(photo),
),
),
Expanded(
flex: 4,
child: Container(
margin: EdgeInsets.only(left: 10),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('$name',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 12
),),
Text('$Item'),
Text('$createdAt',
style: TextStyle(
fontSize: 10,
color: Colors.grey
),
),
],
),
),
),
],
),
),
FutureBuilder(
future: getReply(id),
builder: (context, snapshot) {
return snapshot.data !=null ? buildItemItem(snapshot.data) : circularProgress();
},
),
Divider(height: 0.0,),
],
);
}
}

Related

Unable to create a graph with syncfusion_flutter_charts in Flutter

I am able to draw a graph in Android emulator but that graph is not working in Android physical device. It is showing gray screen instead of graph.
(https://i.stack.imgur.com/eUpC5.png)(https://i.stack.imgur.com/BspZR.jpg)
#override
Widget build(BuildContext context) {
TextTheme _textTheme = Theme.of(context).textTheme;
// TODO: implement build
return SafeArea(
child: Scaffold(
backgroundColor: Colors.white,
body: Column(
children: [
SizedBox(
height: 20,
),
Padding(
padding: const EdgeInsets.fromLTRB(20, 10, 20, 10),
child: Row(
children: [
GestureDetector(
onTap: () {
Navigator.pop(context);
},
child: Icon(
Icons.arrow_back_ios,
color: Colors.blueAccent,
size: 20,
),
),
SizedBox(
width: 10,
),
Image.network(
widget.cryptoData.cryptoImage!,
height: 20,
width: 20,
// fit: BoxFit.fill,
),
SizedBox(
width: 6,
),
Text(widget.cryptoData.cryptoName!,
style: _textTheme.labelSmall),
SizedBox(
width: 2,
),
Text('(' + widget.cryptoData.cryptoSymbol! + ')',
style: _textTheme.titleMedium)
],
),
),
SizedBox(
height: 10,
),
Padding(
padding: const EdgeInsets.fromLTRB(20, 0, 20, 10),
child: Row(
children: [
Text(
"\$" +
limitDecimalToTwo(
widget.cryptoData.cryptoValue.toString()),
style: _textTheme.labelLarge),
SizedBox(
width: 20,
),
Text(
limitDecimalToTwo(
widget.cryptoData.cryptoValueChange.toString()),
style: TextStyle(
color: widget.cryptoData.cryptoValueChange
.toString()[0] ==
'-'
? Colors.red
: Colors.green,
fontSize: 14)),
],
),
),
Expanded(
flex: 4,
child: Container(
child: SfCartesianChart(
primaryXAxis: CategoryAxis(),
// primaryYAxis: CategoryAxis(
// isVisible: false,
// majorGridLines: const MajorGridLines(width: 0)),
series: <ChartSeries<CryptoData, String>>[
LineSeries<CryptoData, String>(
dataSource: cryptoDataList,
xValueMapper: (CryptoData crypto, _) =>
getDateInProperFormat(crypto.date),
yValueMapper: (CryptoData crypto, _) => crypto.value),
],
),
)),
SizedBox(
height: 20,
),
Padding(
padding: const EdgeInsets.all(15),
child: Expanded(
flex: 2,
child: CryptoRowWidget(
cryptoName: widget.cryptoData.cryptoName,
cryptoCode: widget.cryptoData.cryptoSymbol,
cryptoImage: widget.cryptoData.cryptoImage,
cryptoValue: widget.cryptoData.cryptoValue.toString(),
cryptoValueChange:
widget.cryptoData.cryptoValueChange.toString(),
cryptoQunatityAvailable: '')),
),
Padding(
padding: const EdgeInsets.all(15),
child: Expanded(
flex: 1,
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
ElevatedButton(
style: ElevatedButton.styleFrom(shape: StadiumBorder()),
onPressed: () {
showAlertDialog(context, _textTheme, 'Buy');
},
child: Padding(
padding: const EdgeInsets.fromLTRB(30, 10, 30, 10),
child: Text(
'Buy',
style: _textTheme.bodySmall,
))),
SizedBox(
width: 40,
),
ElevatedButton(
style: ElevatedButton.styleFrom(shape: StadiumBorder()),
onPressed: () {
showAlertDialog(context, _textTheme, 'Sell');
},
child: Padding(
padding: const EdgeInsets.fromLTRB(30, 10, 30, 10),
child: Text(
'Sell',
style: _textTheme.bodySmall,
))),
],
),
),
)
],
),
),
);
}
https://stackoverflow.com/a/72261344/6714054 You can find the answer for similar post but I don't have ListView as parent here.

Cannot Scroll ListView inside FutureBuilder

I have tried almost all the solution on stackoverflow like using Expanded widget with single child scroll view and physics property and what not but still cannot enable scroll inside futurebuilder which occupy second half of my screen, the first half is static but second half contains listview inside future builder but it's not scrollable !!
The Error is Bottom Overflowed by 1313 pixels
This Is My Code
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
resizeToAvoidBottomInset: true,
body:Container(
child: Column(
children: [
Column(
children: [
Padding(
padding: const EdgeInsets.fromLTRB(15,12,15,0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Image.asset('assets/hamburger.png',height: 25,width: 25,alignment: Alignment.topLeft,),
Image.asset('assets/log.png',height: 37,width: 37,alignment: Alignment.center,),
Image.asset('assets/searc.png',height: 25,width: 25,alignment: Alignment.topRight,),
],
),
),
SizedBox(height: 10,),
Padding(
padding: const EdgeInsets.fromLTRB(15, 0, 0, 0),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
CircleAvatar(
radius: 30,
backgroundImage: NetworkImage(img)
),
// split(data[index]["image"])
SizedBox(width: 20,),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
// mainAxisAlignment: MainAxisAlignment.center,
children: [
Row(
children: [
Text('Hello',style: TextStyle(
color: Colors.black,
fontSize: 15,
),textAlign: TextAlign.start,),
SizedBox(width: 5,),
Text(name,style: TextStyle(
color: Colors.black,
fontSize: 15,
fontWeight: FontWeight.bold
),textAlign: TextAlign.start,),
],
),
Text('Welcome To Quad Life',style: TextStyle(
color: Colors.grey,
fontSize: 13,
),textAlign: TextAlign.start,),
],
),
],
),
),
SizedBox(height: 10,),
Padding(
padding: const EdgeInsets.fromLTRB(15, 0, 15, 0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
SizedBox(
width:MediaQuery.of(context).size.width*0.4,
height: 70,
child: Card(
elevation: 5,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(15),
) ,
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 5),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(data.length.toString(),
style:
TextStyle(color: Colors.black,
fontSize: 15,
fontWeight: FontWeight.bold),),
SizedBox(height: 5,),
Text('Operators',style:
TextStyle(color: Colors.grey,
fontSize: 15,
fontWeight: FontWeight.bold),),
],
),
),
),
),
SizedBox(
width:MediaQuery.of(context).size.width*0.4,
height: 70,
child: Card(
elevation: 5,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(15),
) ,
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 5),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(data1.length.toString(),style:
TextStyle(color: Colors.black,
fontSize: 15,
fontWeight: FontWeight.bold),),
SizedBox(height: 5,),
Text('Supervisors',style:
TextStyle(color: Colors.grey,
fontSize: 15,
fontWeight: FontWeight.bold),),
],
),
),
),
),
],
),
),
Column(
children: [
Padding(
padding: const EdgeInsets.fromLTRB(0, 15, 0, 0),
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 15),
child: Card(
elevation: 20,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(15),
) ,
child: SizedBox(
width: MediaQuery.of(context).size.width,
height: 150,
child: LineChart(
LineChartData(
borderData: FlBorderData(
show: true,
border: Border.all(width: 0)
),
gridData: FlGridData(
show: false,
),
titlesData: FlTitlesData(
show: false,
bottomTitles: SideTitles(
showTitles: true,
)
),
maxX: 50,
maxY: 100,
minX: 0,
minY: 0,
lineBarsData: [
LineChartBarData(
spots: [
FlSpot(0, 50),
FlSpot(10, 60),
FlSpot(15, 55),
FlSpot(20, 60),
FlSpot(30, 70),
FlSpot(40, 65),
FlSpot(50, 90),
],
isCurved: true,
colors: [Colors.orange,Colors.orangeAccent.shade700],
barWidth: 5,
belowBarData: BarAreaData(
show: true,
colors: gradientcolors.map((e) => e.withOpacity(0.3)).toList()
)
),
],
)
),
),
),
),
),
SizedBox(height: 10,),
Padding(
padding: const EdgeInsets.fromLTRB(15, 0, 15, 0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
SizedBox(
width:MediaQuery.of(context).size.width*0.45,
height: 70,
child: Card(
elevation: 3,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(7),
) ,
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 5),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text('New Operator',style:
TextStyle(color: Colors.black,
fontSize: 14,),),
SizedBox(height: 5,),
Text('Register new verfied Operator',
textAlign: TextAlign.center,
style:
TextStyle(color: Colors.grey,
fontSize: 9,
fontWeight: FontWeight.bold),),
],
),
),
),
),
SizedBox(
width:MediaQuery.of(context).size.width*0.45,
height: 70,
child: Card(
elevation: 3,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(7),
) ,
child: Padding(
padding: const EdgeInsets.symmetric(vertical: 5),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text('New Supervisors',style:
TextStyle(color: Colors.black,
fontSize: 14,),),
SizedBox(height: 5,),
Text('Register new verfied Supervisors',
textAlign: TextAlign.center,
style:
TextStyle(color: Colors.grey,
fontSize: 9,
fontWeight: FontWeight.bold),),
],
),
),
),
),
],
),
),
],
),
SizedBox(height: 5,),
Padding(
padding: EdgeInsets.fromLTRB(15, 0, 0, 0),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Text('Verify Operators',style: TextStyle(
color: Colors.grey.shade500,
fontSize: 15,
fontWeight: FontWeight.bold,
),
),
],
),
),
],
),
FutureBuilder(
builder: (context, snapshot){
if(snapshot != null){
return Column(
children: [
ListView.builder(
scrollDirection: Axis.vertical,
physics:NeverScrollableScrollPhysics(),
shrinkWrap: true,
// builder: (BuildContext context, int index) {
// return SizedBox(height: 0);
// },
itemCount: data == null ? 0 :data.length ,
itemBuilder: (context, index){
return InkWell(
onTap: (){},
child: Padding(
padding: const EdgeInsets.all(0),
child: Container(
height: MediaQuery.of(context).size.height*0.1,
decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(20)),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Container(
margin: EdgeInsets.only(left: 15),
child: SizedBox(
height: 50,
width: 50,
child: ClipRRect(
borderRadius: BorderRadius.circular(15),
child: Image(
image: NetworkImage(split(data[index]["image"])),
),
),
),
),
SizedBox(width: 10,),
Padding(
padding: const EdgeInsets.only(top: 25),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(data[index]["fullName"],
textAlign: TextAlign.left,
style: TextStyle(
fontSize: 15,
color: Colors.black,
fontWeight: FontWeight.bold,
),),
Text(capitalize(data[index]["experience"][data[index]["experience"].length-1]['designation']),
textAlign: TextAlign.left,
style: TextStyle(
fontSize: 15,
color: Colors.grey,
fontWeight: FontWeight.w100
),),
],
),
),
],
),
Padding(
padding: const EdgeInsets.only(right: 20),
child: TextButton(onPressed: (){},
child: Text('Verify Now',style:
TextStyle(color: Colors.green,fontWeight: FontWeight.bold,
fontSize: 15),),),
)
],
),
),
),
);
},
),
],
);
}else{
return CircularProgressIndicator();
}
},
),
],
),
),
),
);
}

=>Change Second half with this
Expanded(
flex: 1,
child: FutureBuilder(
builder: (context, snapshot) {
if (snapshot != null) {
return ListView.builder(
scrollDirection: Axis.vertical,
shrinkWrap: true,
// builder: (BuildContext context, int index) {
// return SizedBox(height: 0);
// },
itemCount: data == null ? 0 : data.length,
itemBuilder: (context, index) {
return InkWell(
onTap: () {},
child: Padding(
padding: const EdgeInsets.all(0),
child: Container(
height:
MediaQuery.of(context).size.height * 0.1,
decoration: BoxDecoration(
borderRadius:
BorderRadius.all(Radius.circular(20)),
),
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Row(
mainAxisAlignment:
MainAxisAlignment.start,
children: [
Container(
margin: EdgeInsets.only(left: 15),
child: SizedBox(
height: 50,
width: 50,
child: ClipRRect(
borderRadius:
BorderRadius.circular(15),
child: Image(
image: NetworkImage(split(
data[index]["image"])),
),
),
),
),
SizedBox(
width: 10,
),
Padding(
padding:
const EdgeInsets.only(top: 25),
child: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
Text(
data[index]["fullName"],
textAlign: TextAlign.left,
style: TextStyle(
fontSize: 15,
color: Colors.black,
fontWeight: FontWeight.bold,
),
),
Text(
capitalize(data[index]
["experience"][data[index]
["experience"]
.length -
1]['designation']),
textAlign: TextAlign.left,
style: TextStyle(
fontSize: 15,
color: Colors.grey,
fontWeight:
FontWeight.w100),
),
],
),
),
],
),
Padding(
padding: const EdgeInsets.only(right: 20),
child: TextButton(
onPressed: () {},
child: Text(
'Verify Now',
style: TextStyle(
color: Colors.green,
fontWeight: FontWeight.bold,
fontSize: 15),
),
),
)
],
),
),
));
});
} else {
return CircularProgressIndicator();
}
},
),
),

Try below format hope its helpful to you. Wrap your FutureBuilder inside Expanded or Flexible
body: Column(
children: [
Container(),
Expanded(
child: FutureBuilder(
future: yourFutureCall();
builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
return ListView.builder(
shrinkWrap: true,
physics:
const NeverScrollableScrollPhysics(), //OR use -> const ClampingScrollPhysics(),
itemBuilder: (BuildContext context, int index) {
return Container();
},
);
},
),
),
],
),

I'm not sure , cause I could not run the code , but What I see is the unbounded widgets from lack of the specified width and height which is a common mistake in flutter world .
if #Jasmin Sojitra's answer does not work try putting height and width of full screen on the first Container , If still there is a problemt put child of the Container inside a SingleChildScrollView .

How to add text on top of Dart Flutter gridView?

I made an application like this:
I want to add a little info text on top of this gridView structure. How can I do it? I'm a beginner and I just couldn't do it.
Codes:
body: Container(
padding: EdgeInsets.all(7),
child: GridView.builder(
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,
crossAxisSpacing: 10,
mainAxisSpacing: 10,
),
itemCount: subjects.length,
itemBuilder: (BuildContext context, int index) {
return Padding(
padding: const EdgeInsets.all(2.0),
child: Container(
child: InkWell(
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
border: Border.all(color: Colors.black),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Image.asset(subjects[index].subjectImage, fit: BoxFit.cover, height: 50, width: 50,),
SizedBox(height: 15,),
Text(subjects[index].subjectName, style: TextStyle(fontSize: 20, fontWeight: FontWeight.w500),),
],
),
),
onTap: () {},
),
),
);
},
),
How can I do it? Thanks in advance.

Try below code. I have added text like Text("1234567890")
body: Container(
padding: EdgeInsets.all(7),
child: Column(
children: [
Text("1234567890"), //<------------
Expanded(
child: GridView.builder(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,
crossAxisSpacing: 10,
mainAxisSpacing: 10,
),
itemCount: subjects.length,
itemBuilder: (BuildContext context, int index) {
return Padding(
padding: const EdgeInsets.all(2.0),
child: Container(
child: InkWell(
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
border: Border.all(color: Colors.black),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Image.asset(
subjects[index].subjectImage,
fit: BoxFit.cover,
height: 50,
width: 50,
),
SizedBox(
height: 15,
),
Text(
subjects[index].subjectName,
style: TextStyle(
fontSize: 20, fontWeight: FontWeight.w500),
),
],
),
),
onTap: () {},
),
),
);
},
),
),
],
),
);

You can use #DholaHardik's answer. Just need to wrap the Grid View Builder to a Sized Box and give it a height let's say height = MediaQuery.of(context).size.height and if the error says Overyflow by say 45 pixels.. You can change height to MediaQuery.of(context).size.height - 45;

The Tab-bar View Issues

Tab bar View
The Issues Which is if I try to add tab bar view it show Horizontal viewport was given unbounded height is there any other alternate for tab bar view to fix this issues
GitHub Link : https://github.com/RakulAgn/MyFlutterApp/blob/master/ui/lib/Pages/LandingPage.dart

Hi i checked your code you need to wrap your Scaffold with the DefaultTabController and then move forward to show tabs and tabview. I'm attaching the code for your reference please check.
return DefaultTabController(
length: 3,
child: Scaffold(
body: SafeArea(
child: SingleChildScrollView(
child: Container(
height: MediaQuery.of(context).size.height,
// child: Center(
child: Column(children: [
Expanded(
flex: 5,
child: Container(
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
SizedBox(
width: 15,
),
Row(
children: [
SizedBox(height: 80),
customIconGoBack(context),
Row(
children: [
SizedBox(
width: 230,
),
customIconFav(),
],
)
],
)
],
),
SizedBox(
height: 280,
),
Row(
children: [
SizedBox(
height: 10,
width: 20,
),
Icon(
Icons.location_on_sharp,
color: Colors.white,
size: 25,
),
SizedBox(
width: 2,
),
Text(
"2.4km away",
style: TextStyle(
fontWeight: FontWeight.normal,
fontSize: 12,
color: Colors.white,
),
),
],
),
SizedBox(
height: 5,
),
Row(
children: [
SizedBox(
height: 5,
width: 20,
),
Container(
child: Text(
'Bondi Beach',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 24,
color: Colors.white,
),
),
),
SizedBox(
width: 110,
),
Container(
height: 30,
margin: EdgeInsets.only(right: 20),
padding: EdgeInsets.only(left: 10),
width: 70,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(5),
color: Colors.black45,
),
child: Row(
children: [
Icon(
Icons.star_rounded,
color: Colors.white,
size: 25,
),
SizedBox(
width: 2,
),
Text(
"4.9",
style: TextStyle(color: Colors.white),
)
],
),
)
],
)
],
),
margin:
EdgeInsets.only(right: 18, left: 18, top: 15, bottom: 15),
padding: EdgeInsets.only(bottom: 15, top: 15),
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.fill,
colorFilter: ColorFilter.mode(
Colors.black.withOpacity(0.5), BlendMode.dstOver),
image: AssetImage('./Assets/Bondi.jpg'),
),
boxShadow: [
BoxShadow(
color: Colors.black12,
offset: Offset(2, 2), //(x,y)
blurRadius: 5.0,
)
],
borderRadius: BorderRadius.circular(10),
),
height: MediaQuery.of(context).size.height / 1.7,
),
),
Container(
// height: 50,
child: Theme(
data: ThemeData(
splashColor: Colors.transparent,
highlightColor: Colors.transparent),
child: TabBar(
labelColor: Colors.black,
unselectedLabelColor: Colors.grey,
indicatorPadding: EdgeInsets.only(right: 16),
labelPadding: EdgeInsets.only(right: 16),
indicator: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(5)),
tabs: [
Tab(
text: "Overview",
),
Tab(
text: "Reviews",
),
Tab(
text: "Friends",
),
],
),
),
),
Expanded(
child: TabBarView(
children: <Widget>[
Center(
child: Text("It's cloudy here",
style: textStyleRoboto(
textColor: ColorTheme.blackColor,
)),
),
Center(
child: Text("It's rainy here"),
),
Center(
child: Text("It's sunny here"),
),
],
),
),
]),
),
),
)),
);

Flutter:ListView inside ListView.builder

I am trying to bring a List of containers and i want to change the details inside this list of containers using fire store. But when i am running the program the page is showing blank. The output i want is like this image,
The output i am getting. And my second question is how to add images to the field inside the firestore.
Thanks in advance, it is really hard to publish a question in stack overflow.
body: StreamBuilder(
stream: Firestore.instance.collection('Event').snapshots(),
builder: (context, snapshot) {
if (!snapshot.hasData) {
const Text('No Event');
}
else if(snapshot.hasError){ const Text('No data avaible right now'); }
else {
return ListView.builder(
itemCount: snapshot.data.documents.length,
itemBuilder: (context, index) {
DocumentSnapshot myEvent = snapshot.data.documents[index];
return ListView(
scrollDirection: Axis.vertical,
children: <Widget>[
//1st box
Container(
margin: EdgeInsets.all(
SizeConfig.safeBlockHorizontal * 4),
child: Container(
child: new FittedBox(
child: Material(
// color: Colors.white,
elevation: 14.0,
borderRadius: BorderRadius.circular(24.0),
shadowColor: Color(0x802196F3),
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: <Widget>[
Container(
child: Padding(
padding: EdgeInsets.only(
left:
SizeConfig.safeBlockHorizontal *
4),
child: Column(
mainAxisAlignment:
MainAxisAlignment.spaceEvenly,
children: <Widget>[
Padding(
padding: const EdgeInsets.only(
left: 8.0),
child: Container(
child: Text(
'${myEvent['date_1']}',
style: TextStyle(
color: Colors.black54,
fontSize: 24.0,
fontWeight:
FontWeight.bold),
)),
),
SizedBox(
height: 10,
),
Padding(
padding: const EdgeInsets.only(
left: 8.0),
child: Container(
child: Column(
mainAxisAlignment:
MainAxisAlignment
.spaceEvenly,
children: <Widget>[
Container(
child: Text(
'${myEvent['title_1']}',
style: TextStyle(
color: Colors.black,
fontSize: 22.0,
fontWeight:
FontWeight.bold),
)),
SizedBox(
height: 10,
),
Container(
child: Text(
'${myEvent['details_1_a']}',
style: TextStyle(
color: Colors.black54,
fontSize: 18.0,
),
)),
Container(
child: Text(
'${myEvent['details_1_b']}',
style: TextStyle(
color: Colors.black54,
fontSize: 18.0,
),
)),
],
)),
),
],
),
),
),
SizedBox(
width:
SizeConfig.safeBlockHorizontal * 18,
),
Container(
width:
SizeConfig.safeBlockHorizontal * 60,
height:
SizeConfig.safeBlockHorizontal * 55,
child: ClipRRect(
borderRadius:
new BorderRadius.circular(24.0),
child: Image.network(
'${myEvent['image_1']}',
fit: BoxFit.fill,
alignment: Alignment.topRight,
),
),
),
],
),
),
),
),
),
//2nd box
Container(
margin: EdgeInsets.all(
SizeConfig.safeBlockHorizontal * 4),
child: Container(
child: new FittedBox(
child: Material(
// color: Colors.white,
elevation: 14.0,
borderRadius: BorderRadius.circular(24.0),
shadowColor: Color(0x802196F3),
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: <Widget>[
Container(
child: Padding(
padding: EdgeInsets.only(
left:
SizeConfig.safeBlockHorizontal *
4),
child: Column(
mainAxisAlignment:
MainAxisAlignment.spaceEvenly,
children: <Widget>[
Padding(
padding: const EdgeInsets.only(
left: 8.0),
child: Container(
child: Text(
'${myEvent['date_2']}',
style: TextStyle(
color: Colors.black54,
fontSize: 24.0,
fontWeight:
FontWeight.bold),
)),
),
SizedBox(
height: 10,
),
Padding(
padding: const EdgeInsets.only(
left: 8.0),
child: Container(
child: Column(
mainAxisAlignment:
MainAxisAlignment
.spaceEvenly,
children: <Widget>[
Container(
child: Text(
'${myEvent['title_2']}',
style: TextStyle(
color: Colors.black,
fontSize: 22.0,
fontWeight:
FontWeight.bold),
)),
SizedBox(
height: 10,
),
Container(
child: Text(
'${myEvent['details_2_a']}',
style: TextStyle(
color: Colors.black54,
fontSize: 18.0,
),
)),
Container(
child: Text(
'${myEvent['details_2_b']}',
style: TextStyle(
color: Colors.black54,
fontSize: 18.0,
),
)),
],
),
),
),
],
),
),
),
SizedBox(
width:
SizeConfig.safeBlockHorizontal * 18,
),
Container(
width:
SizeConfig.safeBlockHorizontal * 60,
height:
SizeConfig.safeBlockHorizontal * 55,
child: ClipRRect(
borderRadius:
new BorderRadius.circular(24.0),
child: Image.network(
'${myEvent['image_2']}',
fit: BoxFit.fill,
alignment: Alignment.topRight,
),
),
),
],
),
),
),
),
),

I don't think you need the second listview, but if you do, try this:
body: StreamBuilder(
stream: Firestore.instance.collection('Event').snapshots(),
builder: (context, snapshot) {
if (!snapshot.hasData) {
const Text('No Event');
}
else if(snapshot.hasError){ const Text('No data avaible right now'); }
else {
return ListView.builder(
itemCount: snapshot.data.documents.length,
itemBuilder: (context, index) {
DocumentSnapshot myEvent = snapshot.data.documents[index];
return ListView(
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
children: <Widget>[
//1st box
...

Categories

Resources