Flutter youtube播放器iframe无法正常工作与全屏

qnakjoqk  于 2023-02-20  发布在  Flutter
关注(0)|答案(1)|浏览(190)

我正在使用youtube_player_iframe播放视频。它正在工作,但如果点击播放器上的全屏按钮,它只显示小如图所示。它并不总是发生,但它是发生在两到三次一次。

import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:thitsarparami/blocs/bloc.dart';
import 'package:thitsarparami/helper/constants.dart';
import 'package:thitsarparami/helper/enum.dart';
import 'package:thitsarparami/ui/error/something_went_wrong.dart';
import 'package:thitsarparami/widgets/circular_progress_indicator_widget.dart';
import 'package:youtube_player_iframe/youtube_player_iframe.dart';

class VideoScreen extends StatefulWidget {
   static const routeName = '/video';
   const VideoScreen({Key? key}) : super(key: key);

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

 class _VideoScreenState extends State<VideoScreen> {
  @override
  void initState() {
    super.initState();
     _loadYoutube();
   }

  _loadYoutube() async {
     List<String> codes = [
       systemDataCodeToString(SystemDataCode.youtube_live),
     ];
     BlocProvider.of<SystemDataBloc>(context).add(GetYoutubeLiveEvent(codes));
   }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        backgroundColor: Theme.of(context).scaffoldBackgroundColor,
        elevation: 0,
        title: AutoSizeText(
          kYouTubeChannel,
           style: Theme.of(context).appBarTheme.titleTextStyle,
         ),
        leading: IconButton(
          onPressed: () {
             Navigator.pop(context);
           },
           icon: Icon(
            Icons.arrow_back,
             color: Theme.of(context).primaryIconTheme.color!,
           ),
         ),
       ),
      body: BlocBuilder<SystemDataBloc, SystemDataState>(
        builder: (context, state) {
          if (state is SystemDataError) {
            return const SomethingWentWrongScreen();
           } else if (state is YoutubeLiveDataLoaded) {
             return Column(
              mainAxisSize: MainAxisSize.max,
              children: [
                MyYoutubePlayer(
                  videoId: state.systemData.youtubeLive!.videoId!,
                ),
                Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: Text(
                    state.systemData.youtubeLive!.videoTitle!,
                     style: const TextStyle(
                        color: Colors.black,
                         fontSize: 16.0,
                         fontWeight: FontWeight.bold),
                  ),
                )
              ],
            );
          }
          return const CircularProgressIndicatorWidget();
        },
      ),
     );
  }
}

class MyYoutubePlayer extends StatefulWidget {
  final String videoId;
  const MyYoutubePlayer({Key? key, required this.videoId}) : super(key: key);

  @override
  State<MyYoutubePlayer> createState() => _MyYoutubePlayerState();
}

class _MyYoutubePlayerState extends State<MyYoutubePlayer> {
  late YoutubePlayerController _controller;
  @override
  void initState() {
    super.initState();
    _controller = YoutubePlayerController(
      initialVideoId: widget.videoId,
      params: const YoutubePlayerParams(
      showControls: true,
      showFullscreenButton: true,
      desktopMode: false,
      privacyEnhanced: true,
      useHybridComposition: true,
      ),
    );
    _controller.onEnterFullscreen = () {
      SystemChrome.setPreferredOrientations([
        DeviceOrientation.landscapeRight,
        DeviceOrientation.landscapeLeft,
      ]);
    };
    _controller.onExitFullscreen = () {
      SystemChrome.setPreferredOrientations([
        DeviceOrientation.portraitUp,
        DeviceOrientation.portraitDown,
      ]);
    };
  }

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

  @override
   Widget build(BuildContext context) {
    return YoutubePlayerIFrame(
      controller: _controller,
      aspectRatio: 16 / 9,
     );
  }
}
lx0bsm1f

lx0bsm1f1#

更改此

Widget build(BuildContext context) {
return YoutubePlayerIFrame(
  controller: _controller,
  aspectRatio: 16 / 9,
 );
}

到这个

Widget build(BuildContext context) {
return YoutubePlayerScaffold(
  autoFullScreen: true,
  builder: ((context, player) {
    return Container(
      width: 100.w,
      height: 100.h,
      color: Colors.black,
      child: Center(
        child: player,
      ),
    );
  }), 
  controller: _controller
);

}
全屏仅适用于YoutubePlayerScaffold小工具

相关问题