数据来源 聚合数据
项目用到的库 rxdart + dio + bloc
主要技术点:
-
请求完数据的组合显示(由于聚合数据是每一个彩种都是单个请求发);
-
号码的动态添加布局(遍历数据动态添加布局数据,就像Android中动态addview一样);
-
rxdart + dio 的网络请求;
-
rxdart + bloc 的状态管理;
-
Stack + Positoned + Offstage(隐藏显示)Widget的使用
数据的组合: Future.wait([各个彩种的请求接口])
Future<Response> lottery(String lotteryId) {
return _dio.get(Api.LOTTERY_QUERY, queryParameters: {
"lottery_id": lotteryId,
"lottery_no": "",
"key": Api.KEY
});
}
Future queryLotteryList_() {
Future<List<Response>> resp = Future.wait([
lottery(Const.SSQ),
lottery(Const.DLT),
lottery(Const.QLC),
lottery(Const.QXC),
lottery(Const.PLS),
lottery(Const.PLW),
lottery(Const.FCSD),
]);
return resp;
}
号码布局的实现(动态添加):
Container(
padding: EdgeInsets.only(top: 9),
child: Row(
children: info.lotteryRes.split(',').map((number) {
++numberIndex;
return Container(
margin: EdgeInsets.only(right: 4),
child: ClipOval(
child: Container(
width: 30,
height: 30,
color: Utils.getLotteryItemColor(
numberIndex, info.lotteryId),
child: Center(
child: Text(
number,
style: TextStyle(
color: Colors.white, fontSize: 14),
),
),
),
),
);
}).toList(),
),
),