huixiang_app/lib/store/shop__details_page.dart

import 'package:flutter/material.dart';
import 'package:flutter_swiper/flutter_swiper.dart';
import 'package:huixiang/retrofit/retrofit_api.dart';
import 'package:huixiang/utils/font_weight.dart';
import 'package:huixiang/view_widget/classic_header.dart';
import 'package:huixiang/view_widget/my_footer.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class ShopDetailsPage extends StatefulWidget {
  final Map<String, dynamic> arguments;

  ShopDetailsPage({this.arguments});

  @override
  State<StatefulWidget> createState() {
    return _ShopDetailsPage();
  }
}

class _ShopDetailsPage extends State<ShopDetailsPage> {
  ApiService apiService;
  final ScrollController scrollController = ScrollController();
  final RefreshController refreshController = RefreshController();

  @override
  void initState() {
    super.initState();


  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        child: Column(
          children: [
            Expanded(
              child: SmartRefresher(
                controller: refreshController,
                enablePullDown: true,
                enablePullUp: false,
                header: MyHeader(),
                footer: CustomFooter(
                  builder: (context, mode) {
                    return MyFooter(mode);
                  },
                ),
                onRefresh:(){
                  setState(() {
                  });
                },
                physics: BouncingScrollPhysics(),
                scrollController: scrollController,
                child: Container(
                  child: SingleChildScrollView(
                    physics: BouncingScrollPhysics(),
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.start,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        buildProduct(),
                        Container(
                          width: double.infinity,
                          padding: EdgeInsets.only(top: 16.h,left: 14.w,right: 14.w,bottom: 16.h),
                          color: Colors.white,
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.start,
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Text(
                                "商品详情",
                                style: TextStyle(
                                  fontSize:15.sp,
                                  fontWeight: MyFontWeight.semi_bold,
                                  color: Color(0xFF000000),
                                ),
                              ),
                              SizedBox(height: 14.h,),
                              Image.asset(
                                "assets/image/icon_story_td.webp",
                                width: double.infinity,
                                fit: BoxFit.cover,
                                height:99.h,
                              ),
                            ],
                          ),
                        )
                      ],
                    ),
                  ),
                ),
              ),
              flex: 1,
            ),
          ],
        ),
      ),
    );
  }

  Widget buildProduct() {
    return Container(
      decoration: BoxDecoration(
          borderRadius: BorderRadius.vertical(
            bottom: Radius.circular(8.h),
          ),
          boxShadow: [
            BoxShadow(
              color: Colors.black.withAlpha(12),
              offset: Offset(0, 3),
              blurRadius: 14,
              spreadRadius: 0,
            )
          ],
          color: Colors.white),
      child: Column(
        children: [
          swiper(),
          Container(
            padding: EdgeInsets.only(top: 16.h,left: 14.w,right: 14.w,bottom: 16.h),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Text(
                      "￥19.00",
                      style: TextStyle(
                        fontSize:24.sp,
                        fontWeight: MyFontWeight.semi_bold,
                        color: Color(0xFFF85400),
                      ),
                    ),
                    SizedBox(width: 2,),
                    Expanded(child:
                    Text(
                      "￥19.00",
                      style: TextStyle(
                        fontSize:16.sp,
                        decoration: TextDecoration.lineThrough,
                        fontWeight: MyFontWeight.regular,
                        color: Color(0xFFA29E9E),
                      ),
                    )),
                    GestureDetector(
                      onTap: (){
                        showDeleteDialog();
                      },
                      child: Container(
                        width: 92.w,
                        height: 32.h,
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(4),
                          color: Color(0xFF32A060),
                        ),
                        margin: EdgeInsets.only(bottom: 8),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.center,
                          crossAxisAlignment: CrossAxisAlignment.center,
                          children: [
                            Image.asset(
                              "assets/image/goods_shopp.webp",
                              fit: BoxFit.fill,
                              width: 18,
                              height: 18,
                            ),
                            SizedBox(width: 2,),
                            Text(
                              "加入购物车",
                              style: TextStyle(
                                fontSize:12.sp,
                                fontWeight: MyFontWeight.regular,
                                color: Color(0xFFFFFFFF),
                              ),
                            ),
                          ],
                        ),
                      ),
                    )
                  ],
                ),
                Text(
                  "手工啵啵奶茶",
                  style: TextStyle(
                    fontSize:15.sp,
                    fontWeight: MyFontWeight.semi_bold,
                    color: Color(0xFF000000),
                  ),
                ),
                SizedBox(height: 12.h,),
                Text(
                  "商品是为了出售而生产的劳动成果，是人类社会生产力发展到一定历史阶段的产物，是用于交换的劳动产品。",
                  style: TextStyle(
                    fontSize:12.sp,
                    height: 1.5,
                    fontWeight: MyFontWeight.regular,
                    color: Color(0xFF4D4D4D),
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget swiper() {
    return Container(
      child: AspectRatio(
        aspectRatio: 1.3698,
        child: Stack(
          children: [
            Swiper(
              pagination: SwiperPagination(
                alignment: Alignment.bottomCenter,
                builder: DotSwiperPaginationBuilder(
                  size: 8,
                  activeSize: 8,
                  space: 5,
                  activeColor: Colors.black,
                  color: Colors.black.withAlpha(76),
                ),
              ),
              itemBuilder: (context, position) {
                return Image.asset(
                  "assets/image/icon_story_td.webp",
                  fit: BoxFit.cover,
                  width: 24,
                  height: 24,
                );
              },
              itemCount: 3,
            ),
            GestureDetector(
              onTap: () {
                Navigator.of(context).pop();
              },
              child: Container(
                margin: EdgeInsets.only(left: 16, top: 52),
                padding: EdgeInsets.all(5),
                child: Icon(
                  Icons.arrow_back_ios,
                  size: 24,
                  color: Color(0xFF353535),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  ///选择規格弹窗
  showDeleteDialog() {
    showDialog(
      context: context,
      builder: (context) {
        return AlertDialog(
          content: Container(
            width: MediaQuery.of(context).size.width - 84,
            height:500.h,
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.start,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    ClipRRect(
                      child: Image.asset(
                        "assets/image/icon_story_td.webp",
                        fit: BoxFit.fill, //填充剩余空间
                        height: 70.h,
                        width: 70,
                      ),
                      borderRadius: BorderRadius.circular(4),
                    ),
                    SizedBox(width: 10.w,),
                    Expanded(child:Container(
                      height: 70,
                      child:  Column(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            crossAxisAlignment: CrossAxisAlignment.center,
                            children: [
                              Text(
                                "手工啵啵奶茶",
                                style: TextStyle(
                                  fontSize: 13.sp,
                                  fontWeight: FontWeight.bold,
                                  color: Color(0xFF000000),
                                ),
                              ),
                              Image.asset(
                                "assets/image/cancel.webp",
                                fit: BoxFit.cover,
                                height: 24,
                                width: 24,
                              ),
                            ],
                          ),
                          Text(
                            "￥19.00",
                            style: TextStyle(
                              fontSize: 12.sp,
                              fontWeight: FontWeight.bold,
                              color: Color(0xFFF65720),
                            ),
                          ),
                        ],
                      ),
                    )),
                  ],
                )
              ],
            ),
          ),
        );
      },
    );
  }
}