flutter 弹窗背景透明调透明度

flutter 弹窗背景透明调透明度

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

import '../../router.dart';
import '../widget/splitLine.dart';

class HeadBoxPreviewDialog extends StatefulWidget {
  const HeadBoxPreviewDialog({Key? key}) : super(key: key);

  @override
  State<StatefulWidget> createState() => HeadBoxPreviewDialogState();
}

class HeadBoxPreviewDialogState extends State<HeadBoxPreviewDialog> {
  @override
  void initState() {
    super.initState();
  }

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

  @override
  Widget build(BuildContext context) {
    return Material(
      color: Colors.transparent,//本来是透明的，但是好像没办法修改透明度
      child: Stack(
        children: [
          Opacity(//所以就加了一个底层，，底层用透明度控制，给0.7透明度
            opacity: 0.7,
            child: Container(
              color: Color(0xFF000000),//给颜色
            ),
          ),
          Center(//然后用Stack叠加的方式把控件叠上去，防止这个UI被Opacity控制到
            child: Container(
              margin: const EdgeInsets.only(top: 0),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Container(
                      height: 140.r,
                      width: 140.r,
                      decoration: BoxDecorationUtil().setFillBoxDecorationImg(
                          'assets/images/icon_post_make_friend_say_hi.png')),
                  ConstrainedBox(
                    constraints: BoxConstraints(maxWidth: 200.r),
                    child: Container(
                      margin: EdgeInsets.only(bottom: 15.r),
                      child: Text(
                        'Top.1',
                        style:
                            TextStyle(color: Colors.white, fontSize: 16.sp),
                      ),
                    ),
                  ),
                  ConstrainedBox(
                    constraints: BoxConstraints(maxWidth: 200.r),
                    child: Container(
                      margin: EdgeInsets.only(bottom: 53.r),
                      child: Text(
                        '参加xxx活动获得1',
                        style:
                            TextStyle(color: Colors.white, fontSize: 16.sp),
                      ),
                    ),
                  ),
                  GestureDetector(
                    onTap: () {
                      MyRouter.pop(context);
                    },
                    child: Container(
                      padding: EdgeInsets.only(
                          right: 15.r, top: 0, bottom: 40.r, left: 15.r),
                      child: Image(
                        image: const AssetImage(
                            'assets/images/icon_close_circle.png'),
                        width: 30.r,
                        height: 30.r,
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}

这篇好文章是转载于：学新通技术网