您如何在视频播放器类之外播放视频？

Question

对不起，如果问题不是那么直截了当，我才刚刚开始。我通过颤振示例看到的每个播放视频示例都使用与视频播放器相同类的浮动操作按钮。我想在我的主屏幕上添加一个视频播放器实例，并尝试不同的方式来播放视频（点击不同的元素等。我似乎无法访问实例来访问控制器。我不确定如何实际创建一个视频播放器实例，然后从另一个地方访问视频控制器。

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:video_player/video_player.dart';


class VideoPlayerScreen extends StatefulWidget {
  VideoPlayerScreen({Key key}) : super(key: key);
  final VideoPlayerScreenState videoState = new VideoPlayerScreenState();
  @override
  VideoPlayerScreenState createState() => VideoPlayerScreenState();
}

class VideoPlayerScreenState extends State<VideoPlayerScreen> {
  VideoPlayerController controller;
  Future<void> initializeVideoPlayerFuture;  

  @override
  void initState() {
    // Create and store the VideoPlayerController. The VideoPlayerController
    // offers several different constructors to play videos from assets, files,
    // or the internet.
    controller = VideoPlayerController.network('https://flutter.github.io/assets-for-api-docs/assets/videos/butterfly.mp4',
    );

    // Initialize the controller and store the Future for later use
    initializeVideoPlayerFuture = controller.initialize();

    // Use the controller to loop the video
    controller.setLooping(true);

    super.initState();
  }


  @override
  void dispose() {
    // Ensure you dispose the VideoPlayerController to free up resources
    controller.dispose();

    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      // Use a FutureBuilder to display a loading spinner while you wait for the
      // VideoPlayerController to finish initializing.
      child: FutureBuilder(
        future: initializeVideoPlayerFuture,
        builder: (context, snapshot) {
          if (snapshot.connectionState == ConnectionState.done) {
            // If the VideoPlayerController has finished initialization, use
            // the data it provides to limit the Aspect Ratio of the Video
            return AspectRatio(
              aspectRatio: controller.value.aspectRatio,
              // Use the VideoPlayer widget to display the video
              child: VideoPlayer(controller),
            );
          } else {
            // If the VideoPlayerController is still initializing, show a
            // loading spinner
            return Center(child: CircularProgressIndicator());
          }
        },
      ),
    );
  }
}

//this is the button I'm calling from the app.dart file

Widget playPauseButton(VideoPlayerScreen videoPlayer){

  return IconButton(
    alignment: Alignment.center,

    onPressed: (){
      // Wrap the play or pause in a call to `setState`. This ensures the
          // correct icon is shown
          setState(() {

            // If the video is playing, pause it.
            if (videoPlayer.videoState.controller.value.isPlaying) {
              videoPlayer.videoState.controller.pause();
            } else {
              // If the video is paused, play it
              videoPlayer.videoState.controller.play();
            }
          });
        },
      icon: Icon(videoPlayer.videoState.controller.value.isPlaying ? Icons.pause: Icons.play_arrow),

  );
}

Answer 1

您可以创建一个名为VideoProvider 的类，并在其中放置一个VideoPlayer 小部件。 之后，您只需要创建一个名为 controller 的参数并将其传递给您的 VideoPlayer 小部件。 controller 应该是 VideoPlayerController 的类型； 这是一个例子：

class MySpecificPage extends StatefulWidget {
    @override
    State<StatefulWidget> createState() {
        return _MySpecificPageState();
    }
}

class _MySpecificPageState extends State<MySpecificPage> {

    VideoPlayerController controller;
    VoidCallback listener;

    @override
    void initState() {
        listener = () => setState(() {});
        videoHandler();
        super.initState();
    }

    void videoHandler() {
        if (controller == null) {
            controller = VideoPlayerController.network('https://flutter.github.io/assets-for-api-docs/assets/videos/butterfly.mp4')
                ..addListener(listener)
                ..setVolume(0.5)
                ..initialize();
        } else {
            if (controller.value.isPlaying) {
                controller.pause();
            } else {
                controller.play();
            }
        }
    }


    @override
    Widget build(BuildContext context) {
        return Scaffold(
            appBar: AppBar(
                title: Text('Videop Provider Example'),
            ),
            body:Container(
            child: Column(
                children: <Widget>[
                    VideoProvider(controller),
                    RaisedButton(
                        child: Text('click here to play & puase the video'),
                        onPressed: () {
                            videoHandler();
                        },
                        )
                ],
                ),
            ),
        );
    }
}

class VideoProvider extends StatelessWidget {
    final VideoPlayerController controller;

    VideoProvider(this.controller);

    @override
    Widget build(BuildContext context) {
        return AspectRatio(
            aspectRatio: 16 / 9,
            child: VideoPlayer(
                controller
            ),
        );
    }
}