Flutter Future 异步处理，类似登录、上传文件带进度条效果显示处理方法

最新推荐文章于 2024-09-09 16:36:55 发布

原创

最新推荐文章于 2024-09-09 16:36:55 发布 · 置顶 · 3k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#flutter #Flutter 登录进度条 #Flutter 上传文件进度条 #future 异步处理机制

本文介绍如何在Flutter应用中实现带有进度条的对话框，用于登录或文件上传等操作时展示加载状态，并通过示例代码展示了如何使用Future进行异步处理及错误捕获。

在Flutter 登录、上传文件等类似业务中，可以有带进度条的效果显示，下图中，首先通过 _showDialog()显示带进度条的对话框，在异步完成后，通过Navigator.of(context).pop()退出进度条，跳转到其他的页面或对结果进一步处理。

import 'package:flutter/material.dart';

void main() {
  runApp(Demo());
}

class Demo extends StatelessWidget {
  //const Demo({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(body: MyApp()),
    );
  }
}

class MyApp extends StatefulWidget {
  //const MyApp({Key key}) : super(key: key);

  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Container(
        width:100,
        height:100,
        color:Colors.red,
        child: TextButton(
          onPressed: () {
            _showDialog("abc");
            _getUserInfo()
                .then((value) => {