flutter 购物车功能

1. import ‘package:flutter/cupertino.dart‘;
2.  
   import ‘package:flutter/material.dart‘;
3.  
   import ‘package:flutter_app/http/Api.dart‘;
4.  
   import ‘package:flutter_app/http/ApiService.dart‘;
5.  
   import ‘package:flutter_app/ui/main/bean/ShopCartBean.dart‘;
6.  
    
7.  
   import ‘package:flutter_slidable/flutter_slidable.dart‘;//侧滑删除
8.  
    
9.  
    
10.  
    class ShopPage extends StatefulWidget {
11.  
    @override
12.  
    State<StatefulWidget> createState() => new ShopPageState();
13.  
    }
14.  
     
15.  
    class ShopPageState extends State<ShopPage> {
16.  
    List<ShopCartResult> _list = new List();
17.  
    var money = 0.00;
18.  
    var selectCount = 0;
19.  
    var listItemCount = 0;
20.  
     
21.  
    @override
22.  
    void initState() {
23.  
    // TODO: implement initState
24.  
    super.initState();
25.  
    _categoryChild();
26.  
    }
27.  
     
28.  
    bool isSelect = false;
29.  
     
30.  
    void _categoryChild() {
31.  
    ApiService.getLogin("toBuy/list", "POST", null, (callBack) {
32.  
    if (callBack != null) {
33.  
    var categoryChildBean = ShopCartBean.fromJson(callBack);
34.  
    if (categoryChildBean.success) {
35.  
    _list.clear();
36.  
    _list = categoryChildBean.result;
37.  
    isSelect = _viewSelect();
38.  
    _listMoneyCount();
39.  
    }
40.  
    }
41.  
    }, (errorCallBack) => {});
42.  
    }
43.  
     
44.  
    _viewSelect() {
45.  
    var count = 0;
46.  
    for (var i = 0; i < _list.length; i++) {
47.  
    if (_list[i].selected) {
48.  
    count++;
49.  
    }
50.  
    }
51.  
    return count == _list.length;
52.  
    }
53.  
     
54.  
    @override
55.  
    Widget build(BuildContext context) {
56.  
    // TODO: implement build
57.  
    return new Scaffold(
58.  
    appBar: new AppBar(
59.  
    automaticallyImplyLeading: false, //左边按钮
60.  
    centerTitle: true,
61.  
    title: new Text(
62.  
    "购物车($listItemCount)",
63.  
    style: new TextStyle(color: Colors.white, fontSize: 20.0),
64.  
    ),
65.  
    backgroundColor: Colors.red,
66.  
    ),
67.  
    body: new Column(
68.  
    children: <Widget>[
69.  
    new Expanded(
70.  
    child: Container(
71.  
    child: new ListView(
72.  
    children: _itemView(),
73.  
    padding: new EdgeInsets.only(bottom: 10),
74.  
    ),
75.  
    width: double.infinity,
76.  
    color: Colors.grey,
77.  
    )),
78.  
    Row(
79.  
    children: <Widget>[
80.  
    new Checkbox(
81.  
    value: isSelect,
82.  
    activeColor: Color.fromARGB(255, 255, 67, 78),
83.  
    onChanged: (bool) {
84.  
    for (var i = 0; i < _list.length; i++) {
85.  
    _list[i].selected = !isSelect;
86.  
    for (var j = 0; j < _list[i].goodsToBuyDtos.length; j++) {
87.  
    _list[i].goodsToBuyDtos[j].selected = !isSelect;
88.  
    }
89.  
    }
90.  
    isSelect = !isSelect;
91.  
    _listMoneyCount();
92.  
    setState(() {});
93.  
    }),
94.  
    Text("全选"),
95.  
    Expanded(
96.  
    child: Row(
97.  
    mainAxisAlignment: MainAxisAlignment.end,
98.  
    children: <Widget>[
99.  
    Text(
100.  
     "不含运费 ",
101.  
     style: TextStyle(color: Colors.grey, fontSize: 10),
102.  
     ),
103.  
     Text(
104.  
     "合计:",
105.  
     style: TextStyle(color: Colors.black, fontSize: 12),
106.  
     ),
107.  
     Text(
108.  
     "￥",
109.  
     style: TextStyle(color: Colors.red, fontSize: 12),
110.  
     ),
111.  
     Text(
112.  
     "$money",
113.  
     style: TextStyle(
114.  
     color: Colors.red,
115.  
     fontSize: 16,
116.  
     ),
117.  
     ),
118.  
     Container(
119.  
     alignment: Alignment.center,
120.  
     child: new Text(
121.  
     "结算($selectCount)",
122.  
     style: TextStyle(color: Colors.white),
123.  
     ),
124.  
     width: 130,
125.  
     height: 50,
126.  
     color: Colors.red,
127.  
     )
128.  
     ],
129.  
     ),
130.  
     )
131.  
     ],
132.  
     )
133.  
     ],
134.  
     ),
135.  
     );
136.  
     }
137.  
      
138.  
     List<Widget> _itemView() {
139.  
     List<Widget> listWidget = List();
140.  
     for (var i = 0; i < _list.length; i++) {
141.  
     var item = _list[i].selected;
142.  
     listWidget.add(new Card(
143.  
     color: Colors.white,
144.  
     elevation: 0,
145.  
     margin: new EdgeInsets.only(left: 10, right: 10, top: 10),
146.  
     child: Column(
147.  
     children: _itemViewChild(i, item),
148.  
     ),
149.  
     ));
150.  
     }
151.  
     return listWidget;
152.  
     }
153.  
      
154.  
     List<Widget> _itemViewChild(int index, bool item) {
155.  
     var row = new Row(
156.  
     children: <Widget>[
157.  
     new Checkbox(
158.  
     value: item,
159.  
     activeColor: Color.fromARGB(255, 255, 67, 78),
160.  
     onChanged: (bool) {
161.  
     _list[index].selected = !item;
162.  
     for (var j = 0; j < _list[index].goodsToBuyDtos.length; j++) {
163.  
     _list[index].goodsToBuyDtos[j].selected = !item;
164.  
     }
165.  
     isSelect = _viewSelect();
166.  
     _listMoneyCount();
167.  
     setState(() {});
168.  
     }),
169.  
     Text(null != _list[index].storeName ? _list[index].storeName : "")
170.  
     ],
171.  
     );
172.  
     List<Widget> listWidget = List();
173.  
     listWidget.clear();
174.  
     listWidget.add(row);
175.  
     listWidget.add(new Baseline(
176.  
     baseline: 1,
177.  
     baselineType: TextBaseline.alphabetic,
178.  
     child: new Container(
179.  
     color: Color(0xFFededed),
180.  
     height: 1,
181.  
     width: double.infinity,
182.  
     ),
183.  
     ));
184.  
      
185.  
     List<Widget> listWidgetChild = List();
186.  
     listWidgetChild.clear();
187.  
     for (var b = 0; b < _list[index].goodsToBuyDtos.length; b++) {
188.  
     var selected = _list[index].goodsToBuyDtos[b].selected;
189.  
     listWidgetChild.add(new Padding(
190.  
     padding: EdgeInsets.only(top: 10, bottom: 10),
191.  
     child: new Slidable(
192.  
     child: new Container(
193.  
     child: new Row(
194.  
     children: <Widget>[
195.  
     new Checkbox(
196.  
     value: selected,
197.  
     activeColor: Color.fromARGB(255, 255, 67, 78),
198.  
     onChanged: (bool) {
199.  
     _list[index].goodsToBuyDtos[b].selected = !selected;
200.  
     var count = 0;
201.  
     _list[index].goodsToBuyDtos.forEach((fe) {
202.  
     if (fe.selected) {
203.  
     count++;
204.  
     }
205.  
     });
206.  
     _list[index].selected =
207.  
     count == _list[index].goodsToBuyDtos.length;
208.  
     isSelect = _viewSelect();
209.  
     _listMoneyCount();
210.  
     setState(() {});
211.  
     }),
212.  
     new Image.network(
213.  
     Api.getInstance().photo +
214.  
     _list[index].goodsToBuyDtos[b].path,
215.  
     fit: BoxFit.fill,
216.  
     width: 80,
217.  
     height: 80,
218.  
     ),
219.  
     Expanded(
220.  
     child: new Padding(
221.  
     padding: new EdgeInsets.only(left: 5, right: 5),
222.  
     child: new Column(
223.  
     crossAxisAlignment: CrossAxisAlignment.start,
224.  
     children: <Widget>[
225.  
     Text(
226.  
     _list[index].goodsToBuyDtos[b].name,
227.  
     maxLines: 2,
228.  
     overflow: TextOverflow.ellipsis,
229.  
     ),
230.  
     new Expanded(
231.  
     child: new Column(
232.  
     crossAxisAlignment: CrossAxisAlignment.start,
233.  
     mainAxisAlignment: MainAxisAlignment.end,
234.  
     children: <Widget>[
235.  
     Text(
236.  
     _list[index].goodsToBuyDtos[b].skuCfg,
237.  
     softWrap: false,
238.  
     overflow: TextOverflow.ellipsis,
239.  
     ),
240.  
     Text(
241.  
     "￥${_list[index].goodsToBuyDtos[b].price}",
242.  
     style: TextStyle(color: Colors.red),
243.  
     softWrap: false,
244.  
     overflow: TextOverflow.ellipsis,
245.  
     )
246.  
     ],
247.  
     ))
248.  
     ],
249.  
     ),
250.  
     ),
251.  
     )
252.  
     ],
253.  
     ),
254.  
     height: 85,
255.  
     ),
256.  
     delegate: new SlidableDrawerDelegate(),
257.  
     secondaryActions: <Widget>[
258.  
     new IconSlideAction(
259.  
     caption: ‘删除‘,
260.  
     color: Colors.red,
261.  
     icon: Icons.delete,
262.  
     onTap: () => {},
263.  
     ),
264.  
     ]),
265.  
     ));
266.  
     }
267.  
     listWidget.add(new Column(
268.  
     children: listWidgetChild,
269.  
     ));
270.  
     return listWidget;
271.  
     }
272.  
      
273.  
     //计算金额
274.  
     _listMoneyCount() {
275.  
     money = 0.00;
276.  
     selectCount = 0;
277.  
     listItemCount = 0;
278.  
     _list.forEach((f) {
279.  
     f.goodsToBuyDtos.forEach((item) {
280.  
     if (item.selected) {
281.  
     var itemMoney = double.parse(item.price) * double.parse(item.count);
282.  
     money = money + itemMoney;
283.  
     selectCount++;
284.  
     }
285.  
     listItemCount++;
286.  
     });
287.  
     });
288.  
     }
289.  
     }
