Question

如何在仅在选择图像时触发的image_picker_web应用程序中加入加载微调器？

我能做的最好的事情是通过“选择图像”按钮触发一个微调器，如下所示，但这显示了打开目录时的微调器，即在选择任何内容之前，我需要它在启动目录时触发用户选择一张图片，然后在目录中点击“打开”。

Image pickedImage;
bool isWaiting = false;

  pickImage() async {

setState(() {
  isWaiting = true;
});

Image fromPicker =
    await ImagePickerWeb.getImage(outputType: ImageType.widget);

if (fromPicker != null) {

  setState(() {
    isWaiting = false;
    pickedImage = fromPicker;
  });

}

}

 RaisedButton(
              onPressed: () => pickImage(),
              child: isWaiting
                  ? SizedBox(child: Image.asset('assets/spinner.gif'))
                  : Text('Select Image'),
            ),

（根据原始示例：https://pub.dev/packages/image_picker_web/example）

Answer 1

如果需要，可以使用默认材料CircularProgressIndicator()。
如果您希望它带有Google颜色的点缀更加鲜艳，可以使用我的ColoredCircularProgressIndicator()包装。
如果您想使用自定义微调器，则必须使用这个很棒的软件包-flutter_spinkit

您的实现是正确的，您还可以将GestureDetector与Material小部件一起使用，以自定义输入按钮。

编辑-

如评论中所述，如果希望微调器在图像拾取后启动，可以使用then()中的getImage's future和void回调来实现。

Image fromPicker = await ImagePickerWeb.getImage(outputType: ImageType.widget).then(() => /* do something after image is picked (change widget to spinner in setState) */ );

我真的不知道为什么你要在之后才启动微调器。

此外，image_picker_web软件包现在已被弃用，因此请使用image_picker软件包进行网络检查。

使用image_picker_web（FLUTTER-WEB）加载微调器

1 个答案: