接口请求等待动画，请求失败，超时处理

import 'dart:async';
import 'package:demo/common_page/rpx.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';

class HttpFailPage extends StatefulWidget {
    
    
  final Function leadingClick;
  const HttpFailPage({
    
    Key? key, required this.leadingClick}) : super(key: key);

  @override
  State<HttpFailPage> createState() => _HttpFailPageState();
}

class _HttpFailPageState extends State<HttpFailPage> {
    
    
 late Function leadingClick;
 bool isRef = false;
  late Timer t ;
 // and later, before the timer goes off...

  @override
  void initState() {
    
    
    // TODO: implement initState
    super.initState();
    leadingClick = widget.leadingClick;

  }
  @override
  void didChangeDependencies() {
    
    
    // TODO: implement didChangeDependencies
    super.didChangeDependencies();

    // 延时5s执行返回，这里5秒可以设置成dio超时时间
    t = Timer(const Duration(seconds: 5), (){
    
    
      setState(() {
    
    
        isRef = true;
      });

      // print('延时1s执行');
    });
  }

  @override
  void dispose() {
    
    
    // TODO: implement dispose
    super.dispose();
    t.cancel();
  }


  @override
  Widget build(BuildContext context) {
    
    



    return isRef == true?Center(
      child: Container(
        padding: EdgeInsets.all(20.rpx),
        decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(8.rpx),
            border: Border.all(
                color: Colors.white
                    .withOpacity(0.5))
        ),
        child: InkWell(
          onTap: (){
    
    
            leadingClick();
          },
          child: Text("network_request_failed".tr,style: TextStyle(fontWeight: FontWeight.w700,fontSize: 30.rpx,color: Colors.blue),),
        ),
      ),
    ):  Container(
      alignment: Alignment.topCenter,
      width: 80.rpx,
      height: 80.rpx,
      child: CircularProgressIndicator(backgroundColor: Color(0xff7BFB95),color: Color(0xff68CEFA),strokeWidth: 5.rpx,),
    );
  }
}

加了回调参数leadingClick，目的是为了防止接口请求失败，页面过了时间就显示失败回调UI。

数字后面的单位.rpx可以去掉，这是我适配用的单位，或者可以去我的博客引用这种适配