I am using Image picker and image cropper dependencies and trying to get image but it shows error

Question

I am trying to upload image into the database. I have used image picker and image cropper dependencies but it still shows error in the code within the ** that it donot recognize such commands. After the image picker it donot suggests pickimage. Kindly help me get through it. class EmployeeRegistrationScreen extends StatefulWidget {

  static const id = 'employee_register';

  @override
  _EmployeeRegistrationScreenState createState() => _EmployeeRegistrationScreenState();
}

class _EmployeeRegistrationScreenState extends State<EmployeeRegistrationScreen> {

  bool showSpinner = false;
  final _auth = FirebaseAuth.instance;
  String email;
  String password;
  String confirmPassword;
  bool  _passwordVisible = false;
  bool _confirmPasswordVisible = false;
  String name;

  File _imageFile;

  /// Cropper plugin
  Future<void> _cropImage() async {
    File cropped = await ImageCropper.cropImage(
        sourcePath: _imageFile.path,
        // ratioX: 1.0,
        // ratioY: 1.0,
        // maxWidth: 512,
        // maxHeight: 512,
        **toolbarColor: Colors.purple,**
        **toolbarWidgetColor: Colors.white,**
        **toolbarTitle: 'Crop It'**
    );

    setState(() {
      _imageFile = cropped ?? _imageFile;
    });
  }

  /// Select an image via gallery or camera
  Future<void> _pickImage(ImageSource source) async {
    **XFile selected = await ImagePicker.pickImage(source: source);**

    setState(() {
      _imageFile = selected as File;
    });
  }

  /// Remove image
  void _clear() {
    setState(() => _imageFile = null);
  }


  @override
  void initState() {

    _passwordVisible = false;
    _confirmPasswordVisible = false;

  }
  final _formKey = GlobalKey<FormState>();
  @override
  Widget build(BuildContext context) {
    return Form(

Answer 1

Since pickImage is not a static method, the correct way to access the pickImage function is to create an instance of ImagePicker.

final ImagePicker _picker = ImagePicker();
// Pick an image
final XFile? image = await _picker.pickImage(source: ImageSource.gallery); 

for Your case,

Future<void> _pickImage(ImageSource source) async {
    // replace ImagePicker.pickImage with ImagePicker().pickImage()
    **XFile selected = await ImagePicker().pickImage(source: source);**

    setState(() {
      _imageFile = selected as File;
    });
  }

Answer 2

Pubsec.yaml:

name: flash_chat
description: A new Flutter application.

version: 1.0.0+1

environment:
  sdk: ">=2.1.0<3.0.0"

dependencies:
  flutter:
    sdk: flutter

  cupertino_icons: ^0.1.2
  firebase_storage: ^10.0.6
  image_cropper: ^1.4.1
  image_picker: ^0.8.4+4
  animated_text_kit: ^4.2.1
  firebase_core: ^1.5.0
  firebase_auth: ^3.0.2
  cloud_firestore: ^2.5.0
  modal_progress_hud: ^0.1.3

dev_dependencies:
  flutter_test:
    sdk: flutter

flutter:
  uses-material-design: true

  assets:
  - images/

Imports :

import 'dart:ui';
import 'package:flash_chat/constants.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flash_chat/components/RoundedButton.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:flash_chat/screens/chat_screen.dart';
import 'package:modal_progress_hud/modal_progress_hud.dart';
import 'package:image_cropper/image_cropper.dart';
import 'package:firebase_storage/firebase_storage.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:image_picker/image_picker.dart';
import 'dart:io';
import 'package:flutter/widgets.dart';