使用 Future Function 时图像未显示在容器中，但当我使用图像小部件时会显示图像

Question

代码应该在容器中显示图片，但它没有显示任何内容！除了文字之外。我使用 Image.asser() ，它可以工作并在容器中显示图像，但是当我使用 SelectedImage 并使用画廊或相机中的 Future 函数在其中存储图片时，该功能不起作用并且不会在容器中显示任何图片 当我直接提供 SelectedImage 时，即 child: SelectedImage 我收到此错误 参数类型“文件？”无法分配给参数类型“Widget？”

import 'dart:io';

import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:project1_test/theme/Textstyle.dart';
import 'package:project1_test/theme/colors.dart';

class ImageSelectionfunction extends StatefulWidget {
  const ImageSelectionfunction({super.key});

  @override
  State<ImageSelectionfunction> createState() => _ImageSelectionfunctionState();
}

class _ImageSelectionfunctionState extends State<ImageSelectionfunction> {
  @override
  Widget build(BuildContext context) {
    File? SelectedImage;
    Future<void> pickImage() async {
      final picker = ImagePicker();
      final pickedImage = await picker.pickImage(source: ImageSource.gallery);
      if (pickedImage != null) {
        setState(() {
          SelectedImage = File(pickedImage.path);
        });
      }
    }

    return Column(
      children: <Widget>[
        Center(
         //The below container is suppose to display the picture
          child: Container( 
            width: 220,
            height: 190,
            decoration: const BoxDecoration(color: Colors.white, boxShadow: [
              BoxShadow(
                color: Colors.grey,
                offset: Offset(0, 4),
                blurRadius: 5,
                spreadRadius: 5,
              )
            ]),
            child: SelectedImage != null
                ? Image.file(File(SelectedImage!.path))
                : const Text('Your Image here'),
          ),
        ),
        SizedBox(
          height: 35,
        ),

        ////////////////////////////
        //Image Selection Buttons
        //////////////////////////
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
            Container(
              width: 180,
              decoration: BoxDecoration(
                color: purpleColor,
              ),
              child: Row(
                children: [
                  const Padding(
                    padding: EdgeInsets.only(left: 8),
                    child: Icon(
                      FontAwesomeIcons.image,
                      color: Colors.white,
                      size: 17,
                    ),
                  ),
                  TextButton(
                    child: const Text(
                      'Pick From Gallery',
                      style: txtStyle,
                    ),
                    onPressed: () {
                      pickImage();
                    },
                  ),
                ],
              ),
            ),
            Container(
              width: 160,
              decoration: BoxDecoration(
                color: purpleColor,
              ),
              child: Row(
                children: [
                  const Padding(
                    padding: EdgeInsets.only(left: 8),
                    child: Icon(
                      FontAwesomeIcons.camera,
                      color: Colors.white,
                      size: 17,
                    ),
                  ),
                  TextButton(
                    child: const Text(
                      'Take a Picture',
                      style: txtStyle,
                    ),
                    onPressed: () {},
                  ),
                ],
              ),
            ),
          ],
        ),
        ////////////////////////
        //Buttons Area Ends Here
        ////////////////////////

        ///////////////////////
        //Prediction Button
        ///////////////////////
        SizedBox(
          height: 12,
        ),
        Container(
          width: 180,
          height: 60,
          color: purpleColor,
          child: Row(children: [
            Padding(
              padding: const EdgeInsets.only(left: 10),
              child: Icon(
                FontAwesomeIcons.magnifyingGlass,
                color: Colors.white,
                size: 18,
              ),
            ),
            SizedBox(
              width: 12,
            ),
            Text(
              'Start Prediction',
              style: txtStylemain,
            ),
          ]),
        )
        //////////////////////////////
        //Prediction Button Ends Here
        ////////////////////////////
      ],
    );
  }
}

Answer 1

Image.file(File(SelectedImage!.path))

我相信这应该更改为这样，因为您已经将

File

类型分配给

SelectedImage

变量

Image.file(SelectedImage)