在颤动中选择一个时如何向前移动选择图像按钮

Question

我不是一次尝试上传多张图片，但是像这样，当用户选择一张图片然后上传图片图片将向前移动，这就是我想说的快照

点击添加按钮会显示图片选择器

然后选择图像后应该是这样的

我在这里选择一张图片。

final ImagePicker picker = ImagePicker();
  File? _image;
  

  Future pickImagefromGallery() async{
    try{
      final image=await ImagePicker().pickImage(source: ImageSource.gallery);
      if(image==null) return;

      // final imageTemp=File(image.path);
      final imagePermanent=await saveImagePermantly(image.path);
      setState(() {
        this._image=imagePermanent;
      });
    } on PlatformException catch(e){
      print("Failed to pick an image" + e.toString());
    }
  }

@override
  Widget build(BuildContext context) {
    return Align(
        alignment: Alignment.topLeft,
        child: _image!=null?Image.file(_image!,
        width: MediaQuery.of(context).size.width * 0.3,
        height: MediaQuery.of(context).size.height * 0.13,
        fit: BoxFit.cover,
         ):
        Align(
          alignment: Alignment.topLeft,
          child: customImageButton(
          context,
          "+",
          (){pickImagefromGallery()})
):}}

输出：

Answer 1

您可以将所有小部件放入 List 中，并以 Wrap 作为父级。

https://api.flutter.dev/flutter/widgets/Wrap-class.html

List<Widgets> listWidgets = [];

...

//then you can add any widget to list
//first you need to add your button to list
listWidgets.add(Align(
      alignment: Alignment.topLeft,
      child: customImageButton(
      context,
      "+",
      (){pickImagefromGallery()}));

listWidgets.add(Image.file(...)); // this add widget to last position
listWidgets.insert(0, Image.file(...)); // this add to first position like you want
// when you add a widget into list need to do a setState()

// and use Wrap with a list

Wrap(
   children: listWidgets,
)