Arbeiten mit Imager Picker Dependency in Flutter

Question

Ich habe eine Funktion in meiner Anwendung, die dem Benutzer hilft, ein Bild aus der Galerie auszuwählen oder ein Foto mit der Kamera aufzunehmen.

  _getImage(ImageSource source) async {
    // ignore: deprecated_member_use
    File selectedImage = await ImagePicker.pickImage(
      source: source,
      imageQuality: 50,
      maxWidth: 400.0,
    ).whenComplete(() {
      setState(() {});
    });
    if (_imageFile == null) return;
    
    setState(() {
      _imageFile = selectedImage;
    });
  }

Ich verwende diese image_picker-Abhängigkeit und folge dem darin gefundenen Beispiel sowie Beispielen für mögliche Aktualisierungen, die von anderen online durchgeführt wurden. Aufgrund eines Vorschlags zu dieser Frage zum Stapelüberlauf wird empfohlen, das whenComplete darin hinzuzufügen, was ich auch getan habe.

Wenn ich ein Bild aus meiner Galerie auswähle, wird das Widget für die Bildansicht auf meinem Bildschirm nicht aktualisiert. Die Kameraoption funktioniert auch nicht. Was könnte mir möglicherweise fehlen?

Hier ist mein Bild-Widget, das das Bild anzeigt:

return Stack(
    alignment: AlignmentDirectional.bottomCenter,
    children: <Widget>[
      Image.file(
        _imageFile,
        fit: BoxFit.cover,
        height: 250,
      ),
      Container(
        width: 250.0,
        height: 100.0,
        color: Colors.black54,
        child: Column(
          children: <Widget>[
            Text(
              'Change Image',
              style: TextStyle(
                color: Colors.white,
                fontSize: 22.0,
                fontWeight: FontWeight.w400,
              ),
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                //camera button
                IconButton(
                  icon: Icon(FontAwesomeIcons.camera),
                  onPressed: () => _getImage(ImageSource.camera),
                  color: kThemeStyleButtonFillColour,
                ),
                SizedBox(width: 20.0),
                IconButton(
                  icon: Icon(FontAwesomeIcons.fileImport),
                  onPressed: () => _getImage(ImageSource.gallery),
                  color: kThemeStyleButtonFillColour,
                ),
              ],
            ),
          ],
        ),
      ),
      SizedBox(height: 32.0),
    ],
  );

Answer 1

Sie verwenden die falsche Logik in der ifAnweisung.

Richtiger Weg, dies zu tun,

if(selectedImage != null) { Update image widget here }

Ich denke, der imageFileVariablen wurde anfangs keine Datei zugewiesen, daher ist die Bedingung imageFile == nullimmer erfüllt und das Bild-Widget wird nie aktualisiert.

Answer 2

** Ich werde Ihren Code aktualisieren, versuchen Sie dies **

import 'package:image_picker/image_picker.dart';

class check extends StatefulWidget {
  @override
  _checkState createState() => _checkState();
}

class _checkState extends State<check> {
  File _imageFile;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Stack(
      alignment: AlignmentDirectional.bottomCenter,
      children: <Widget>[
        _imageFile !=null ? Image.file(
          _imageFile ,
          height: 250,
          fit: BoxFit.fill,
        ) : Text('No image selected.'),
        SizedBox(height: 100,),
        Container(
          width: 250.0,
          height: 100.0,
          color: Colors.black54,
          child: Column(
            children: <Widget>[
              Text(
                'Change Image',
                style: TextStyle(
                  color: Colors.white,
                  fontSize: 22.0,
                  fontWeight: FontWeight.w400,
                ),
              ),
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  //camera button
                  IconButton(
                    icon: Icon(Icons.camera),
                    onPressed: () => _getImage(ImageSource.camera),
                  ),
                  SizedBox(width: 20.0),
                  IconButton(
                    icon: Icon(Icons.attach_file),
                    onPressed: () => _getImage(ImageSource.gallery),

                  ),
                ],
              ),
            ],
          ),
        ),
        SizedBox(height: 32.0),
      ],
    )
    );
  }

  _getImage(ImageSource source) async {
    // ignore: deprecated_member_use
    File selectedImage = await ImagePicker.pickImage(
      source: source,
      imageQuality: 50,
      maxWidth: 400.0,
    );

    setState(() {
      _imageFile = selectedImage;
    });
  }
}

Answer 3

In Ihrem Fall,

   setState(() {
      _imageFile = selectedImage;
    });

Wartet nicht auf das ausgewählte Bild

Versuche dies:

   _getImage(ImageSource source) async {
    // ignore: deprecated_member_use
    File selectedImage = await ImagePicker.pickImage(
      source: source,
      imageQuality: 50,
      maxWidth: 400.0,
    );
    setState(() {
         _imageFile = selectedImage;
     });
  }

Answer 4

Ich konnte diesen Code zum Laufen bringen und der Hack schlägt mich immer noch, weil er keinen Sinn ergibt.

Ich folgte der oben gegebenen Empfehlung, indem ich whenComplete abschaffte, da es ein Warten gibt.

Ich habe auch den Deklarationstyp von selectedImage von File in var wie folgt geändert:

  _getImage(ImageSource source) async {
    var selectedImage;
    selectedImage = await ImagePicker.pickImage(
      source: source,
      imageQuality: 50,
      maxWidth: 400.0,
    );

    setState(() {
      _imageFile = selectedImage;
    });
  }

Es macht keinen Sinn, warum var funktioniert hat und File nicht, da wir wissen, dass wir eine Datei als zurückgegebenen Wert erwarten, aber es funktioniert jetzt gut.