Flutter video_player视频播放器简单实用

1.支持Android、ios、web三平台
2.在使用的页面加入下面的代码

import 'package:auto_orientation/auto_orientation.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:shoolcloudvideo/utils/loading.dart';
import 'package:shoolcloudvideo/utils/my_toast_utils.dart';
import 'package:video_player/video_player.dart';

import '../../utils/widget_utils.dart';
import '../colors/my_colors.dart';

///监控视频详情页面
const String VIDEO_URL = '视频地址';

class VideoMorePage extends StatefulWidget {
    
    
  const VideoMorePage({
    
    Key? key}) : super(key: key);

  @override
  State<VideoMorePage> createState() => _VideoMorePageState();
}

class _VideoMorePageState extends State<VideoMorePage> {
    
    
  late VideoPlayerController _controller;
  late var _appbar;
  //是否全屏
  bool _isFullScreen = false;
  }

  @override
  void initState() {
    
    
    super.initState();
    AutoOrientation.portraitUpMode();
    _appbar = WidgetUtils.getAppBar('视频监控', true, context,false);
    Loading.show();
    _controller = VideoPlayerController.network(VIDEO_URL)
      ..initialize().then((_) async {
    
    
        await Future.delayed(Duration(seconds: 2));
        Loading.dismiss();
        setState(() {
    
    
          playOrPauseVideo();
        });
      }).catchError((err) {
    
    
        // if (stop) {
    
    
        //   return;
        // }
        Loading.dismiss();
        MyToastUtils.showToastBottom("加载出错,请重新打开");
        print('加载出错,请重新打开! e $err');
        // doPlayInitAndAutoPlay(urlToStreamVideo, stop: true);
      });
  }

  @override
  void dispose() {
    
    
    super.dispose();
    _controller.dispose();
  }

  void playOrPauseVideo() {
    
    
    setState(() {
    
    
      if (_controller.value.isPlaying) {
    
    
        _controller.pause();
      } else {
    
    
        // If the video is paused, play it.
        _controller.play();
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    
    
    return Scaffold(
      appBar:_appbar,
      backgroundColor: Colors.black,
      body:Column(
        children: [
          SizedBox(
            height: 300,
            width: double.infinity,
            child: _controller.value.isInitialized
                ? AspectRatio(
              aspectRatio: 16 / 9,
              // aspectRatio: _controller.value.aspectRatio,
              child: VideoPlayer(_controller),
            )

            //如果视频没有加载好或者因网络原因加载不出来则返回Container 组件
            //一般用于放置过渡画面
                : const Text("没有要播放的视频"),
          ),
          const SizedBox(height: 15,),
          SizedBox(
            height:  ScreenUtil().setHeight(40),
            child: Row(
              children: <Widget>[
                Padding(
                  padding:
                  EdgeInsets.only(left: ScreenUtil().setSp(40)),
                ),
                Container(
                  alignment: Alignment.bottomLeft,
                  height: ScreenUtil.screenWidth,
                  child: GestureDetector(
                      child: _controller.value.isPlaying == false
                          ? const Icon(
                        Icons.pause,
                        color: Colors.white,
                      )
                          : const Icon(
                        Icons.play_arrow,
                        color: Colors.white,
                      ),
                      onTap: () => {
    
    playOrPauseVideo()}),
                ),
                Expanded(
                  child: Container(),
                ),
                Container(
                  alignment: Alignment.bottomRight,
                  height: ScreenUtil.screenWidth,
                  child: GestureDetector(
                    child: _isFullScreen
                        ? const Icon(
                      Icons.fullscreen_exit,
                      color: Colors.white,
                    )
                        : const Icon(
                      Icons.fullscreen,
                      color: Colors.white,
                    ),
                    onTap: () {
    
    
                      _toggleFullScreen();
                    },
                  ),
                ),
                const Padding(
                  padding: EdgeInsets.only(right: 10),
                ),
              ],
            ),
          ),
        ],
      )
    );
  }


  void _toggleFullScreen() {
    
    
    setState(() {
    
    
      if (_isFullScreen) {
    
    
        /// 如果是全屏就切换竖屏
        AutoOrientation.portraitAutoMode();
        // _appbar = WidgetUtil.getAppBar(title: widget.title ?? '播放器');

        ///显示状态栏，与底部虚拟操作按钮
        SystemChrome.setEnabledSystemUIOverlays(
            [SystemUiOverlay.top, SystemUiOverlay.bottom]);

        _appbar = AppBar(
          //标题居中
          centerTitle: true,
          title: const Text(
            '视频监控',
            style: TextStyle(
                overflow: TextOverflow.ellipsis, color: Colors.white),
          ),
          elevation: 0, //去掉Appbar底部阴影
          //背景颜色
          backgroundColor: Colors.blue,
        );
      } else {
    
    
        AutoOrientation.landscapeAutoMode();
        _appbar = null;

        ///关闭状态栏，与底部虚拟操作按钮
        SystemChrome.setEnabledSystemUIOverlays([]);
      }
      _isFullScreen = !_isFullScreen;
    });
  }
}