首页 > 解决方案 > 颤振中具有顶部重力和覆盖线的对话框

问题描述

尝试制作此 UI,无法在对话框中设置重力或位置。我不知道要制作叠加虚线。

    class DashboardScreen extends StatefulWidget {
  @override
  _DashboardScreenState createState() => _DashboardScreenState();
}

class _DashboardScreenState extends State<DashboardScreen> {
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body:Container(),
      appBar: AppBar(centerTitle: false,
        automaticallyImplyLeading: false,
        backgroundColor: Colors.white,
        elevation: 0,
        title: Text(
          "Inventory",
          textScaleFactor: 1.3,
          style: TextStyle(color: Colors.black87, fontFamily: "light"),
        ),
        actions: [
          IconButton(
            onPressed: (){},
            color: Colors.black,
            icon: ImageIcon(
              AssetImage('assets/images/camera_outline.png'),
              size:50,
            ),
          ),
          IconButton(
            onPressed: (){},
            color: Colors.black,
            icon: ImageIcon(
              AssetImage('assets/images/camera_outline.png'),
              size:50,
            ),
          ),
          IconButton(
            onPressed: (){
              // openAlertBox();
              showDialog(context: context,
                  builder: (_) =>Dialog(
                      backgroundColor: Colors.transparent,
                      insetPadding: EdgeInsets.all(20),
                      child: Column(
                        children: <Widget>[
                          Container(
                            width: double.infinity,
                            height: 150,
                            decoration: BoxDecoration(
                                borderRadius: BorderRadius.circular(20),
                                color: Colors.white
                            ),
                            padding: EdgeInsets.fromLTRB(20, 50, 20, 20),
                            child: Text("You can make cool stuff!",
                                style: TextStyle(fontSize: 24),
                                textAlign: TextAlign.center
                            ),
                          ),
                        ],
                      )
                  ));
            },
            color: Colors.black,
            icon: ImageIcon(
              AssetImage('assets/images/camera_outline.png'),
              size:50,
            ),
          )
        ],
      ),
    );
  }
 
}

在此处输入图像描述

它看起来如何。

在此处输入图像描述

标签: androidiosflutteruser-interface

解决方案


推荐阅读