Flutter How to send and show captured image/ video to next page?

414 views Asked by At

I've created a screen where I can use a button to open the camera and take video. And above that button, I made a container to display the video. But I want to show this container containing video to display on the next page. As I am new to flutter, I believe my code is messy. Can you help me with how to do this?

And how to show multiple videos on a screen after taking them through this camera in a loop like this image here?

Multiple video/image on same screen after capturing in flutter

Here is my code -

 class video_record02 extends StatefulWidget {
      final Function? onSelectVideo;
    
      const video_record02({Key? key, this.onSelectVideo});
    
      @override
      _video_record02State createState() => _video_record02State();
    }
    
    class _video_record02State extends State<video_record02> {
      String dropdownValue = 'Bedroom';
    
      File? storedVideo;
    
      Future<void> _takeVideo() async {
        final picker = ImagePicker();
        final videoFile = await picker.pickVideo(
          source: ImageSource.camera,
          preferredCameraDevice: CameraDevice.rear,
          maxDuration: Duration(
            seconds: 25,
          ),
        );
        if (videoFile == null) {
          return;
        }
        final rlyvideoFile = File(videoFile.path);
        setState(() {
          storedVideo = rlyvideoFile;
        });
        final appDir = await syspaths.getApplicationDocumentsDirectory();
        final fileName = path.basename(rlyvideoFile.path);
        final savedVideo = await rlyvideoFile.copy('${appDir.path}/$fileName');
        widget.onSelectVideo?.call(savedVideo);
      }
    
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          home: Scaffold(
            backgroundColor: Colors.white,
            body: Center(
              child: ListView(
                shrinkWrap: true,
                children: [
                  Column(
                    children: [
                      Container(
                          width: 150,
                          height: 100,
                          decoration: BoxDecoration(
                            border: Border.all(
                              width: 0.5,
                              color: Colors.grey,
                            ),
                          ),
                          child: storedVideo != null 
? VideoWidget(storedVideo!)
                                  : Text(
                                      'No Video Taken',
                                      textAlign: TextAlign.center,
                                    ),
                              alignment: Alignment.center),
                          Align(
                            alignment: Alignment.center,
                            child: Column(
                              children: [
    IconButton(
                                  icon: Icon(Icons.play_circle_fill),
                                  color: Colors.red,
                                  iconSize: 100.0,
                                  onPressed: _takeVideo,
        ),
                              ],
                            ),
                          ),
                          Text(
                            'Click to start',
                            style: TextStyle(
                              fontSize: 25.0,
                              color: Colors.red,
                              fontWeight: FontWeight.w300,
                            ),
                          ),
                          Container(
                            margin: EdgeInsets.fromLTRB(125, 0, 125, 0),
                            height: 50,
                            padding: EdgeInsets.fromLTRB(0, 0, 0, 0),
                            child: TextButton(
                              child: Text(
                                '< Back',
                                style: TextStyle(fontSize: 17, color: Colors.black),
                              ),
                              onPressed: () {
                                Navigator.push(
                                  context,
                                  MaterialPageRoute(
                                      builder: (context) => video_record01()),
                                );
                              },
                            ),
                          ),
                        ],
                      ),
                    ],
                  ),
                ),
              ),
            );
          }
        }
0

There are 0 answers