Flutter videoplayer 实现播放功能小部件

2019-12-05  本文已影响0人  曾经也是个少年

废话不说,先上代码

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

class VideoShowWidget extends StatefulWidget {
  final String video;
  VideoShowWidget({Key key, this.video,}) : super(key: key);

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

class _VideoShowWidgetState extends State<VideoShowWidget> {
  VideoPlayerController _controller;
  bool _isPlaying = false;
  // String _selectType = '高清';
  String _url= '';
  @override
  void initState() {
      super.initState();
      this._url = widget.video;
      _controller = VideoPlayerController.network(this._url)
      // 播放状态
      ..addListener(() {
        if(_controller != null){
          final bool isPlaying = _controller.value.isPlaying;
          if (isPlaying != _isPlaying) {
              setState(() { _isPlaying = isPlaying; });
          }
        }
      })
      // 在初始化完成后必须更新界面
      ..initialize().then((_) {
          setState(() {});
      })
      ..setLooping(true);
  }
  @override
  void dispose() {
    super.dispose();
    if(_controller.value.isPlaying){
      _controller.pause();
    }
  }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
          body: Container(
            child: Stack(
              children: <Widget>[
                Positioned(
                  child: Container(
                    child: _controller.value.initialized
                        // 加载成功
                        ? new AspectRatio(
                            aspectRatio: _controller.value.aspectRatio,
                            child: VideoPlayer(_controller),
                        ) : new Container(),
                    ),
                ),
                Positioned(
                  child: Container(
                    padding: EdgeInsets.fromLTRB(16, 24, 16, 16),
                    color: Colors.white24,
                    child: Row(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: <Widget>[
                        GestureDetector(
                          onTap: (){
                            Navigator.pop(context);
                          },
                          child: Icon(Icons.arrow_back_ios,color: Colors.white,size: 24,),
                        ),
                        Row(
                          mainAxisAlignment: MainAxisAlignment.end,
                          children: <Widget>[
                             
                          ],
                        )
                      ],
                    ),
                  ),
                )
              ],
            ),
          ),
          
          floatingActionButton: new FloatingActionButton(
              backgroundColor: Colors.white,
              onPressed: (){
                if(_controller.value.isPlaying){
                  _controller.pause();
                }else{
                  _controller.play();
                }
              },
              child: new Icon(
                  _controller.value.isPlaying ? Icons.pause : Icons.play_arrow,
                  color: Colors.black,
                  size: 40,
              ),
          ),
      );
  }
}

copy以上代码,传入视频地址 video,就ok了,


image.png
上一篇下一篇

猜你喜欢

热点阅读