flutter 一旦视频播放,第二个将自动暂停

lokaqttq  于 2023-01-18  发布在  Flutter
关注(0)|答案(1)|浏览(187)

文件1:页面视图部件.dart

class PageViewWidg extends StatefulWidget {
  final String videoUrl;
  final String videoUrl2;
  final String avatarImg;
  PageViewWidg({
    super.key,
    required this.videoUrl,
    required this.avatarImg,
    required this.videoUrl2,
    });

  @override
  State<PageViewWidg> createState() => _PageViewWidgState();
}

class _PageViewWidgState extends State<PageViewWidg> {
  late VideoPlayerController controller;
  
   @override
  void initState() {
    controller = VideoPlayerController.asset(widget.videoUrl)..initialize().then((_) {
        // Ensure the first frame is shown after the video is initialized, even before the play button has been pressed.
        setState(() {});
    });
    super.initState();
  }
  @override
  void dispose() {
    controller.dispose();
    super.dispose();
  }
 



  // build Profile
  buildProfuile(String profilePhoto){
    return SizedBox(
      width: 60,
      height:60,
      child: Stack(
        children: [
          Positioned(child: Container(
            width: 50,
            height: 50,
            padding: const EdgeInsets.all(1),
            decoration: BoxDecoration(
              color:Colors.white,
              borderRadius: BorderRadius.circular(25),
            ),
          child:ClipRRect(
            borderRadius: BorderRadius.circular(25),
            child: Image(image: NetworkImage(profilePhoto),fit: BoxFit.cover),
            ),
          ),
          ),
        ],
      ),
    );
  }
  // build Music Album
   buildMusicAlbum(String profilePhoto){
   return SizedBox(
    width: 60,
    height:60,
    child:Column(
      children: [
        Container(
          padding: const EdgeInsets.all(8),
          width: 50,
          height:50,
          decoration: BoxDecoration(
            gradient:  LinearGradient(
              colors: [ Colors.grey,Colors.white]
            ),
            borderRadius: BorderRadius.circular(25),
          ),
          child:ClipRRect(
            borderRadius: BorderRadius.circular(15),
            child: Image(image: NetworkImage(profilePhoto),fit: BoxFit.cover,),
          )
        )
      ],
    )
   );
  }

  @override
  Widget build(BuildContext context) {
    return Expanded(
      child: InkWell(
        onTap:(){
                Navigator.of(context).push(
                        MaterialPageRoute(builder: (_) => ExpandPageView(avatarImg: widget.avatarImg,imgUrl: widget.videoUrl,controller: controller,),
                    )); 
                    },
        child: Stack(
             children: [
                    // AspectRatio( 
                    //       aspectRatio: controller.value.aspectRatio,
                    //       child: VideoPlayer(controller),
                    //  ),
                controller.value.isInitialized
                ?
                VideoPlayer(controller)
                :
                Container(),
                Center(
                  child: InkWell(
                            onTap:(){
                               controller.value.isPlaying
                               ?
                               setState((){
                                controller.pause();
                               })
                               :
                                setState((){
                                controller.play();
                               });
                            },
                            child:
                                Image.asset(
                                  controller.value.isPlaying
                                    ?
                                      'assets/images/pause_icon.png'
                                      :
                                      'assets/images/play_icon.png'
                                      ,
                                      height:50,
                                )
                              
                         ),
                ),

文件2:主屏幕.dart

class HomeSceen extends StatefulWidget {
  const HomeSceen({super.key});

  @override
  State<HomeSceen> createState() => _HomeSceenState();
}

class _HomeSceenState extends State<HomeSceen> {

  List<PageViewWidg> videos=[
    PageViewWidg(
              videoUrl: 'assets/videos/video.mp4',
              videoUrl2: 'assets/videos/video.mp4',
              avatarImg: 'assets/images/pic2.jpg',
           ),
    PageViewWidg(
              videoUrl: 'assets/videos/video2.mp4',
              videoUrl2: 'assets/videos/video2.mp4',
              avatarImg: 'assets/images/pic1.jfif',
           ),
    PageViewWidg(
              videoUrl: 'assets/videos/video3.mp4',
              videoUrl2: 'assets/videos/video3.mp4',
              avatarImg: 'assets/images/pic2.jpg',
           ),
    PageViewWidg(
              videoUrl: 'assets/videos/video4.mp4',
              videoUrl2: 'assets/videos/video2.mp4',

              avatarImg: 'assets/images/pic1.jfif',
           ),
    PageViewWidg(
              videoUrl: 'assets/videos/video2.mp4',
              videoUrl2: 'assets/videos/video2.mp4',

              avatarImg: 'assets/images/pic2.jpg',
           ),
    PageViewWidg(
              videoUrl: 'assets/videos/video2.mp4',
              videoUrl2: 'assets/videos/video2.mp4',
              avatarImg: 'assets/images/pic2.jpg',
           ),
     ];
    final PageController pagecontroller=PageController(
      initialPage: 0, 
    );
  //
  @override
  Widget build(BuildContext context) {
    // final size=MediaQuery.of(context).size;
    bool like=true;
    return Scaffold(
      body:SafeArea(
        child: PageView.builder(
        itemCount: videos.length,
        controller:pagecontroller,
        scrollDirection: Axis.vertical,
        itemBuilder: (context,index){
          return Stack(
            alignment: AlignmentDirectional.centerEnd,
            children:[
              Column(
                children: [
                  videos[index],
                  // Divider(height:2,color:Color.fromARGB(255, 76, 72, 72)),
                  videos[index+1],
                ],
              ),

我试着添加两个控制器和视频的每一个控制器,它对我不起作用。

VideoPlayerController _controller1;
  VideoPlayerController _controller2;
  @override
  void initState() {
    super.initState();
    _controller1 = VideoPlayerController.assets(videoUrl1)
      ..initialize().then((_) {
        setState(() {});
      });
    _controller2 = VideoPlayerController.assets(videoUrl2)
      ..initialize().then((_) {

        setState(() {});
      });
  }

我现在需要的是如何控制两个视频时,视频开始,第二个将停止并改变他们的图标或imageAssets一样,如果图标暂停,它改变为播放图标和第二个视频也如果第一个视频有一个暂停图标,另一个视频将改变为开始视频。

uqdfh47h

uqdfh47h1#

这就是我最终找到的答案。

late VideoPlayerController _controller1;
  late VideoPlayerController _controller2;
  bool _isPaused1 = true;
  bool _isPaused2 = true;
  @override
  void initState() {
   super.initState();
   _controller1 =VideoPlayerController.network(videos[3]);
  _controller1.addListener(() {
      setState(() {});
    });
    // _controller1.setLooping(true);
    _controller1.initialize().then((_) => setState(() {}));
    _controller2 =VideoPlayerController.network(videos[5]);
    _controller2.addListener(() {
      setState(() {});
    });
    // _controller2.setLooping(true);
    _controller2.initialize().then((_) => setState(() {}));
  }

  @override
  void dispose() {
    _controller1.dispose();
    _controller2.dispose();
    super.dispose();
  }
 _playPauseToggle1() {
    setState(() {
      if (_isPaused1) {
        _controller1.play();
        _controller2.pause(); // if _controller1 is playing, _controller2 should be paused
        _isPaused2 = true;
      } else {
        _controller1.pause();
      }
      _isPaused1 = !_isPaused1;
    });
  }

  _playPauseToggle2() {
    setState(() {
      if (_isPaused2) {
        _controller2.play();
        _controller1.pause(); // if _controller2 is playing, _controller1 should be paused
        _isPaused1 = true;
      } else {
        _controller2.pause();
      }
      _isPaused2 = !_isPaused2;
    });
  }
VideoPlayer(_controller1),
                Center(
                      child: InkWell(
                                onTap: _playPauseToggle1,
                                 // ignore: dead_code
                                 child:_isPaused1?
                                  Image.asset('assets/images/play_icon.png',height:50,color: Colors.grey,)
                                  :
                                 Image.asset('assets/images/pause_icon.png',height:50,color: Colors.grey,)
                             ),
                    ),
 VideoPlayer(_controller2),
                Center(
                      child: InkWell(
                                onTap: _playPauseToggle2,
                                 // ignore: dead_code
                                 child:_isPaused2 ?
                                  Image.asset('assets/images/play_icon.png',height:50,color: Colors.grey,)
                                  :
                                  Image.asset('assets/images/pause_icon.png',height:50,color: Colors.grey,)
                             ),
                    ),

并取决于视频,如果是开始,我改变图标,否则我改变图标到另一个状态。
我希望它能对一些寻找类似问题的人有所帮助。

相关问题