Question

我想为执行API创建通用类。现在，我需要在执行任务时添加进度对话框，而在完成任务对话框之后，应该将其关闭。我在Google上搜索很多，但没有找到合适的解决方案，所以请帮助我实现它。

对于Http Client，我使用了dio插件。

请帮助我在此类中添加进度对话框，因此当我使用此类创建请求时，它将在执行任务时添加进度对话框。我在Java中创建了此类，但现在我想在flutter中添加它。

HttpRequest.dart

import 'package:dio/dio.dart';
import 'package:flutter/material.dart';

class HttpRequest {
    void post(BuildContext context,String url, dynamic data, HttpListener listener) {
        Dio dio = new Dio();
        dio.post(url, data: data)
           .then((Response<dynamic> response) {
                  if (response.statusCode == 200) {
                      listener.onSuccess(response.data);
                  } else {
                      listener.onError("Error");
                  }
              })
           .catchError((Exception error) {
              listener.onError(error.toString());
            });
    }
}

abstract class HttpListener {
  void onSuccess(dynamic result);

  void onError(String error);
}

Answer 1

最好在小部件中而不是在普通类中显示进度条。

使用以下示例（使用http package）：

class HttpRequest {
  final JsonDecoder _decoder = new JsonDecoder();

  Future post(String url, dynamic data) async {
    http.Response response = await http.post(url,body: data);
    if(response.statusCode < 200 || response.statusCode > 300){
      throw new Exception('Faild');
    } else {
      return _decoder.convert(response.body);
    }
  }
}

调用post方法的按钮：

child: MaterialButton(onPressed: () async {
            Navigator.of(context).push(MaterialPageRoute(builder: (context) {
            return Scaffold(
                body: Center(
                  child: CircularProgressIndicator(),
                ),
              );
            }));
            HttpRequest _util = new HttpRequest();
            try{
              var res = await _util.post('someurl',_data);
            } catch(Exception) {
                //Handle Exception
            } finally {
              Navigator.pop(context);
            }
});

Answer 2

我制作了一个公共程序包future_progress_dialog，它与程序包的概念相反。您想在任务中放置进度对话框。但是我尝试了相反的方法，将“未来”任务放入对话框中。

https://pub.dev/packages/future_progress_dialog

使用此软件包，您可以像这样进行进度对话框。

var result = await showDialog(
    context: context,
    child: FutureProgressDialog(future, 'Loading...'));

我希望这会有所帮助。

在Flutter中使用Future在异步任务中使用进度栏对话框

2 个答案: