Как добиться плавной прокрутки, не тратя время на загрузку видео в приложении-клоне Tik Tok во Flutter
Вот мой код
Прежде всего я составляю список всех видео с информацией и URL-адресами, а затем создаю список видеоплеера и передаю эти URL-адреса один за другим видеоплееру каждого видео в соответствии с их индексом в списке.
- это массив URL-адресов видео
List<String> AllVideosUrls = [
"videoUrl1",
"videoUrl2",
"videoUrl3",
"videoUrl3",
"videoUrl4",
]
- это список видеоплеера
return PageView.builder(
itemCount: AllVideosUrls.length,
controller: PageController(initialPage: 0, viewportFraction: 1),
scrollDirection: Axis.vertical,
itemBuilder: ((context, index) {
final eachVideoUrl = AllVideosUrls[index];
return VideoPlayer(
videoFileUrl: eachVideoUrl()
);
}
),
)
- это виджет видеоплеера
class VideoPlayer extends StatefulWidget {
final String videoFileUrl;
const HomeVideoPlayer({
super.key,
required this.videoFileUrl,
});
@override
State<VideoPlayer> createState() => _VideoPlayerState();
}
class _VideoPlayerState extends State<VideoPlayer> {
VideoPlayerController? playerController;
bool isPlayerInitialized = true;
@override
void initState() {
super.initState();
playerController = VideoPlayerController.network(widget.videoFileUrl)
..initialize().then((value) {
setState(() {
isPlayerInitialized = false;
});
playerController!.play();
playerController!.setLooping(true);
playerController!.setVolume(2);
});
}
@override
void dispose() {
super.dispose();
playerController!.dispose();
}
@override
Widget build(BuildContext context) {
return Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
decoration: const BoxDecoration(
color: Colors.black,
),
child: Center(
child: AspectRatio(
aspectRatio: playerController!.value.aspectRatio,
child: VideoPlayer(playerController!),
),
),
);
}
}
Я хочу, чтобы видео загружались уже тогда, когда я смотрю текущее видео, чтобы уменьшить загрузку при прокрутке до следующего видео.