10

I am writing my first Flutter app. The app allows the user to take multiple images (from 1 to 50+), and displays each image on the screen all at once using the ListView.

The issue I am having is, the app crashes after roughly 10/12 pictures on the Samsung SM A520F, am guessing this is due to the fact that this is not a very powerful device.

Is there a way I can display the thumbnail of the image instead of loading the full size image?

Error message: I don't actually get any error messages, the app just seems to restart!

Here is my code

import 'package:flutter/material.dart';
import 'package:myapp/utilities/app_constants.dart';
import 'package:image_picker/image_picker.dart';
import 'dart:io';
import 'package:gallery_saver/gallery_saver.dart';

class FormCameraField extends StatefulWidget {
  final InputDecoration decorations;
  final Map field;
  // functions
  final Function onSaved;
  final Function onFieldSubmitted;

  FormCameraField({
    this.decorations,
    @required this.field,
    @required this.onSaved,
    @required this.onFieldSubmitted,
  });

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

class _FormCameraFieldState extends State<FormCameraField> {
  List<File> images = [];

  Future<void> _takePhoto(ImageSource source) async {
    ImagePicker.pickImage(source: source, imageQuality: 90).then(
      (File recordedImage) async {
        if (recordedImage != null && recordedImage.path != null) {
          try {
            // store image to device gallery
            if (widget.field["StoreCaptureToDevice"] == true) {
              GallerySaver.saveImage(recordedImage.path,
                  albumName: kAppName.replaceAll(" ", "_"));
            }

            setState(() {
              images.add(recordedImage);
            });
          } catch (e) {
            print("ERROR SAVING THE FILE TO GALLERY");
            print(e);
          }
        }
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Row(
          children: <Widget>[
            Expanded(
              child: MaterialButton(
                child: Text("Take Photo"),
                onPressed: () async {
                  await _takePhoto(ImageSource.camera);
                },
              ),
            ),
            Expanded(
              child: MaterialButton(
                child: Text("Select Photo"),
                onPressed: () async {
                  await _takePhoto(ImageSource.gallery);
                },
              ),
            ),
          ],
        ),
        ListView.builder(
          shrinkWrap: true,
          physics: ClampingScrollPhysics(),
          itemCount: images.length,
          itemBuilder: (BuildContext context, index) {
            return Container(
              child: Image.file(
                images[index],
              ),
            );
          },
        )
      ],
    );
  }
}


4
  • Did you find any solution ? I am facing the same problem when I open images that are of around 5 MB and reduce their quality to 25% Commented Dec 9, 2019 at 16:31
  • 1
    Hi @SarthakSinghal I found a temp solution - I basically create a thumbnail of the image and then display the thumbnail instead of the full image. Commented Dec 10, 2019 at 9:52
  • Thanks. That's what I did xd Commented Dec 10, 2019 at 12:43
  • i am seeing this question now in 2022.. did you find solution please? Commented Jul 2, 2022 at 17:36

4 Answers 4

3

I faced the same problem.

This is because some images cause the crash of Flutter engine. The final issue is here https://github.com/flutter/flutter/issues/73767

The example image that always causes crash on ios is here https://github.com/flutter/flutter/issues/73932

So, waiting for the Flutter team fixes the bug.

Sign up to request clarification or add additional context in comments.

2 Comments

Still facing this
What Flutter version do you use?
2

Having a similiar problem. Replacing my images with smaller (~50kb) ones seems to be working fine so i think you are right, loading all those images on less powerfull devices seems to be the problem. There is an image package on pub.dev that should do the trick. I am using Firebase so i will lean more towards their new resize image extension. Goodluck and let us know if it works

Comments

1

I have the same problem. It's actually a bug in flutter. They are currently working to fix the bug in the next stable releases.

3 Comments

Hmm, which source?
I am facing this issue right now after 1.5 year any update?
well now it's 2022 ,, still the issue on
0

I created thumbnails, this worked for me.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.