如何根据天气情况显示图标。我完成了大部分代码，在结尾部分需要帮助

Question

我正在编写一个应用程序，它应该能够根据天气状况在主屏幕上显示一个图标。我正在使用 weather package, geolocator 包和 OpenWeatherMap API。我能够获得用户的纬度和经度，我也能够获得他所在位置的天气状况，但我目前被困住了，因为我找不到根据天气状况更改图标的正确方法。

这就是我的想法。询问天气情况时的天气包 returns 一个像“clear sky”这样的字符串。现在，因为我想显示 Material 图标中的图标。我正在使用 IconData 构造函数。

Icon(IconData(FUNCTION-RETURNING-INT-NUMBER, fontFamily: 'MaterialIcons',)),

其中 FUNCTION-RETURNING-INT-CODE 是一个函数，returns 一个 int 数字，例如晴天时为“59097”。您可以轻松检查 59097 是 wb_sunny 图标 here

我的想法是编写一个函数，根据天气情况，returns 一个与适当图标对应的 int 数字。这应该可以通过开关盒轻松实现。

不幸的是，我是 OOP 和异步函数的新手，所以我不知道该怎么做。这是打印天气状况的代码。

void checkMeteo() async {
  WeatherFactory wf = new WeatherFactory(
      "API KEY",
      language: Language.ENGLISH);
  late Position position;
  position = await determinePosition();
  Weather weatherWidget = await wf.currentWeatherByLocation(
      position.latitude, position.longitude);
  String weatherDescription = weatherWidget.weatherDescription!;
  print("Weather Description: $weatherDescription");
}

我确信用这样的开关盒替换最后一个打印就足够了：

switch (weatherDescription) {
  case 'clear sky':
    return 59097;
    break;
  case 'rain':
    // return rain icon;
    // break;
  default:
  // blabla
}

事实是，如前所述，如果我将函数的类型更改为 int，我不能，因为 flutter 希望异步函数成为 returns 一个 Future。但即使将 Future<int> 作为类型，IconData 构造函数也不接受它，因为它是 Future<Int> 并且它只接受 int.

有人可以帮我吗？

Answer 1

您必须将 checkMeteo 方法声明为 Future，因为它必须等待请求。

   Future<int> checkMeteo() async {
      WeatherFactory wf = new WeatherFactory("API KEY",language: Language.ENGLISH);
      late Position position;
      position = await determinePosition();
      Weather weatherWidget = await wf.currentWeatherByLocation(position.latitude,position.longitude);
      String weatherDescription = weatherWidget.weatherDescription!;
      switch (weatherDescription) {
        case 'clear sky':
           return 59097;
           break;
        case 'rain':
           // return rain icon;
           // break;
        default:
        // blabla
      }
    }

然后等待这个函数，然后把它交给IconData:

final int weatherNumber = await checkMeteo();
Icon(IconData(weatherNumber, fontFamily: 'MaterialIcons',)),

编辑1：在StatefulWidget中使用

int? weatherNumber = null;

       Future<void> checkMeteo() async {
          WeatherFactory wf = new WeatherFactory("API KEY",language: Language.ENGLISH);
          late Position position;
          position = await determinePosition();
          Weather weatherWidget = await wf.currentWeatherByLocation(position.latitude,position.longitude);
          String weatherDescription = weatherWidget.weatherDescription!;
          switch (weatherDescription) {
            case 'clear sky':
               weatherNumber = 59097;
               break;
            case 'rain':
               weatherNumber = 59098;
               // break;
            default:
            /
           }
           if(mounted) setState(() {})
       }

initState(){
   super.initState();
   checkMeteo();
}

在小部件中：

weatherNumber == null 
                      ? CircularProgressIndicator()
                      : Icon(IconData(weatherNumber, fontFamily: 'MaterialIcons',)),

如何根据天气情况显示图标。我完成了大部分代码，在结尾部分需要帮助

How to show an Icon based on Weather Conditions. I did most of the code, need help in the concluding part

icons

weather

dart

flutter

openweathermap