时间戳

首页 > 解决方案 > 对同一视图中的两个图像使用 ImagePicker

flutter - 对同一视图中的两个图像使用 ImagePicker

问题描述

我不明白为什么在同一个视图中包含两个图像选择器小部件会导致我的应用程序崩溃。我可以选择一张图片，但在尝试选择第二张图片时，应用程序崩溃且没有任何错误消息。

所以我在提交表单时基本上需要添加两张图片。一张用于徽标，另一张用于背景图像。

图像选择器插件：

import 'package:image_picker/image_picker.dart';

我将它们定义如下：

File _venueLogo;
File _venueImage;

final _pickers = [ImagePicker(), ImagePicker()];

以及设置两个图像的方法

_setVenueImage(img) {
  setState(() {
    _venueImage = img;
  });
}

_setVenueLogo(img) {
  setState(() {
    _venueLogo = img;
  });
}

然后在正文中，我使用两个 ListTiles，一个用于场地图像，一个用于徽标图像。我这里只发一张。

ListTile(
      subtitle: Container(
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(8.0),
          border: Border.all(
            color: Colors.grey,
          ),
        ),
        padding: EdgeInsets.all(20.0),
        child: ImagePickerWidget(
          setImage: _setVenueImage,
          picker: _pickers[0],
        ),
      ),
      title: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Text("Pick image"),
      ),
    ),

这是中的图像选择器方法ImagePickerWidget

Future _getImage() async {
  final pickedFile =
      await widget.picker.getImage(source: ImageSource.gallery);

  if (pickedFile != null) {
    widget.setImage(File(pickedFile.path));
  } else {
    print('No image selected.');
  }
}

标签： flutterdart

解决方案

而不是使用image_pickerusemulti_image_picker来选择多个文件。

在你pubspec.yaml之后dependencies:添加这个：

  multi_image_picker: ^4.8.0

推荐阅读