Question

我的代码

return Dialog(
  insetPadding: EdgeInsets.all(50),
  elevation: 0,
  backgroundColor: Colors.transparent,
  child: ClipRRect(
    borderRadius: BorderRadius.circular(20.0),
    child: Scaffold(
      appBar: AppBar(
        title: Text("Select a service"),
        automaticallyImplyLeading: false,
        actions: [
          IconButton(
            icon: Icon(MdiIcons.close),
            onPressed: () => Navigator.pop(context)
        )]
      ),
      body: Text("This is just a test")
      )
  ));

如何删除顶部不需要的标题区域？

Answer 1

不要在对话框中使用 Scaffod 小部件！你实际上并不需要那个。像这样使用列和行使其简单：

return Dialog(
  insetPadding: EdgeInsets.all(50),
  elevation: 0,
  backgroundColor: Colors.transparent,
  child: ClipRRect(
    borderRadius: BorderRadius.circular(20.0),
    child: Container(
          child: Column(childre: [
              Row(children:[Text("Select a service"), IconButton(
            icon: Icon(MdiIcons.close),
            onPressed: () => Navigator.pop(context)
        )],
      ), // use this row for top bar and your action button, and use space between and wrap this row with a container for colors and etc
          Container(child: Text("This is just a test")) // use this Container for rest
      ])  
  ));

Answer 2

只需移除 AppBar 并创建自定义

return Dialog(
        insetPadding: EdgeInsets.all(50),
        elevation: 0,
        backgroundColor: Colors.transparent,
        child: ClipRRect(
            borderRadius: BorderRadius.circular(20.0),
            child: Scaffold(
                body: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                Container(
                  padding: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Text("Select a service"),
                      IconButton(
                          onPressed: () {
                            Navigator.pop(context);
                          },
                          icon: Icon(Icons.close))
                    ],
                  ),
                ),
                Container(
                  child: Text("This is just a test"),
                )
              ],
            ))));

Answer 3

我在 5 天后自己找到了答案。只需为 Scaffold 和 AppBar 添加 primary: false 即可。

    child: Scaffold(
      primary: false,
      appBar: AppBar(
        primary: false,

没有标题的颤振对话框

3 个答案: