How to show data in function as a loop? - flutter

Question

I am beginner in flutter and following some tutorials. I need to know how can I show data in a function by looping? For now, I am calling function 2 or 3 times to show data on how its possible ill call function just one time and shop my data which is in array?
Here. my data file which name is post_model.dart
class Post {
String authorName;
String authorImageUrl;
String timeAgo;
String imageUrl;
Post({
this.authorName,
this.authorImageUrl,
this.timeAgo,
this.imageUrl,
});
}
final List<Post> posts = [
Post(
authorName: 'Umaiz Khan',
authorImageUrl: 'assets/images/user0.png',
timeAgo: '5 min',
imageUrl: 'assets/images/post0.jpg',
),
Post(
authorName: 'Saad ahmed',
authorImageUrl: 'assets/images/user1.png',
timeAgo: '10 min',
imageUrl: 'assets/images/post1.jpg',
),
Post(
authorName: 'Hiba',
authorImageUrl: 'assets/images/user4.png',
timeAgo: '10 min',
imageUrl: 'assets/images/post2.jpg',
),
];
final List<String> stories = [
'assets/images/user1.png',
'assets/images/user2.png',
'assets/images/user3.png',
'assets/images/user4.png',
'assets/images/user0.png',
'assets/images/user1.png',
'assets/images/user2.png',
'assets/images/user3.png',
];
Here is my code at the end of the line you can see I am calling function and sending index. I need to call the function just one time and it will show all my arrays in data. Thanks in advance
import 'package:flutter/material.dart';
import 'package:curved_navigation_bar/curved_navigation_bar.dart';
import 'package:mytravel/screens/loginPage.dart';
import 'package:mytravel/screens/guidePlacePage.dart';
import 'package:mytravel/models/post_model.dart';
import 'package:mytravel/screens/view_post_screen.dart';
class newsFeedPage extends StatefulWidget {
#override
_newsFeedPageState createState() => _newsFeedPageState();
}
class _newsFeedPageState extends State<newsFeedPage> {
List<Widget> _buildPost() {
List<Widget> items = [];
items.add(
Padding(
padding: EdgeInsets.symmetric(horizontal: 10.0, vertical: 5.0),
child: Container(
width: double.infinity,
height: 560.0,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(25.0),
),
child: Column(
children: <Widget>[
Padding(
padding: EdgeInsets.symmetric(vertical: 10.0),
child: Column(
children: <Widget>[
ListTile(
leading: Container(
width: 50.0,
height: 50.0,
decoration: BoxDecoration(
shape: BoxShape.circle,
boxShadow: [
BoxShadow(
color: Colors.black45,
offset: Offset(0, 2),
blurRadius: 6.0,
),
],
),
child: CircleAvatar(
child: ClipOval(
child: Image(
height: 50.0,
width: 50.0,
image: AssetImage(posts[].authorImageUrl),
fit: BoxFit.cover,
),
),
),
),
title: Text(
posts[].authorName,
style: TextStyle(
fontWeight: FontWeight.bold,
),
),
subtitle: Text(posts[].timeAgo),
trailing: IconButton(
icon: Icon(Icons.more_horiz),
color: Colors.black,
onPressed: () => print('More'),
),
),
InkWell(
onDoubleTap: () => print('Like post'),
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (_) => ViewPostScreen(
post: posts[],
),
),
);
},
child: Container(
margin: EdgeInsets.all(10.0),
width: double.infinity,
height: 400.0,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(25.0),
boxShadow: [
BoxShadow(
color: Colors.black45,
offset: Offset(0, 5),
blurRadius: 8.0,
),
],
image: DecorationImage(
image: AssetImage(posts[].imageUrl),
fit: BoxFit.fitWidth,
),
),
),
),
Padding(
padding: EdgeInsets.symmetric(horizontal: 20.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Row(
children: <Widget>[
Row(
children: <Widget>[
IconButton(
icon: Icon(Icons.favorite_border),
iconSize: 30.0,
onPressed: () => print('Like post'),
),
Text(
'2,515',
style: TextStyle(
fontSize: 14.0,
fontWeight: FontWeight.w600,
),
),
],
),
SizedBox(width: 20.0),
Row(
children: <Widget>[
IconButton(
icon: Icon(Icons.chat),
iconSize: 30.0,
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (_) => ViewPostScreen(
post: posts[],
),
),
);
},
),
Text(
'350',
style: TextStyle(
fontSize: 14.0,
fontWeight: FontWeight.w600,
),
),
],
),
],
),
IconButton(
icon: Icon(Icons.bookmark_border),
iconSize: 30.0,
onPressed: () => print('Save post'),
),
],
),
),
],
),
),
],
),
),
),
);
for (var i = 0; i < posts.length; i++) {
items.add(_buildPost(i));
}
return items;
}
#override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Color(0xFFEDF0F6),
body: ListView(
physics: AlwaysScrollableScrollPhysics(),
children: <Widget>[
Padding(
padding: EdgeInsets.symmetric(horizontal: 20.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Text(
'Social Travel',
style: TextStyle(
fontFamily: 'Billabong',
fontSize: 32.0,
),
),
],
),
),
ListView(
physics: AlwaysScrollableScrollPhysics(),
children: _buildPost(),
),
],
),
);
}
}

Answer 1

You can build the children array of your ListView in a new method like this :
#override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Color(0xFFEDF0F6),
body: ListView(
physics: AlwaysScrollableScrollPhysics(),
children: _buildListViewItems(),
),
);
}
List<Widget> _buildListViewItems() {
List<Widget> items = [];
items.add(
Padding(
padding: EdgeInsets.symmetric(horizontal: 20.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Text(
'Instagram',
style: TextStyle(
fontFamily: 'Billabong',
fontSize: 32.0,
),
),
],
),
),
);
for (var i = 0; i < posts.length; i++) {
items.add(_buildPost(i));
}
return items;
}