Flutter Image_Picker doesn't pick image from gallery and return to app

Question

Here is a what's happening : I'm trying to upload an image from gallery to my app on iOS simulator. Image Picker opens the gallery but can't select an image and return to app. Here's my simple code:

  File _image;
  final picker = ImagePicker();

  Future getImage() async {
    final pickedFile = await picker.getImage(source: ImageSource.gallery);

    setState(() {
      if (pickedFile != null) {
        _image = File(pickedFile.path);
      } else {
        print('No image selected.');
      }
    });
  }

and my widget:

body: Center(
        child: _image != null ? Image.file(_image) : Text('no Image'),
),

Thank you all in advance

Can you include the error that came up when picking image? – Bach Mar 10 '21 at 07:29 — Bach, Mar 10 '21 at 07:29
is it fixed? I have same issue. – Ilyas Arafath Jun 28 '22 at 05:54 — Ilyas Arafath, Jun 28 '22 at 05:54

score 2 · Answer 1 · edited Mar 13 '21 at 12:09

2

 File _image;
 String _image1 = "";

 Future getImage() async {

    final pickedFile = await picker.getImage(source: ImageSource.gallery);
    setState(() {
      if (pickedFile != null) {
        _image1 = pickedFile.path;
        _image = File(pickedFile.path);
        print(json.encode(_image1));
        print("file path...");
      } else {
        print('No image selected.');
      }
    });
  }

edited Mar 13 '21 at 12:09

钟智强

459
6
17

answered Mar 10 '21 at 04:10

Meetkumar Shah

82
4

I don't think the use of another variable will affect the code – Bach Mar 10 '21 at 07:45
did you have given permission for accessing gallery or photos for android and ios. – Meetkumar Shah Mar 10 '21 at 09:01

score 2 · Answer 2 · answered Mar 10 '21 at 07:39

For the iOS, as stated in the documentation, you'll need some config in the native side relating to permission:

Add the following keys to your Info.plist file, located in /ios/Runner/Info.plist:

NSPhotoLibraryUsageDescription - describe why your app needs permission for the photo library. This is called Privacy - Photo Library Usage Description in the visual editor.

NSCameraUsageDescription - describe why your app needs access to the camera. This is called Privacy - Camera Usage Description in the visual editor.

NSMicrophoneUsageDescription - describe why your app needs access to the microphone, if you intend to record videos. This is called Privacy - Microphone Usage Description in the visual editor.

Other than that, it should work perfectly fine with your code. The image should be fit within a Flexible like this, or maybe a SizedBox to avoid overflowing:

import 'dart:io';

import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';

void main() {
  runApp(MaterialApp(
    home: SampleScreen(),
  ));
}

class SampleScreen extends StatefulWidget {
  @override
  _SampleScreenState createState() => _SampleScreenState();
}

class _SampleScreenState extends State<SampleScreen> {
  File _image;
  final picker = ImagePicker();

  Future getImage() async {
    final pickedFile = await picker.getImage(source: ImageSource.gallery);

    setState(() {
      if (pickedFile != null) {
        _image = File(pickedFile.path);
      } else {
        print('No image selected.');
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            FlatButton(onPressed: () => getImage(), child: Text('Press me')),
            Flexible(child: _image != null ? Image.file(_image) : Text('no Image')),
          ],
        ),
      ),
    );
  }
}

Thanks for the reply, I did include the permissions in info.plist, and I followed the documentation step by stpe, the thing is I don't even get an error. When the gallery opens to pick an image it stays there, I can't select any image and the only option to go back to the app is to cancel the request. I will attach a GIF file — , Mar 10 '21 at 09:25
@JonVadar have you try running with the simplified code I included above? Another way to test is to create a new Flutter app, do the config, paste the code and run again to see what happens — Bach, Mar 10 '21 at 10:26
I just did what you said, created a new app used your code and same problem. The gallery opens but does not pick any photo. — , Mar 10 '21 at 10:42
I give up on this package. @Bach Do you know any other similar package or even a way to implement this without any package?? Thank you — , Mar 10 '21 at 10:50
Okay @Bach , so apparently this issue is with M1 Macs which I'm using one. here's the link to a thread I found [Link](https://github.com/flutter/flutter/issues/71943) Thank you for your instructions — , Mar 10 '21 at 11:04
Hmmm yeah gotta wait for the bug fix tho... The real device should work so it'd be best to find one for development. There's a list here that you could try: https://pub.dev/packages?q=image+pick (maybe using pick file instead?) — Bach, Mar 11 '21 at 01:31

score 0 · Answer 3 · answered Sep 07 '21 at 21:16

0

In my case, I update my Image picker library from 0.6.3 to 0.8.4 hope this helps anyone.

answered Sep 07 '21 at 21:16

Zeeshan Akhtar

441
1
4
9

score 0 · Answer 4 · answered Dec 10 '21 at 20:53

You need to add the user permissions(key) and add the purpose(values) of these in info.plist file in iOS module.

Add the following keys to your Info.plist file, located in /ios/Runner/Info.plist:

NSPhotoLibraryUsageDescription - describe why your app needs permission for the photo library. This is called Privacy - Photo Library Usage Description in the visual editor.

NSCameraUsageDescription - describe why your app needs access to the camera. This is called Privacy - Camera Usage Description in the visual editor.

dependencies: image_picker: ^0.8.4+4

import 'package:image_picker/image_picker.dart';

  final picker = ImagePicker();

Future pickImage() async {
setState(() {
  picselected1 = false;
});
ImagePicker picker = ImagePicker();
PickedFile pickedFile;
pickedFile = await picker.getImage(
  source: ImageSource.gallery,
);

setState(() {
  if (pickedFile != null) {
    picselected1 = true;
    // _images.add(File(pickedFile.path));
    _image = File(pickedFile.path); // Use if you only need a single picture
  } else {
    print('No image selected.');
  }
});
}

score 0 · Answer 5 · answered Dec 12 '22 at 20:32

For everyone still dealing with this problem

Please not this in the image_picker documentary and make sure you tested it on a real device:

Starting with version 0.8.1 the iOS implementation uses PHPicker to pick (multiple) images on iOS 14 or higher. As a result of implementing PHPicker it becomes impossible to pick HEIC images on the iOS simulator in iOS 14+. This is a known issue. Please test this on a real device, or test with non-HEIC images until Apple solves this issue

Flutter Image_Picker doesn't pick image from gallery and return to app

5 Answers5