Flutter - FutureBuilder 在 Android 上運行良好，但在 iOS 上運行不佳

Question

我用下面的代碼實現了FutureBuilder以獲得與用戶的距離以及他想要購買的物品，但我在 Android 和 iOS 之間得到了一個奇怪的結果。

在Android 上運行良好，我得到了每個項目的距離。 但是在iOS上，我沒有每個項目的距離，實際上有些項目有距離，有些項目得到 null 值。

class ProductHorizontalListItem extends StatelessWidget {
  const ProductHorizontalListItem({
    Key? key,
    required this.product,
    required this.coreTagKey,
    this.onTap,
  }) : super(key: key);

  final Product product;
  final Function? onTap;
  final String coreTagKey;

  @override
  Widget build(BuildContext context) {
    final PsValueHolder valueHolder =
    Provider.of<PsValueHolder>(context, listen: false);

    Future<double> getCurrentLocation() async {
          Position position = await Geolocator.getCurrentPosition();
          double lat = position.latitude;
          double long = position.longitude;
          final double distanceInMeters = Geolocator.distanceBetween(
            double.parse(position.latitude.toString()),
            double.parse(position.longitude.toString()),
            double.parse(product.itemLocation!.lat.toString()),
            double.parse(product.itemLocation!.lng.toString()),
          );

            return Future.value(distanceInMeters);

        }

        return FutureBuilder<double>(
                future: getCurrentLocation(),
            builder: (BuildContext context, AsyncSnapshot<double> snapshot) {
        return InkWell(
        onTap: onTap as void Function()?,
        child: Container(
            margin: const EdgeInsets.only(
                left: PsDimens.space4, right: PsDimens.space4,
                bottom: PsDimens.space12),
            child: Text(
                '${snapshot.data}',
                textAlign: TextAlign.start,
                style: Theme.of(context).textTheme.caption!.copyWith(
                    color: PsColors.textColor3
                )))

        );});
  }
}

我還嘗試以各種方式處理 FutureBuilder 的狀態，但沒有。

iOS 工作不正常，為什么？

我在 Flutter 3.0.5 和 Android Studio Chipmunk 上。

Answer 1

首先，您應該在訪問其數據之前檢查快照 state。 否則你可以得到一個 null 值，因為處理還沒有完成。 在訪問snapshot.data之前檢查snapshot.connectionState和snapshot.hasData 。

然后，無需將緯度和經度轉換為String，然后再轉換回double。

最終，您可以替換final Function? onTap; final Function? onTap; 通過VoidCallback ，以避免在 Inkwell 按鈕中解析它。

試試這個：

@override
Widget build(BuildContext context) {
  Future<double> getCurrentLocation() async {
    Position position = await Geolocator.getCurrentPosition();
    final double distanceInMeters = Geolocator.distanceBetween(
      position.latitude,
      position.longitude,
      product.itemLocation!.latitude,
      product.itemLocation!.longitude,
    );
    return Future.value(distanceInMeters);
  }

  return FutureBuilder<double>(
    future: getCurrentLocation(),
    builder: (BuildContext context, AsyncSnapshot<double> snapshot) {
      if (snapshot.connectionState == ConnectionState.done && snapshot.hasData) {
        return InkWell(
          onTap: onTap,
          child: Container(
            margin: const EdgeInsets.only(
              left: PsDimens.space4,
              right: PsDimens.space4,
              bottom: PsDimens.space12,
            ),
            child: Text(
              '${snapshot.data}',
              textAlign: TextAlign.start,
              style: Theme.of(context).textTheme.caption!.copyWith(
                    color: PsColors.textColor3,
                  ),
            ),
          ),
        );
      } else if (!snapshot.hasData) {
        // Handle error case
        return const Text('error');
      } else {
        // Display a loader or whatever to wait for the Future to complete
        return const Center(child: CircularProgressIndicator());
      }
    },
  );
}

我通過實際城市的位置替換 position 和 product.itemLocation 來嘗試代碼，並且 distanceInMeters 是正確的。