我正在使用Flutter开发一个移动的应用程序,我正在使用“youtube_player”包在我的应用程序中显示YouTube视频。但是,当我列出视频并向上滚动时,视频与AppBar重叠,这是意外的行为。如何解决此问题?
Code Snippets:毕业证
(https://i.stack.imgur.com/h3hPJ.jpg)
(https://i.stack.imgur.com/TVzzD.png)]
class YoutubeVideoPlayer extends YoutubePlayer {
YoutubeVideoPlayer(BuildContext context,
{Key? key, required YoutubePlayerController controller})
: super(
key: ObjectKey(controller.initialVideoId),
controller: controller,
showVideoProgressIndicator: true,
progressIndicatorColor: context.colorScheme.primary,
aspectRatio: context.width(.2) / context.height(.054),
bottomActions: [
CurrentPosition(),
const SizedBox(width: 10.0),
ProgressBar(isExpanded: true),
const SizedBox(width: 10.0),
FullScreenButton(),
],
);
}
import 'package:auto_route/auto_route.dart';
import 'package:doktorumsun_app/core/extension/context_extension.dart';
import 'package:doktorumsun_app/product/constant/count_constant.dart';
import 'package:doktorumsun_app/product/widget/player/youtebe_video_player.dart';
import 'package:doktorumsun_app/product/widget/text/text_widget.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:visibility_detector/visibility_detector.dart';
import 'package:youtube_player_flutter/youtube_player_flutter.dart';
class YoutubeVideo extends StatefulWidget {
final String? subtitle;
final String videoKey;
const YoutubeVideo({super.key, required this.videoKey, this.subtitle});
@override
State<YoutubeVideo> createState() => _YoutubeVideoState();
}
class _YoutubeVideoState extends State<YoutubeVideo> {
late YoutubePlayerController _controller;
late TextEditingController _idController;
late TextEditingController _seekToController;
bool isFullScreen = true;
final bool _isPlayerReady = false;
@override
void initState() {
super.initState();
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
]);
_controller = YoutubePlayerController(
/* */
initialVideoId: widget.videoKey,
flags: const YoutubePlayerFlags(
hideControls: true,
mute: false,
autoPlay: false,
disableDragSeek: false,
useHybridComposition: false,
showLiveFullscreenButton: false,
loop: false,
controlsVisibleAtStart: false,
isLive: false,
forceHD: false,
enableCaption: false,
),
)..addListener(listener);
_idController = TextEditingController();
_seekToController = TextEditingController();
}
void listener() {
if (_isPlayerReady && mounted && !_controller.value.isFullScreen) {
setState(() {});
}
}
@override
void deactivate() {
// Pauses video while navigating to next page.
_controller.pause();
super.deactivate();
}
@override
void dispose() {
_controller.dispose();
_idController.dispose();
_seekToController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return VisibilityDetector(
key: const Key("youtube-vide"),
onVisibilityChanged: (info) {
if (info.visibleFraction == 0) {
_controller.pause();
} else {
_controller.value.isPlaying
? _controller.play()
: _controller.pause();
}
},
child: Column(
children: [
_youtubeVideoPlayer(context),
if (_controller.value.isFullScreen == false)
Padding(
padding: context.paddingAll(6),
child: TextWidget.subtitle(
text: widget.subtitle ?? '',
fontWeight: FontWeight.bold,
maxLines: CountConstant.two,
textAlign: TextAlign.center,
),
)
],
),
);
}
YoutubePlayerBuilder _youtubeVideoPlayer(BuildContext context) {
return YoutubePlayerBuilder(
player: YoutubeVideoPlayer(
context,
controller: _controller,
),
builder: (context, player) {
_controller = YoutubePlayerController(
initialVideoId: widget.videoKey,
flags: const YoutubePlayerFlags(
autoPlay: true,
),
);
return InkWell(
onTap: () {
showGeneralDialog(
context: context,
pageBuilder: (context, animation, secondaryAnimation) => Dialog(
insetPadding: EdgeInsets.zero,
child: Stack(
children: [
GestureDetector(
onVerticalDragEnd: (DragEndDetails details) {
if (details.primaryVelocity! > 0) {
context.router.pop();
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
]);
}
},
child: YoutubePlayer(
controller: _controller,
),
),
Positioned(
right: CountConstant.zero.toDouble(),
child: IconButton(
onPressed: () {
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
]);
context.popRoute();
},
icon: const DecoratedBox(
decoration: BoxDecoration(
shape: BoxShape.circle, color: Colors.red),
child: Icon(
Icons.close,
color: Colors.white,
),
)),
),
],
),
),
);
},
child: player);
},
);
}
}
1条答案
按热度按时间vuktfyat1#
您可以使用
quill
版本,而不是其相同的源代码https://pub.dev/packages/youtube_player_flutter_quill