290.  
      
291.  
      
292.  
     复制代码

ShopCartBean

1.  
   import ‘package:json_annotation/json_annotation.dart‘;
2.  
    
3.  
   part ‘ShopCartBean.g.dart‘;
4.  
    
5.  
    
6.  
   @JsonSerializable()
7.  
   class ShopCartBean {
8.  
    
9.  
   @JsonKey(name: ‘code‘)
10.  
    String code;
11.  
     
12.  
    @JsonKey(name: ‘msg‘)
13.  
    String msg;
14.  
     
15.  
    @JsonKey(name: ‘result‘)
16.  
    List<ShopCartResult> result;
17.  
     
18.  
    @JsonKey(name: ‘success‘)
19.  
    bool success;
20.  
     
21.  
    ShopCartBean(this.code,this.msg,this.result,this.success,);
22.  
     
23.  
    factory ShopCartBean.fromJson(Map<String, dynamic> srcJson) => _$ShopCartBeanFromJson(srcJson);
24.  
     
25.  
    }
26.  
     
27.  
     
28.  
    @JsonSerializable()
29.  
    class ShopCartResult {
30.  
     
31.  
    @JsonKey(name: ‘couponShow‘)
32.  
    bool couponShow;
33.  
     
34.  
    @JsonKey(name: ‘goodsIdStr‘)
35.  
    String goodsIdStr;
36.  
     
37.  
    @JsonKey(name: ‘goodsToBuyDtos‘)
38.  
    List<GoodsToBuyDtos> goodsToBuyDtos;
39.  
     
40.  
    @JsonKey(name: ‘selected‘)
41.  
    bool selected;
42.  
     
43.  
    @JsonKey(name: ‘storeId‘)
44.  
    String storeId;
45.  
     
46.  
    @JsonKey(name: ‘storeName‘)
47.  
    String storeName;
48.  
     
49.  
    ShopCartResult(this.couponShow,this.goodsIdStr,this.goodsToBuyDtos,this.selected,this.storeId,this.storeName,);
50.  
     
51.  
    factory ShopCartResult.fromJson(Map<String, dynamic> srcJson) => _$ShopCartResultFromJson(srcJson);
52.  
     
53.  
    }
