huixiang_app/lib/home/home_view/discount_zone.dart

import 'package:dio/dio.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:huixiang/retrofit/retrofit_api.dart';
import 'package:huixiang/utils/font_weight.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:huixiang/view_widget/item_title.dart';

class DiscountZone extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _DiscountZone();
  }
}

class _DiscountZone extends State<DiscountZone> {
  ApiService apiService;

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

  @override
  Widget build(BuildContext context) {
    return Container(
      width: double.infinity,
      margin: EdgeInsets.only(bottom: 12.h, top: 16.h),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisAlignment: MainAxisAlignment.start,
        children: [
          ItemTitle(
            text: "特惠专区",
          ),
          Container(
            height: 91.h,
            margin: EdgeInsets.only(top: 14,left: 14.w),
            child: ListView.builder(
              scrollDirection: Axis.horizontal,
              physics: BouncingScrollPhysics(),
              itemCount: 6,
              itemBuilder: (context, position) {
                return GestureDetector(
                  onTap: () {},
                  child: discountItem(),
                );
              },
            ),
          ),
        ],
      ),
    );
  }

  Widget discountItem() {
    return Container(
      width: 246.w,
      height: 91.h,
      decoration: BoxDecoration(
        image: DecorationImage(
          fit: BoxFit.cover,
          image: AssetImage("assets/image/discount.webp"),
        ),
      ),
      padding: EdgeInsets.symmetric(horizontal: 12.w, vertical: 15.h),
      margin: EdgeInsets.only(right: 6.w),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Column(
            children: [
              Text.rich(
                TextSpan(
                  children: [
                    TextSpan(
                      text: "¥",
                      style: TextStyle(
                        fontSize: 12.sp,
                        fontWeight: MyFontWeight.semi_bold,
                        color: Color(0xFF32A060),
                      ),
                    ),
                    TextSpan(
                      text: "30",
                      style: TextStyle(
                        fontSize: 30.sp,
                        fontWeight: MyFontWeight.semi_bold,
                        color: Color(0xFF32A060),
                      ),
                    ),
                  ],
                ),
              ),
              Text(
                "满30.1可用",
                style: TextStyle(
                  fontSize: 12.sp,
                  fontWeight: MyFontWeight.regular,
                  color: Color(0xFF32A060),
                ),
              ),
            ],
          ),
          Spacer(),
          Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                "百年川椒(哈乐城店)",
                style: TextStyle(
                  fontSize: 14.sp,
                  fontWeight: MyFontWeight.bold,
                  color: Color(0xFF0D0D0D),
                ),
              ),
              Text(
                "新人满减30元",
                style: TextStyle(
                  fontSize: 10.sp,
                  fontWeight: MyFontWeight.regular,
                  color: Color(0xFF4D4D4D),
                ),
              ),
              Text(
                "有效期至2022-09-10",
                style: TextStyle(
                  fontSize: 12.sp,
                  fontWeight: MyFontWeight.regular,
                  color: Color(0xFF4D4D4D),
                ),
              ),
            ],
          )
        ],
      ),
    );
  }
}