Flutter：显示设备库中的图像列表

Question

我有照片的 ListView，我试图从图库中获取照片并将它们显示在屏幕上，但问题是当我按下添加新照片时，整张照片都会更改为新照片。

我想单独更改每张照片而不更改其他照片。

File _image;
final picker = ImagePicker();

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

  setState(() {
    _image = File(image.path);
    print((image.path));
  });
}

 child: ListView.builder(
    scrollDirection: Axis.horizontal,
    itemCount: 1,
      itemBuilder: (BuildContext context, int index){
      return Row(
        children: <Widget>[
          GestureDetector(
            onTap: (){
              getImage();

            },
            child: Padding(
              padding: EdgeInsets.only(left:5.0, right:5,top: 10),
              child: Container(
                height: 100.0,
                width: 100.0,
                decoration: BoxDecoration(
                  border: Border.all(),
                  image: DecorationImage(
                    image: _image == null ? AssetImage(
                        'assets/images/add_pic.jpg') : FileImage(_image),
                    fit: BoxFit.fill,
                  ),
                  shape: BoxShape.rectangle,
                ),
              ),
            ),
          ),

Answer 1

从这段代码开始：

List<File> _images = [];
final picker = ImagePicker();

Future getImage(int index) async {
  final image = await picker.getImage(source: ImageSource.gallery);

  setState(() {
    _images[index] = File(image.path);
    print((image.path));
  });
}

 child: ListView.builder(
    scrollDirection: Axis.horizontal,
    itemCount: _images.length + 1,
      itemBuilder: (BuildContext context, int index){
      if(index == _images.length){
        return GestureDetector(
            onTap: (){
              getImage(index);
            },
            child: Padding(
              padding: EdgeInsets.only(left:5.0, right:5,top: 10),
              child: Container(
                height: 100.0,
                width: 100.0,
                decoration: BoxDecoration(
                  border: Border.all(),
                  image: DecorationImage(
                    image: AssetImage('assets/images/add_pic.jpg'),
                    fit: BoxFit.fill,
                  ),
                  shape: BoxShape.rectangle,
                ),
              ),
            ),
         );
      }
      return Row(
        children: <Widget>[
          GestureDetector(
            onTap: (){
              getImage();
            },
            child: Padding(
              padding: EdgeInsets.only(left:5.0, right:5,top: 10),
              child: Container(
                height: 100.0,
                width: 100.0,
                decoration: BoxDecoration(
                  border: Border.all(),
                  image: DecorationImage(
                    image: FileImage(_image[index]),
                    fit: BoxFit.fill,
                  ),
                  shape: BoxShape.rectangle,
                ),
              ),
            ),
          ),