54.  
     
55.  
     
56.  
    @JsonSerializable()
57.  
    class GoodsToBuyDtos {
58.  
     
59.  
    @JsonKey(name: ‘count‘)
60.  
    String count;
61.  
     
62.  
    @JsonKey(name: ‘dValue‘)
63.  
    String dValue;
64.  
     
65.  
    @JsonKey(name: ‘fee‘)
66.  
    String fee;
67.  
     
68.  
    @JsonKey(name: ‘goodsId‘)
69.  
    String goodsId;
70.  
     
71.  
    @JsonKey(name: ‘id‘)
72.  
    String id;
73.  
     
74.  
    @JsonKey(name: ‘inventory‘)
75.  
    String inventory;
76.  
     
77.  
    @JsonKey(name: ‘isGoodsNew‘)
78.  
    bool isGoodsNew;
79.  
     
80.  
    @JsonKey(name: ‘limitDesc‘)
81.  
    String limitDesc;
82.  
     
83.  
    @JsonKey(name: ‘maxBatch‘)
84.  
    String maxBatch;
85.  
     
86.  
    @JsonKey(name: ‘memo‘)
87.  
    String memo;
88.  
     
89.  
    @JsonKey(name: ‘minBatch‘)
90.  
    String minBatch;
91.  
     
92.  
    @JsonKey(name: ‘name‘)
93.  
    String name;
94.  
     
95.  
    @JsonKey(name: ‘path‘)
96.  
    String path;
97.  
     
98.  
    @JsonKey(name: ‘price‘)
99.  
    String price;
100.  
      
101.  
     @JsonKey(name: ‘selected‘)
102.  
     bool selected;
103.  
      
104.  
     @JsonKey(name: ‘skuCfg‘)
105.  
     String skuCfg;
106.  
      
107.  
     @JsonKey(name: ‘standardCfg‘)
108.  
     String standardCfg;
109.  
      
110.  
     @JsonKey(name: ‘status‘)
111.  
     String status;
112.  
      
113.  
     @JsonKey(name: ‘storeType‘)
114.  
     String storeType;
115.  
      
116.  
     GoodsToBuyDtos(this.count,this.dValue,this.fee,this.goodsId,this.id,this.inventory,this.isGoodsNew,this.limitDesc,this.maxBatch,this.memo,this.minBatch,this.name,this.path,this.price,this.selected,this.skuCfg,this.standardCfg,this.status,this.storeType,);
117.  
      
118.  
     factory GoodsToBuyDtos.fromJson(Map<String, dynamic> srcJson) => _$GoodsToBuyDtosFromJson(srcJson);
119.  
      
120.  
     }
121.  
      
122.  
      
123.  
      
124.  
     复制代码

本人刚刚坑，代码没有进行拆分等优化 只是做了页面效果以及选中和未选中等逻辑操作（删除逻辑暂时没有写）

flutter 购物车功能

原文：https://www.cnblogs.com/zxh1919/p/12564574.html