flutter 使用 Stack 布局分割线问题

1、仔细看 下方Column里面有两部分中间有一条分割线 是因为了使用了flutter_screenutil ,做屏幕适配会有小数点造成的。代码里面的尺寸造成的。我们可以去掉小数点就好了

image.png
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.only(bottom: 10),
      child: Stack(
        fit:StackFit.passthrough,
        children: [
          ImageNetWork(imageUrl: widget.model.topBannerImg,width: double.infinity,height : 228.w),
          Column(
            children: [
              SizedBox(height:198.w,),
              Container(
                decoration: BoxDecoration(
                    color: AppColor.bgF8,
                    borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(20),
                      topRight: Radius.circular(20))
                ),
                width: double.infinity,
                height: 228.w - 204.w,
              ),
              _headerWidget()
            ],
          )
        ],
      ),
    );
  }

  Widget _headerWidget(){
    return  Container(
      color: AppColor.bgF8,
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          SizedBox(width: 20,),
          Container(
            width: 3,
            height: 15,
            decoration: BoxDecoration(
                color: AppColor.themeColor,
                borderRadius: BorderRadius.circular(1.5)
            ),
          ),
          SizedBox(width:4,),
          CustomText ('变美服务', isBold: true,fontSize: 17,),
          SizedBox(width:8,),
        ],
      ),
    );
  }

去掉小数点就行了,去掉小数点过后 ,可以使用字符串分割去掉小数点 ,我这里使用的是

//插件
import 'package:common_utils/common_utils.dart';

  //不保留小数
  static String getIntStrByValueStr(String num) {
    if (num == null) return '0';
    double mm = double.parse(num);
    return "${(NumUtil.getNumByValueDouble(mm, 0)).toStringAsFixed(0)}";
  }

  // 转double
  static double getDouble0Decimal(double num){

    return double.parse(getIntStrByValueStr('$num'));
  }
image.png

你可能感兴趣的:(flutter 使用 Stack 布局分割线问题)