Flutter Video Player при нажатии Pass URL Dynami c и загрузка видео для воспроизведения

Question

образец экрана видеопроигрывателя прилагается ниже Как я могу заставить проигрыватель видео воспроизводиться динамически, при этом щелкнув по списку, воспроизвести видео, передав URL-адрес видео?

пока я нажал кнопку "Пройти" URL и попытался повторно инициализировать и начать играть его не работает, состояние не меняется

Вот мой код,

videoplayerscreen.dart,

class VideoPlayerScreen extends StatefulWidget {
  int playBackTime;
  int playBackTotalTime;
  String setPlayTime;
  String setPlayDuration;
  double aspectRatio;
  String videoUrl;
  bool isForward;
  bool isFullScreen;
  bool allowFullScreen;
  bool showControls;
  bool isAutoPlay;
  int startWithinSeconds;

  VideoPlayerScreen({
    Key key,
    this.playBackTime = 0,
    this.playBackTotalTime = 0,
    this.setPlayTime = "00:00",
    this.setPlayDuration = "00:00",
    this.aspectRatio = 16 / 9,
    this.videoUrl =
        "",
    this.isForward = true,
    this.isFullScreen = false,
    this.allowFullScreen = false,
    this.showControls = true,
    this.isAutoPlay = false,
    this.startWithinSeconds = 0,
  }) : super(key: key);

  @override
  _VideoPlayerScreenState createState() => _VideoPlayerScreenState();
}

class _VideoPlayerScreenState extends State<VideoPlayerScreen> {
  VideoPlayerController _controller;

  void initPlayer() async {
    _controller = VideoPlayerController.network(widget.videoUrl);
    await _controller.initialize();
    _controller.setLooping(true);
    _controller.seekTo(Duration(seconds: widget.startWithinSeconds));
    if (widget.isAutoPlay) {
      _controller.play();
    }
    _controller.addListener(() {
      setState(() {
        widget.playBackTime = _controller.value.position.inSeconds;
        widget.setPlayTime = timeFormatter(widget.playBackTime);
      });
    });
  }

  @override
  void initState() {
    initPlayer();
    super.initState();
  }

 @override
  void dispose() {
    _controller.dispose();
    SystemChrome.setPreferredOrientations([
      DeviceOrientation.landscapeRight,
      DeviceOrientation.landscapeLeft,
      DeviceOrientation.portraitUp,
      DeviceOrientation.portraitDown,
    ]);
    super.dispose();
  }

В конфигурации,

video_player: ^0.10.5

Вызов в другой класс CourseDetails.dart,

             Container(
                  padding: EdgeInsets.only(left: 20.0, right: 20.0),
                  child: ClipRRect(
                    borderRadius: BorderRadius.circular(8.0),
                    child: _playUrl != null
                        ? VideoPlayerScreen(videoUrl: _playUrl)
                        : Image.asset(
                            'assets/images/test_video_player_screen.png'),
                  ),
                )

GestureDetector(
 **here i am changing the state **
      onTap: () {
        setState(() {
            _playUrl = videoLists['course_video_url'];
        });
      },
      child: Padding(
        padding:
            EdgeInsets.only(left: 10.0, right: 20.0, top: 2.0, bottom: 5.0),
        child: Row(
          mainAxisSize: MainAxisSize.max,
          mainAxisAlignment: MainAxisAlignment.start,
          children: <Widget>[
            Text(
              "${videoLists['sn_no']}",
              textAlign: TextAlign.center,
              style: TextStyle(
                  fontSize: 18,
                  fontWeight: FontWeight.bold,
                  color: Colors.black45,
                  fontFamily: 'Oswald-SemiBold'),
            ),
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                Padding(
                  padding: EdgeInsets.only(left: 10.0),
                  child: Text(
                    "${videoLists['course_video_title']}",
                    textAlign: TextAlign.left,
                    style: TextStyle(
                        fontSize: 14,
                        fontWeight: FontWeight.bold,
                        color: Colors.black45,
                        fontFamily: 'Oswald-SemiBold'),
                  ),
                ),
                Row(
                  children: <Widget>[
                    Padding(
                      padding: EdgeInsets.only(left: 10.0),
                      child: Text(
                        "Video - ${videoLists['course_video_duration']}",
                        textAlign: TextAlign.left,
                        style: TextStyle(
                            fontSize: 12,
                            fontWeight: FontWeight.bold,
                            color: Colors.grey,
                            fontFamily: 'Oswald-SemiBold'),
                      ),
                    ),
                    Padding(
                        padding: EdgeInsets.only(left: 5.0),
                        child: videoLists['course_watched']
                            ? Image.asset(
                                'assets/images/green_tick_icon.png',
                                width: 12.0,
                                height: 12.0,
                              )
                            : null),
                  ],
                ),
              ],
            ),
          ],
        ),
      ),
    )

Answer 1

Спасибо за все ответы, я получил решение от себя. В функции сборки я проверил, происходит ли изменение URL-адреса или нет, если произошли изменения, я удалил старый контроллер и переинициализировал видео контроллер. Тогда это работает для меня нормально.

@override Widget build(BuildContext context) { if (currentObjectVideoUrl != widget.videoUrl) { _controller.dispose(); initPlayer(); } }

Answer 2

Этого можно добиться, создав виджет с сохранением состояния и передав URL. Затем внутри метода init вы можете сделать это

class ViewVideo extends StatefulWidget {
  final link;
  ViewVideo(this.link);
  @override
  _ViewVideoState createState() => _ViewVideoState(this.link);
}

class _ViewVideoState extends State<ViewVideo> {
  final link;
  _ViewVideoState(this.link);

  @override
  void initState() {
    super.initState();
    //Write your video player code here
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(),
    );
  }

  @override
  void dispose() {
     //Here you can close the video player
     super.dispose();
  }
}

Answer 3

Я изменил свой ответ на основе ваших комментариев. Вам просто нужно иметь URL-адрес видео в переменной класса, которую вы меняете с помощью setState. Затем на ваших виджетах проверьте наличие переменной и решите показать виджет VideoPlayerScreen или пустое поле.

String videoUrl = '';

@override
Widget build(BuildContext context) {
  return Column(
    children: <Widget>[
      videoUrl == '' ? SizedBox() : VideoPlayerScreen(videoUrl: videoUrl),
      RaisedButton(
        onPressed: () {
          setState((){
            videoUrl == videoLists['course_video_url'];
          });
        }
      ),
    ],
  );
}