Can't able to save and display camera images in gridView in flutter using image_picker

Question

I am creating a widget in which I want to display a gridview of image clicked through mobile camera at runtime. I had used image_picker package from flutter. But it is only working for picking image from gallery and everytime I click image it crashes.

class _ImageInputState extends State<ImageInput>
with AutomaticKeepAliveClientMixin {
// list of images 
final List<File> _imageFileList = [];
   final ImagePicker _picker = ImagePicker();

Function for picking image from camera using image_picker

final imageFile = await _picker.pickImage(source: imageSource);
      if (imageFile == null) return;
      File tmpFile = File(imageFile.path);
      final appDir = await getApplicationDocumentsDirectory();
      final fileName = basename(imageFile.path);
      final localFile = await tmpFile.copy('${appDir.path}/$fileName');
      // setState(() {
      //   _imageFileList.add(localFile);
      //
      // });
     _pickImageGall(ImageSource.gallery);
    }
  

function for picking images from the gallery of phone

Future<void> _pickImageGall(ImageSource imageSource) async {
 final _pickedImage = await _picker.pickImage(source: imageSource);
  if (_pickedImage != null) {
    setState(() {
     _imageFileList.add(File(_pickedImage.path));
    });
   }
  }

and in the ui there is a gridview to display the images in which the last index is a input widget where there is two IconButton one for camera input and other for gallery input. As I am making this thing for the first time I am confused how to procedure will be . I had try to implement every solution from the stackoverflow but none worked for me. Please give the solution.