Image_picker throws removeInvalidNode all the node in jank list is out of time instead of returning image

Question

I am trying to choose image with gallery or camera and display with image_picker.

When I run the app in android, I am able to choose image but not displaying. In contrast I am getting following in the console for the first time.

I/HwViewRootImpl(11213): removeInvalidNode all the node in jank list is out of time

If I repeat the same, it gives following in each time while press the button instead of opening gallery or camera.

I/flutter (11213): PlatformException(already_active, Image picker is already active, null)

I found following solutions from my search but not solved my case.

flutter clean , flutter clean
changing the version of the plugin
updating all dependencies
using retrieveLostData method as stated in the plugin documentation

Following is the code I have used for retrieve image:

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

class CameraApp extends StatefulWidget {
  @override
  _CameraAppState createState() => _CameraAppState();
}

class _CameraAppState extends State<CameraApp> {
  File imageFile;

  @override
  void initState() {

    super.initState();
  }

  Future _getImage(int type) async {
    print("Called Image Picker");
    var image = await ImagePicker.pickImage(
      source: type == 1 ? ImageSource.camera : ImageSource.gallery,
    );

    setState(() {
      print("$image.path");
      imageFile = image;
    });
  }

  Future<void> retrieveLostData() async {
    final LostDataResponse response = await ImagePicker.retrieveLostData();
    if (response == null) {
      return;
    }
    if (response.file != null) {
      setState(() {
        if (response.type == RetrieveType.image) {
          imageFile = response.file;
        }
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Image Editor"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            imageFile != null
                ? Image.file(
                    imageFile,
                    height: MediaQuery.of(context).size.height / 2,
                  )
                : Text("Image editor"),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          showDialog(
            context: context,
            builder: (BuildContext context) {
              return AlertDialog(
                title: new Text("Add Slip"),
                content: Row(
                  children: <Widget>[
                    Expanded(
                      child: new FlatButton(
                        child: new Text("Camera"),
                        onPressed: () {
                          _getImage(1);
                          Navigator.pop(context);
                        },
                      ),
                    ),
                    Expanded(
                      child: new FlatButton(
                        child: new Text("Gallery"),
                        onPressed: () {
                          _getImage(2);
                          Navigator.pop(context);
                        },
                      ),
                    )
                  ],
                ),
              );
            },
          );
        },
        tooltip: 'Pick Image',
        child: Icon(Icons.camera),
      ),
    );
  }
}

an you upload the code of where you are displaying your Image ? @Colombo Homes — void, May 13 '20 at 06:28
I have edited the code by adding entire code now can you please check now? @T.T Sage — Colombo Homes, May 13 '20 at 06:35

score 0 · Answer 1 · answered Apr 15 '21 at 21:49

I've tried the sample code that you've shared and for some reason got compiler issues but not the same issue as yours. Therefore, I've tried to debug your code. Here is the fixed code:

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

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  File imageFile;

  @override
  void initState() {
    super.initState();
  }

  Future _getImage(int type) async {
    print("Called Image Picker");
    var image = await await ImagePicker.platform.pickImage(
      source: type == 1 ? ImageSource.camera : ImageSource.gallery,
    );

    setState(() {
      print("$image.path");
      imageFile = File(image.path);
    });
  }

  Future<void> retrieveLostData() async {
    final LostData response = await ImagePicker.platform.retrieveLostData();
    if (response == null) {
      return;
    }
    if (response.file != null) {
      setState(() {
        if (response.type == RetrieveType.image) {
          imageFile = response.file as File;
        }
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Image Editor"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            imageFile != null
                ? Image.file(
                    imageFile,
                    height: MediaQuery.of(context).size.height / 2,
                  )
                : Text("Image editor"),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          showDialog(
            context: context,
            builder: (BuildContext context) {
              return AlertDialog(
                title: new Text("Add Slip"),
                content: Row(
                  children: <Widget>[
                    Expanded(
                      child: new FlatButton(
                        child: new Text("Camera"),
                        onPressed: () {
                          _getImage(1);
                          Navigator.pop(context);
                        },
                      ),
                    ),
                    Expanded(
                      child: new FlatButton(
                        child: new Text("Gallery"),
                        onPressed: () {
                          _getImage(2);
                          Navigator.pop(context);
                        },
                      ),
                    )
                  ],
                ),
              );
            },
          );
        },
        tooltip: 'Pick Image',
        child: Icon(Icons.camera),
      ),
    );
  }
}

Few of the fixes are these lines:

var image = await await ImagePicker.pickImage(
      source: type == 1 ? ImageSource.camera : ImageSource.gallery,
    );

It's having an error in the compiler so I've changed it to this:

var image = await await ImagePicker.platform.pickImage(
      source: type == 1 ? ImageSource.camera : ImageSource.gallery,
    );

Same to these lines:

Future<void> retrieveLostData() async {
    final LostData response = await ImagePicker.retrieveLostData();
    if (response == null) {
      return;
    }
    if (response.file != null) {
      setState(() {
        if (response.type == RetrieveType.image) {
          imageFile = response;
        }
      });
    }
  }

Fixed version:

 Future<void> retrieveLostData() async {
    final LostData response = await ImagePicker.platform.retrieveLostData();
    if (response == null) {
      return;
    }
    if (response.file != null) {
      setState(() {
        if (response.type == RetrieveType.image) {
          imageFile = response.file as File;
        }
      });
    }
  }

and this

setState(() {
      print("$image.path");
      imageFile = image;
    }

to this:

 setState(() {
          print("$image.path");
          imageFile = File(image.path);
        }

The reason could be the version of image_picker that I'm using. Currently I'm using the image_picker: ^0.7.4.

Here is actual output:

I've also encounter an issue if your running this in an Android API version 30, you get this error:

Unhandled Exception: PlatformException(no_available_camera, No cameras available for taking pictures., null, null)

The workaround is to add <uses-permission android:name="android.permission.QUERY_ALL_PACKAGES"/> in manifest as mentioned in this GitHub post.

Image_picker throws removeInvalidNode all the node in jank list is out of time instead of returning image

1 Answers1