我现在用flutter写了一个商城我需要你按照下面的要求给我对应的文件和代码现在商品详情页缺少一个添加到购物车按钮而且也没有数量选择购物车按钮我想做成悬浮的长按可以动画展开显示所有购物车商品然后添加一个结算按钮可以直接跳转到结算页面所有的网络请求都要写在apiservice里面并且写好对应的model和api_service我的添加到购物车接口是httpbookmusecloudtechaddca

import 'package:cached_network_image/cached_network_image.dart'; import 'package:ecommerce_muse/models/product.dart'; import 'package:ecommerce_muse[表情]rvices/api_service.dart'; import 'package:flutter/material.dart';

class ProductDetailPage extends StatefulWidget { final int productId;

ProductDetailPage({required this.productId});

@override _ProductDetailPageState createState() => _ProductDetailPageState(productId: productId); }

class _ProductDetailPageState extends State { final int productId; late Future _productFuture; int _quantity = 1;

_ProductDetailPageState({required this.productId});

@override void initState() { super.initState(); _productFuture = ApiService.getProductDetail(productId); }

void _addToCart() async { try { String result = await ApiService.addToCart(productId, _quantity); if (result == "success") { ScaffoldMessenger.of(context).showSnackBar( SnackBar( content: Text("添加到购物车成功"), duration: Duration(seconds: 2), ), ); } else { ScaffoldMessenger.of(context).showSnackBar( SnackBar( content: Text("添加到购物车失败，请重试"), duration: Duration(seconds: 2), ), ); } } catch (e) { ScaffoldMessenger.of(context).showSnackBar( SnackBar( content: Text("添加到购物车失败，请检查网络连接"), duration: Duration(seconds: 2), ), ); } }

Widget _buildFloatingCartButton() { return FloatingActionButton( onPressed: () {}, child: Stack( children: [ Icon(Icons.shopping_cart), Positioned( top: 0, right: 0, child: Container( padding: EdgeInsets.all(2), decoration: BoxDecoration( color: Colors.red, borderRadius: BorderRadius.circular(10), ), child: Text( "1", // 替换成购物车中商品数量的变量 style: TextStyle( color: Colors.white, fontSize: 12, ), ), ), ), ], ), ); }

Widget _buildQuantitySelector() { return Row( children: [ IconButton( onPressed: () { setState(() { if (_quantity > 1) { _quantity--; } }); }, icon: Icon(Icons.remove), ), Text( _quantity.toString(), style: TextStyle(fontSize: 18), ), IconButton( onPressed: () { setState(() { _quantity++; }); }, icon: Icon(Icons.add), ), ], ); }

@override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text('商品详情'), ), body: FutureBuilder( future: _productFuture, builder: (context, snapshot) { if (snapshot.hasData) { return _buildProductDetail(snapshot.data!); } else if (snapshot.hasError) { return Center( child: Text('加载商品详情失败'), ); } return Center( child: CircularProgressIndicator(), ); }, ), floatingActionButton: _buildFloatingCartButton(), ); }

Widget _buildProductDetail(Product product) { return SingleChildScrollView( child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ CachedNetworkImage( imageUrl: product.imageUrl, fit: BoxFit.cover, errorWidget: (context, url, error) => Icon(Icons.error), ), Padding( padding: const EdgeInsets.all(8.0), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( product.name, style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold), ), SizedBox(height: 8), Text( '价格: ¥${product.price.toStringAsFixed(2)}', style: TextStyle(fontSize: 18), ), SizedBox(height: 8), Text( '品牌: ${product.brand}', style: TextStyle(fontSize: 18), ), SizedBox(height: 8), Text( '描述: ${product.description}', style: TextStyle(fontSize: 18), ), SizedBox(height: 8), Text( '数量:', style: TextStyle(fontSize: 18), ), _buildQuantitySelector(), SizedBox(height: 8), ElevatedButton( onPressed: _addToCart, child: Text('添加到购物车'), ), ], ), ), ], ), ); }