lateinitializationerror field imageFile has not been initialized

Question

I am trying to upload an image from the gallery in flutter web project. However when I click on the upload button, I get an error "======== Exception caught by widgets library ===============================================LateInitializationError: Field imageFile has not been initialized." What could be causing this error? Here is my code:

final picker = ImagePicker();
late File imageFile;

Future chooseImage(ImageSource source) async {
  final pickedFile = await picker.pickImage(source: source);
  setState(() {
    imageFile = File(pickedFile!.path);
  });
}

Container(
    child: imageFile != null ?
    Container(
      height: 200,
      width: 200,
      decoration: BoxDecoration(
        image: DecorationImage(
          image: FileImage(imageFile),
        ),
        borderRadius: BorderRadius.circular(20)),
      padding: const EdgeInsets.all(15.0),
    ) :
    Padding(
      padding: const EdgeInsets.all(15.0),
        child: ClipRRect(
          borderRadius: BorderRadius.circular(20.0),
          child: Image.asset(
            defaultPic,
            height: 250.0,
            width: 300.0,
            fit: BoxFit.cover,
          ),
        ),
    ),
  ),
  ElevatedButton(
    onPressed: () {
      chooseImage(ImageSource.gallery);
    },
    child: Text('Upload Picture'),
    style: ElevatedButton.styleFrom(
      primary: Colors.red,
      elevation: 3,
      shape: new RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(50.0),
      ),
    ),
  )

score 2 · Answer 1 · answered Aug 28 '21 at 01:28

I create a bool variable for making this work:

PickedFile? pickedImage;
late File imageFile;    
bool _load = false;

and the future will be like this:

    Future chooseImage(ImageSource source) async {
          final pickedFile = await picker.pickImage(source: source);
          setState(() {
            imageFile = File(pickedFile!.path);
            _load = false;
          });
        }

And in the container use it:

Container(
    child: _load == true ?
    Container(
      height: 200,
      width: 200,
      decoration: BoxDecoration(
        image: DecorationImage(
          image: FileImage(imageFile),
        ),
        borderRadius: BorderRadius.circular(20)),
      padding: const EdgeInsets.all(15.0),
    ) :
    Padding(
      padding: const EdgeInsets.all(15.0),
        child: ClipRRect(
          borderRadius: BorderRadius.circular(20.0),
          child: Image.asset(
            defaultPic,
            height: 250.0,
            width: 300.0,
            fit: BoxFit.cover,
          ),
        ),
    ),
  ),
  ElevatedButton(
    onPressed: () {
      chooseImage(ImageSource.gallery);
    },
    child: Text('Upload Picture'),
    style: ElevatedButton.styleFrom(
      primary: Colors.red,
      elevation: 3,
      shape: new RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(50.0),
      ),
    ),
  )

hei can u help me with your code ive been using it to my code to get image on gallery it showing nothing error but when i open debug it show a lot of error heres the pict https://imgur.com/a/B6Bm9Si — Imam Rizky GANTENG, Sep 30 '21 at 06:43

score 0 · Answer 2 · answered Jul 16 '21 at 12:47

are you sure imageFile is initialized corectly? I think the problem is that when you set the value of your imageFile you set it null. Check File(pickedFile!.path) i think this is null. 1 last thing never use ! operator better to use ?. Basically you need to check if pickedFile.path != null.

lateinitializationerror field imageFile has not been initialized

2 Answers2