Question

我要选择一张图像，然后显示选择的图像。所以我尝试这样做->

class ImageUploadChoice extends StatefulWidget {
 @override
 _ImageUploadChoiceState createState() => _ImageUploadChoiceState();
 }

class _ImageUploadChoiceState extends State<ImageUploadChoice> {

 File imageFile;

   Future getImage(int type) async {
    PickedFile pickedImage = await ImagePicker().getImage(
       source: type == 1 ? ImageSource.camera : ImageSource.gallery,
        imageQuality: 50
      );  
     return pickedImage;

        }

用于显示图像

      Expanded(
        child: Container(
          child: imageFile != null
              ? Image.file(
            imageFile,
            height: MediaQuery.of(context).size.height / 5,
          )
              : Text("Pick up the  image"),
          ),
         ),

用于调用功能->

         new ListTile(
          leading: new Icon(
              Icons.photo_library,
            color: Colors.black,),
          title: new Text(
            'Photo Library',
              style: getTextStyle(MediaQuery.of(context).size.height, "heading2"),
          ),
          onTap: () async {
            final tmpFile = await getImage(2);

            setState(() {
             imageFile = tmpFile;
                });
            Navigator.pop(context);
            Navigator.of(context).pop();
          }),

但是它不起作用。所选图像未显示。我还需要做什么？

Answer 1

制作一个示例代码，它可以正常工作。删除以下行

Navigator.pop(context);
Navigator.of(context).pop();

import 'dart:io';

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(
      home: Test(),
    );
  }
}

class Test extends StatefulWidget {
  @override
  _Test createState() => _Test();
}

class _Test extends State<Test> {

  File imageFile;

  Future getImage() async {
    final pickedFile = await ImagePicker().getImage(source: ImageSource.gallery);
    setState(() {
      if (pickedFile != null) {
        imageFile = File(pickedFile.path);
      } else {
        print('No image selected.');
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      floatingActionButton: InkWell(
        onTap: (){
          getImage();
        },
        child: Icon(
          Icons.add
        ),
      ),
      body: Center(
        child: root(),
      ),
    );
  }

  Widget root() {
    return Container(
      child: imageFile != null
          ? Image.file(
        imageFile,
        height: MediaQuery
            .of(context)
            .size
            .height / 5,
      )
          : Text("Pick up the  image"),
    );
  }

}

如何在Flutter中显示拾取的图像

1 个答案: