Flutter 中播放影片

簡單介紹如何在 APP 中播放影片,Flutter 使用官方提供的 video_player 套件,在iOS上,video_player使用AVPlayer進行播放控制。在Android上,使用的是ExoPlayer 。在Web上,使用的是video_player_web

套件網址

本文SorcerCode

有使用到 Center 、 Container 、 可參考Flutter-最簡單的 Center 使用範例Flutter-最簡單的 Container 使用範例Flutter-最簡單的 Column 使用範例

打開 pubspec.yaml 加入 video_player: ^1.0.1

直接上範例測試

VideoPlayerController _controller;

  @override
  void initState() {
    super.initState();
    _controller = VideoPlayerController.network(
        'http://rai.dscloud.me/ddasd/3.mp4')
      ..initialize().then((_) {
        // Ensure the first frame is shown after the video is initialized, even before the play button has been pressed.
        setState(() {});
      });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Video Demo',
      home: Scaffold(
        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();
  }

啟動後

點擊播放

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *