How to add videos in listview - flutter

Question

I want to show images and videos in listview i am able show images but i want to show video also please help me . I want to create app like instagram here is my code for the video.
class mydynamic extends StatefulWidget {
#override
_mydynamicState createState() => _mydynamicState();
}
class _mydynamicState extends State<mydynamic> {
List<String> urls = [
"https://flutter.github.io/assets-for-api-docs/assets/videos/bee.mp4",
"https://flutter.github.io/assets-for-api-docs/assets/videos/bee.mp4",
"https://flutter.github.io/assets-for-api-docs/assets/videos/bee.mp4"
];
VideoPlayerController _controller;
#override
void initState() {
super.initState();
_ controller = VideoPlayerController.network(
'https://flutter.github.io/assets-for-api-docs/assets/videos/bee.mp4')
..initialize().then((_) {
setState(() {});
});
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: new AppBar(title: Text("Adas")),
body: Center(
child: _controller.value.initialized
? AspectRatio(
aspectRatio: _controller.value.aspectRatio,
child: VideoPlayer(_controller),
)
: Container(),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
setState(() {
_controller.value.isPlaying
? _controller.pause()
: _controller.play();
});
},
child: Icon(
_controller.value.isPlaying ? Icons.pause : Icons.play_arrow,
),
),
);
}
#override
void dispose() {
super.dispose();
_controller.dispose();
}
}
I have tried this above example which is working fine but i am not able to apply the logic for putting the videos in listview please any solution for this. Thank you

Answer 1

Use ListView.Builder with List<VideoPlayerController> of video controllers
class _mydynamicState extends State<mydynamic> {
List<String> urls = [
"https://flutter.github.io/assets-for-api-docs/assets/videos/bee.mp4",
"https://flutter.github.io/assets-for-api-docs/assets/videos/bee.mp4",
"https://flutter.github.io/assets-for-api-docs/assets/videos/bee.mp4"
];
List<VideoPlayerController> _controllers = [];
#override
void initState() {
super.initState();
urls.forEach((element) {
_controllers.add(VideoPlayerController.network(element));
});
}
void _playVideos() {
_controllers.forEach((controller) {
controller
..initialize().then((_) {
setState(() {});
});
controller.value.isPlaying ? controller.pause() : controller.play();
});
}
bool isVideosPlaying() {
for (VideoPlayerController controller in _controllers) {
if (controller.value.isPlaying) {
return true;
}
}
return false;
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: new AppBar(title: Text("Adas")),
body: ListView.builder(
shrinkWrap: true,
itemBuilder: (ctx, index) {
VideoPlayerController controller = _controllers[index];
print(controller.value.isPlaying);
return Container(
child: controller.value.initialized
? AspectRatio(
aspectRatio: controller.value.aspectRatio,
child: VideoPlayer(controller),
)
: Container(),
);
},
itemCount: urls.length,
),
floatingActionButton: FloatingActionButton(
onPressed: () {
setState(() {
_playVideos();
});
},
child: Icon(
isVideosPlaying() ? Icons.pause : Icons.play_arrow,
),
),
);
}
#override
void dispose() {
super.dispose();
_controllers.forEach((controller) {
controller.dispose();
});
}
}