核心理念

化繁为简，最终使用时，简单易用，扩展性强即可。

1.页面的加载过程

根据项目实际开发，页面加载过程基本上是确定的，主要为：加载页面、错误页面、成功页面、空页面。

2.自定义加载控件，代码比较简单直接看就好

/// 1.加载状态：加载中 成功 错误 空页面
enum LoadingState { loading, success, error, empty }

/// 2.成功的构建器
typedef ContentBuilder = Widget Function(BuildContext context);

/// 3.自定义加载控件
class LoadingLayout extends StatelessWidget {
  const LoadingLayout(
      {super.key,
      this.state = LoadingState.loading,// 默认加载中
      this.retry,
      required this.contentBuilder});

  final LoadingState state;
  final VoidCallback? retry; // 错误 空页面 点击回调
  final ContentBuilder contentBuilder; // 成功的页面 子类实现

  @override
  Widget build(BuildContext context) {
    if (state == LoadingState.loading) { // 加载状态
      return _loading();
    } else if (state == LoadingState.error) { // 错误状态
      return _emptyOrError("images/loading_ic_error.png", "页面异常，点击重试");
    } else if (state == LoadingState.empty) { // 空状态
      return _emptyOrError("images/loading_ic_empty.png", "暂无数据");
    }
    // 成功状态
    return contentBuilder(context);
  }

  /// 根据项目自己修复即可
  Widget _emptyOrError(String icon, String desc) {
    return GestureDetector(
      onTap: retry,
      child: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Image.asset(
              icon,
              width: 80,
              height: 80,
            ),
            Text(
              desc,
              style: const TextStyle(fontSize: 16),
            ),
            const Text(
              "轻触重试",
              style: TextStyle(fontSize: 14),
            )
          ],
        ),
      ),
    );
  }

  /// 加载中
  Widget _loading() {
    return Center(
      child: CircularProgressIndicator(
        color: Colors.orange.shade100,
      ),
    );
  }
}