Directly navigate to a preview route after taking a picture

[aufabdulnafea]

Proposal

I am fairly new to flutter (couple days), but thank to your documentation I was able to use this widget without any problem, however I am trying to navigate to another screen directly after taking a picture. this is the code I used to accomplish that

`import 'dart:io';

import 'package:camerawesome/camerawesome_plugin.dart'; import 'package:flutter/material.dart'; import 'package:path_provider/path_provider.dart';

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

@override State createState() => _CameraScreenState(); }

class _CameraScreenState extends State { late String imagePath = '';

@override Widget build(BuildContext context) { return Scaffold( body: CameraAwesomeBuilder.awesome( enablePhysicalButton: true, previewFit: CameraPreviewFit.contain, previewAlignment: Alignment.center, saveConfig: SaveConfig.photo(pathBuilder: () async { final Directory extDir = await getTemporaryDirectory(); final testDir = await Directory('${extDir.path}/test').create(recursive: true); const String fileExtension = 'jpg'; final String filePath = '${testDir.path}/${DateTime.now().millisecondsSinceEpoch}.$fileExtension'; print(filePath); imagePath = filePath; return filePath; }), theme: AwesomeTheme( bottomActionsBackgroundColor: Colors.transparent, buttonTheme: AwesomeButtonTheme( backgroundColor: Colors.cyan.withOpacity(0.5), iconSize: 20, foregroundColor: Colors.white, padding: const EdgeInsets.all(16), buttonBuilder: (child, onTap) { return ClipOval( child: Material( color: Colors.transparent, shape: const CircleBorder(), child: InkWell( splashColor: Colors.cyan, highlightColor: Colors.cyan.withOpacity(0.5), onTap: onTap, child: child, ), ), ); }, ), ), bottomActionsBuilder: (state) => AwesomeBottomActions( state: state, right: Container(), left: AwesomeCameraSwitchButton( state: state, scale: 1.0, onSwitchTap: (state) { state.switchCameraSensor( aspectRatio: state.sensorConfig.aspectRatio, ); }, ), ), )); } } `

and this is the preview screen.

`class PreviewScreen extends StatelessWidget { final String imagePath;

const PreviewScreen({super.key, required this.imagePath});

@override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: const Text('Display the Picture')), body: Image.file(File(imagePath)), ); } }`

I am able to see the taken picture in separate screen, but when I try to go back to the camera screen I get this asset error

Failed assertion: line 3032 pos 18: '!navigator._debugLocked': is not true.

Describe your new feature

[aufabdulnafea]

solved the problem with this code

`` cameraState.captureState$.listen((event) async { if (event == null) return; if (event.status != MediaCaptureStatus.success) return;

          String filePath = event.filePath;
          try {
            // If the picture was taken, display it on a new screen.
            await Navigator.of(context).push(
              MaterialPageRoute(
                builder: (context) => PreviewScreen(
                  imagePath: filePath,
                ),
              ),
            );
          } catch (e) {
            print('___________________');
            print(e);
          }
        });

``

[istornz]

I close the issue as you found a solution 👍

Feel free to open an other if any :)