文章目录
一、FutureBuilder 简介
二、FutureBuilder 构造方法
三、AsyncSnapshot 异步计算
一、FutureBuilder 简介
FutureBuilder 将 异步操作 与 异步 UI 更新 结合在一起 ; 它可以将 异步操作 的结果 , 异步的 更新到 UI 界面中 ;
异步操作结果 : 网络请求 , 数据库读取 , 等耗时操作 得到的结果 ;
二、FutureBuilder 构造方法
FutureBuilder 构造方法如下 :
/// Creates a widget that builds itself based on the latest snapshot of /// interaction with a [Future]. /// /// The [builder] must not be null. const FutureBuilder({ Key? key, this.future, this.initialData, required this.builder, }) : assert(builder != null), super(key: key); FutureBuilder({Key key, Future<T> future, T initialData, @required AsyncWidgetBuilder<T> builder })
FutureBuilder 构造方法参数解析 :
Future<T> future : 与异步操作相关的异步计算 ;
/// The asynchronous computation to which this builder is currently connected, /// possibly null. /// /// If no future has yet completed, including in the case where [future] is /// null, the data provided to the [builder] will be set to [initialData]. final Future<T>? future;
T initialData : 异步计算完成前的初始化数据 ;
/// The data that will be used to create the snapshots provided until a /// non-null [future] has completed. /// /// If the future completes with an error, the data in the [AsyncSnapshot] /// provided to the [builder] will become null, regardless of [initialData]. /// (The error itself will be available in [AsyncSnapshot.error], and /// [AsyncSnapshot.hasError] will be true.) final T? initialData;
@required AsyncWidgetBuilder<T> builder : AsyncWidgetBuilder 类型的回调函数 , 这是基于异步交互构建 Widget 的函数 ;
/// Signature for strategies that build widgets based on asynchronous /// interaction. /// /// See also: /// /// * [StreamBuilder], which delegates to an [AsyncWidgetBuilder] to build /// itself based on a snapshot from interacting with a [Stream]. /// * [FutureBuilder], which delegates to an [AsyncWidgetBuilder] to build /// itself based on a snapshot from interacting with a [Future]. typedef AsyncWidgetBuilder<T> = Widget Function(BuildContext context, AsyncSnapshot<T> snapshot);
三、AsyncSnapshot 异步计算
AsyncWidgetBuilder<T> 回调函数的实际类型是 Widget Function(BuildContext context, AsyncSnapshot<T> snapshot) , 接收两个参数 BuildContext context 和 AsyncSnapshot<T> snapshot , 返回值是 Widget 组件 ;
AsyncSnapshot<T> snapshot 参数中包含有异步计算的信息 ;
class AsyncSnapshot<T> { /// Creates an [AsyncSnapshot] with the specified [connectionState], /// and optionally either [data] or [error] with an optional [stackTrace] /// (but not both data and error). const AsyncSnapshot._(this.connectionState, this.data, this.error, this.stackTrace) : assert(connectionState != null), assert(!(data != null && error != null)), assert(stackTrace == null || error != null); /// Current state of connection to the asynchronous computation. final ConnectionState connectionState; /// The latest data received by the asynchronous computation. /// /// If this is non-null, [hasData] will be true. /// /// If [error] is not null, this will be null. See [hasError]. /// /// If the asynchronous computation has never returned a value, this may be /// set to an initial data value specified by the relevant widget. See /// [FutureBuilder.initialData] and [StreamBuilder.initialData]. final T? data; /// The latest error object received by the asynchronous computation. /// /// If this is non-null, [hasError] will be true. /// /// If [data] is not null, this will be null. final Object? error; /// Returns whether this snapshot contains a non-null [data] value. /// /// This can be false even when the asynchronous computation has completed /// successfully, if the computation did not return a non-null value. For /// example, a [Future<void>] will complete with the null value even if it /// completes successfully. bool get hasData => data != null; /// Returns whether this snapshot contains a non-null [error] value. /// /// This is always true if the asynchronous computation's last result was /// failure. bool get hasError => error != null; }
AsyncSnapshot<T> snapshot 中的 ConnectionState connectionState 是连接状态 , 是个枚举值 , 有四种取值 :
none
waiting
active
done
/// The state of connection to an asynchronous computation. /// /// The usual flow of state is as follows: /// /// 1. [none], maybe with some initial data. /// 2. [waiting], indicating that the asynchronous operation has begun, /// typically with the data being null. /// 3. [active], with data being non-null, and possible changing over time. /// 4. [done], with data being non-null. /// /// See also: /// /// * [AsyncSnapshot], which augments a connection state with information /// received from the asynchronous computation. enum ConnectionState { /// Not currently connected to any asynchronous computation. /// /// For example, a [FutureBuilder] whose [FutureBuilder.future] is null. none, /// Connected to an asynchronous computation and awaiting interaction. waiting, /// Connected to an active asynchronous computation. /// /// For example, a [Stream] that has returned at least one value, but is not /// yet done. active, /// Connected to a terminated asynchronous computation. done, }
final T? data 是异步计算接收的最新数据 ;
Object? error 是异步计算接收的错误对象 ;
AsyncSnapshot<T> snapshot 中还有 hasData 和 hasError 两个属性 , hasData 用于检查该对象是否包含非空数据值 , hasError 用于检查是否包含错误值 ;
/// Returns whether this snapshot contains a non-null [data] value. /// /// This can be false even when the asynchronous computation has completed /// successfully, if the computation did not return a non-null value. For /// example, a [Future<void>] will complete with the null value even if it /// completes successfully. bool get hasData => data != null; /// Returns whether this snapshot contains a non-null [error] value. /// /// This is always true if the asynchronous computation's last result was /// failure. bool get hasError => error != null;