import 'dart:io'; import 'package:chewie/chewie.dart'; import 'package:dio/dio.dart'; import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:flutter_easyloading/flutter_easyloading.dart'; import 'package:flutter_smart_dialog/flutter_smart_dialog.dart'; import 'package:huixiang/generated/l10n.dart'; import 'package:huixiang/retrofit/data/base_data.dart'; import 'package:huixiang/retrofit/data/chapter.dart'; import 'package:huixiang/retrofit/data/course_details.dart'; import 'package:huixiang/retrofit/retrofit_api.dart'; import 'package:huixiang/utils/font_weight.dart'; import 'package:huixiang/view_widget/custom_image.dart'; import 'package:chewie/src/chewie_progress_colors.dart' as chewie; import 'package:huixiang/view_widget/tips_dialog.dart'; import 'package:huixiang/web/web_view/comment_list.dart'; import 'package:huixiang/web/web_view/input_comment.dart'; import 'package:shared_preferences/shared_preferences.dart'; import 'package:video_player/video_player.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; class ClassDetails extends StatefulWidget { final Map arguments; ClassDetails({this.arguments}); @override State createState() { return _ClassDetails(); } } class _ClassDetails extends State with WidgetsBindingObserver{ VideoPlayerController videoPlayerController; Chewie chewies; ChewieController chewieAudioController; ApiService apiService; final GlobalKey commentKey = GlobalKey(); final ScrollController scrollController = ScrollController(); bool isKeyBoardShow = false; var commentFocus = FocusNode(); String parenId = "0"; String hintText = S.current.liuxianinjingcaidepinglunba; final GlobalKey inputKey = GlobalKey(); final TextEditingController commentTextController = TextEditingController(); int commentTotal = 0; CourseDetails course; List chapterList = []; bool isShowImg = true; int chapterIndex = 0; @override void initState() { super.initState(); WidgetsBinding.instance.addObserver(this); courseDetails(widget.arguments["id"]); queryChapterList(widget.arguments["id"]); } ///课程章节列表 queryChapterList(courseId) async { if (apiService == null) { SharedPreferences value = await SharedPreferences.getInstance(); apiService = ApiService( Dio(), context: context, token: value.getString("token"), ); } BaseData> baseData = await apiService.catalogList(courseId).catchError((onError) {}); if (baseData != null && baseData.isSuccess) { setState(() { chapterList.clear(); chapterList.addAll(baseData.data); chapterIndex = 0; initVideo(chapterList[chapterIndex].content.fileUrl); }); } EasyLoading.dismiss(); } ///课程详情 courseDetails(id) async { if (apiService == null) { SharedPreferences value = await SharedPreferences.getInstance(); apiService = ApiService( Dio(), context: context, token: value.getString("token"), ); } BaseData baseData = await apiService.course(id).catchError((error) {}); if (baseData != null && baseData.isSuccess) { setState(() { course = baseData.data; }); } } @override void dispose() { /** * 页面销毁时，视频播放器也销毁 */ if (chewieAudioController != null) { chewieAudioController.pause(); chewieAudioController.dispose(); chewieAudioController = null; } if (videoPlayerController != null) { videoPlayerController.pause(); videoPlayerController.dispose(); } super.dispose(); } @override void didChangeMetrics() { WidgetsBinding.instance.addPostFrameCallback((_) { if (!mounted) return; if (MediaQuery .of(context) .viewInsets .bottom == 0) { if (isKeyBoardShow) { FocusScope.of(context).requestFocus(FocusNode()); if (mounted) setState(() { hintText = S.current.liuxianinjingcaidepinglunba; isKeyBoardShow = false; }); } } else { if (mounted) setState(() { isKeyBoardShow = true; }); } }); } @override Widget build(BuildContext context) { return Scaffold( body: Container( child:Column( children: [ Expanded( child: SingleChildScrollView( physics: BouncingScrollPhysics(), child: Column( children: [ Stack( children: [ videoWidget( MediaQuery.of(context).size.width, videoPlayerController != null ? (MediaQuery.of(context).size.width) / videoPlayerController.value.aspectRatio : MediaQuery.of(context).size.width / 2, chapterList.length>chapterIndex?chapterList[chapterIndex].content.coverImg:"", ), Container( margin: EdgeInsets.only(top: 40.h, left: 16.w, right: 16.w), decoration: BoxDecoration( color: Colors.transparent, ), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, crossAxisAlignment: CrossAxisAlignment.center, children: [ GestureDetector( child: Image.asset( "assets/image/integral_return.png", width: 24, height: 24, ), onTap: () { Navigator.of(context).pop(course != null ? course.viewers+1 :0); }, ), ], ), ), ], ), Container( height: 123, margin: EdgeInsets.only(bottom: 16.h), padding: EdgeInsets.only(left: 16,top: 16,right: 10), decoration: BoxDecoration( color: Colors.white, boxShadow: [ BoxShadow( color: Colors.black.withAlpha(12), offset: Offset(0, 2), blurRadius: 14, spreadRadius: 0, ) ], ), child: Column( mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start, children: [ Row( children: [ Container( height: 22.h, width: 40.w, alignment: Alignment.center, decoration: BoxDecoration( borderRadius: BorderRadius.circular(2), border: Border.all( width: 1, color: Color(0xFFFF7A1A), style: BorderStyle.solid, ), ), child: Text( ( course?.tags != null && course.tags.length > 0 )?course.tags[0] : "", style: TextStyle( fontSize: 14.sp, fontWeight: MyFontWeight.medium, color: Color(0xFFFF7A1A), ), ), ), SizedBox( width: 6.w, ), Expanded( child: Text( course != null ?course.subject:"", overflow: TextOverflow.ellipsis, maxLines: 2, style: TextStyle( fontSize: 16.sp, fontWeight: MyFontWeight.semi_bold, color: Color(0xFF1A1A1A), ), ), flex: 1, ) ], ), SizedBox( height:10.h, ), Padding(padding: EdgeInsets.only(right: 16), child: Row( children: [ Expanded( child: Text( "讲师:${course !=null ? course.author.name :""}", overflow: TextOverflow.ellipsis, maxLines: 2, style: TextStyle( fontSize: 12.sp, fontWeight: MyFontWeight.regular, color: Colors.black, ), )), Text( "播放次数:", style: TextStyle( fontSize: 12.sp, fontWeight: MyFontWeight.regular, color: Color(0xFF808080), ), ), SizedBox( width:4, ), Text( course != null ? course.viewers.toString() :"", overflow: TextOverflow.ellipsis, maxLines: 2, style: TextStyle( fontSize: 12.sp, fontWeight: MyFontWeight.regular, color: Color(0xFF808080), ), ), ], ),), SizedBox( height:10.h, ), Text( course != null ?course.introduce:"", overflow: TextOverflow.ellipsis, maxLines: 2, style: TextStyle( fontSize: 12.sp, fontWeight: MyFontWeight.regular, color: Colors.black, ), ), ], ), ), anthology(), CommentList( commentKey, course?.likes ?? course?.likes?? 0, widget.arguments["id"], 3, isKeyBoardShow, _reply, _delCommentTips, 12.sp, requestApiFinish: (total){setState(() { commentTotal = total; });}, ), if (commentTotal == 0) Container( width: double.infinity, alignment: Alignment.topCenter, margin: EdgeInsets.only(top: 40), padding: EdgeInsets.all(22.h), child: Text( S .of(context) .zanwupinglun, style: TextStyle( fontSize: 12, fontWeight: FontWeight.bold, color: Color(0xFFA0A0A0), ), ), ), ], ), ), flex: 1,), /// 富文本评论的输入框 InputComment( inputKey, hintText, isKeyBoardShow, commentFocus, commentTextController, _toComment, _queryMemberComment, _queryCourseLikes, isLike:course?.selfLiked, ), ], ), ), ); } initVideo(videoUrl) async { videoPlayerController = VideoPlayerController.network( videoUrl, )..initialize().then((value) { chewieAudioController = ChewieController( videoPlayerController: videoPlayerController, aspectRatio: videoPlayerController.value.aspectRatio, //宽高比 autoPlay: false, //自动播放 looping: false, //循环播放 allowFullScreen: false, // 拖动条样式颜色 materialProgressColors: chewie.ChewieProgressColors( playedColor: Colors.white, handleColor: Colors.white, backgroundColor: Colors.grey, bufferedColor: Colors.transparent, ), autoInitialize: true, ); chewieAudioController.addListener(_fullScreenListener); if (mounted) setState(() {}); }); } Future _fullScreenListener() async { if (!chewieAudioController.isFullScreen) { Future.delayed(Duration(seconds: 1), () { }); } } Widget videoWidget(double width, double height, src) { print("src : $src"); return MediaQuery( data: MediaQuery.of(context).copyWith( textScaleFactor: 0.9, ), child: !isShowImg ? (chewieAudioController != null ? Container( width: width, height: height, child: chewies = Chewie( controller: chewieAudioController, ), ) : Container( width: width, height: height, )) : GestureDetector( onTap: (){ setState(() { isShowImg = false; }); }, child: Container( width: width, height: width / 7 * 5, color: Colors.black, child: Stack( children: [ Center( child: MImage( src, fit: BoxFit.cover, errorSrc: "assets/image/default_2_1.png", fadeSrc: "assets/image/default_2_1.png", ), ), Center( child: Icon( Icons.play_circle_outline, color: Colors.white, size: 60, ), ), ], ), ), ), ); } Widget anthology() { return Container( color: Colors.white, margin: EdgeInsets.only(bottom: 16), padding: EdgeInsets.all(16), child: Column( children: [ Row( crossAxisAlignment: CrossAxisAlignment.start, mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ Text( "选集", style: TextStyle( fontSize: 15.sp, fontWeight: MyFontWeight.medium, color: Color(0xFF1A1A1A), ), ), Text( "共${chapterList.length}集", style: TextStyle( fontSize: 16.sp, fontWeight: MyFontWeight.regular, color: Color(0xFF1A1A1A), ), ), ], ), Container( height: 70.h, margin: EdgeInsets.only(top:10), child: ListView.builder( scrollDirection: Axis.horizontal, physics: BouncingScrollPhysics(), itemCount:chapterList.length, itemBuilder: (context, position) { return GestureDetector( onTap: () { setState(() { chapterIndex = position; isShowImg = true; initVideo(chapterList[position].content.fileUrl); }); }, child: classSelectItem(chapterList[position],position), ); }, ), ), ], ), ); } Widget classSelectItem(Chapter chapterList,position) { return Container( width: 106.w, alignment: Alignment.center, margin: EdgeInsets.symmetric( horizontal: 6.w, vertical: 3, ), padding: EdgeInsets.all(8), decoration: BoxDecoration( borderRadius: BorderRadius.circular(4), color: position==chapterIndex ? Color(0xFF32A060): Color(0xFFE5E5E5), ), child: Text( chapterList?.name ?? chapterList.name ?? "", style: TextStyle( fontSize: 12.sp, fontWeight: MyFontWeight.regular, color: position == chapterIndex ? Colors.white :Color(0xFF7C7C7C), ), ), ); } ///课程点赞 _queryCourseLikes() async { BaseData baseData = await apiService.courseLikes(widget.arguments["id"]).catchError((onError) {}); if (baseData != null && baseData.isSuccess) { setState(() { if (course.selfLiked ?? false) course.likes -= 1; else course.likes += 1; course.selfLiked = !course.selfLiked ?? false; }); commentKey.currentState.setState(() {}); } else { // SmartDialog.showToast(baseData.msg, alignment: Alignment.center); } } ///发布评论 _queryMemberComment(String content) async { BaseData baseData = await apiService.memberComment({ "content": content, "parentId": parenId, "relationalId":widget.arguments["id"], "relationalType": 3 }).catchError((error) {}); if (baseData != null && baseData.isSuccess) { CommentListState state = commentKey.currentState; state.queryMemberCommentList(); commentTextController.text = ""; FocusScope.of(context).unfocus(); // _toComment(); } } ///滑动到评论列表 _toComment() { if (commentKey.currentContext == null) return; RenderBox firstRenderBox = commentKey.currentContext.findRenderObject(); Offset first = firstRenderBox.localToGlobal(Offset.zero); scrollController.animateTo( first.dy + scrollController.offset - (kToolbarHeight + MediaQuery .of(context) .padding .top), duration: Duration(milliseconds: 300), curve: Curves.easeIn, ); } ///评论 回复 _reply(memberComment) { FocusScope.of(context).requestFocus(commentFocus); parenId = memberComment.id; hintText = S.of(context).huifu_("${memberComment.username}"); } ///删除评论 delComment(memberComment) async { BaseData baseData = await apiService.delComment(memberComment.id); if (baseData != null && baseData.isSuccess) { CommentListState state = commentKey.currentState; state.queryMemberCommentList(); } } ///删除评论的提示 _delCommentTips(memberComment) { SmartDialog.show(widget: Tips(() { delComment(memberComment); })); } }