- 新增一个城市选择的页面
- 在城市选择页面,点击城市,跳转到对应城市天气的页面
1. 创建城市选择页面
在Android中新建一个页面,需要用Activity,在iOS中需要用ViewController,但在Flutter中,新建一个页面只需要用Widge就行,所以我们新建一个CityWidget.dart
,CityWidget
是一个ListView,从服务器拉取城市的列表并显示,我们用CityData.dart
来存储城市的数据。代码如下:
- CityData.dart
class CityData{
String cityName;
CityData(this.cityName);
}
- CityWidget.dart
CityWidget是一个StatefulWidget,因为CityWidget里的数据是从服务器上拉的,是变的,所以需要用StatefulWidget来实现,从服务器拉取数据的代码和[Flutter实战1 写一个天气查询的APP])里的WeatherWidget
一样,不同的是:
- CityWidget是一个List,用
ListView.builder
实现,需要填两个参数itemCount
(List数据的个数)和itemBuilder
(List中item的view),在itemBuilder
中有index
的参数,可以直接