image_picker 仅在热重载后显示图像扑

问题描述

我使用 image_picker 包读取图像并使用相机拍摄。

我还使用 provider 包来管理结果的变化。

该应用是关于销售商品的广告,添加新广告时添加成功。

问题是广告主图片在我进行热重新加载之前不会显示,并且在重新加载之前显示错误

无法加载资源:/storage/emulated/0/Android/data/com.bkh.ads/files/Pictures/d2abeed9-3dfa-44b4-a032-ddefff58762e2465964411313585659.jpg

一旦我进行热重载,广告图片就会正确显示并且错误消失。

这就是我使用 image_picker 的方式:

Future _setAdMainImage() async {
    String _method;

    await showModalBottomSheet(
      context: context,builder: (context) => Container(
        height: 105,child: Column(
          children: [
            Container(
              height: 50,child: RaisedButton(
                color: ColorPalette.PRIMARY_COLOR,onpressed: () {
                  _method = 'Camera';
                  Navigator.of(context).pop();
                },child: Center(
                  child: Text(
                    'Image From Camera',textDirection: TextDirection.rtl,style: TextStyle(
                      fontSize: 18,color: ColorPalette.WHITE_TEXT_ICONS_COLOR,),SizedBox(
              height: 5,Container(
              height: 50,onpressed: () {
                  _method = 'gallery';
                  Navigator.of(context).pop();
                },child: Center(
                  child: Text(
                    'Image From gallery',],);

    if (_method != null) {
      final _pickedFile = await _imagePicker.getimage(
        source: _method == 'Camera' ? ImageSource.camera : ImageSource.gallery,);

      setState(() {
        _image = File(_pickedFile.path);
      });
      _method = null;
    }
  }

这是我使用 provider 添加新广告对象的方式:

void addVehicleAd(VehicleAd vehicleAd) {
    _vehicleAds.add(vehicleAd);
    notifyListeners();
  }

这是我显示结果的方式:

@override
  Widget build(BuildContext context) {
    _data = ModalRoute.of(context).settings.arguments as Map<String,dynamic>;
    _ads = Provider.of<VehicleAds>(context).carads;

    return Scaffold(
      body: ListView.builder(
              itemCount: _ads.length,itemBuilder: (context,index) => AdCard(
                id: _ads[index].id,image: _ads[index].image,price: _ads[index].price,label: _ads[index].label,date: _ads[index].date,);
  }

这是 AdCard 小部件:

class AdCard extends StatelessWidget {
  final int id;
  final String label,image;
  final int price;
  final DateTime date;

  AdCard({
    @required this.id,@required this.label,@required this.price,@required this.image,@required this.date,});

  @override
  Widget build(BuildContext context) {
    var _height = MediaQuery.of(context).size.height;
    return InkWell(
      child: Card(
        clipBehavior: Clip.hardEdge,shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(10),side: BorderSide(
            width: 2,color: ColorPalette.ACCENT_COLOR,child: Stack(
          children: <Widget>[
            Container(
              height: 250,width: double.infinity,child: Hero(
                tag: id,child: Image(
                  image: Assetimage(image),fit: BoxFit.cover,Positioned(
              right: 10,bottom: 10,child: Container(
                padding: EdgeInsets.all(5),decoration: Boxdecoration(
                  borderRadius: BorderRadius.circular(5),color: Colors.black.withOpacity(.5),child: Text(
                  label,textAlign: TextAlign.center,style: TextStyle(
                    height: 1,Positioned(
              left: 10,child: Text(
                  '$price',style: TextStyle(
                    color: ColorPalette.WHITE_TEXT_ICONS_COLOR,Padding(
              padding: const EdgeInsets.only(top: 10),child: Align(
                alignment: Alignment.topCenter,child: Container(
                  padding: EdgeInsets.all(5),decoration: Boxdecoration(
                    borderRadius: BorderRadius.circular(5),child: Text(
                    '${date.day}/${date.month}/${date.year}',style: TextStyle(
                      color: ColorPalette.WHITE_TEXT_ICONS_COLOR,);
  }
}

我不知道错误代码在哪里...

任何帮助将不胜感激

解决方法

AssetImage 小部件从您的资产资源中获取。

对于 imagepicker 拍摄的图像,请使用 Image.file。

Image.file(/* 你的文件 */,fit: BoxFit.cover,)