Question

我一直在google和s.o上寻找答案，但找不到合适的答案。

我正在使用Stack小部件作为页面布局。在该堆栈内部，我将所有子窗口小部件都与Align窗口小部件一起放置。我尝试在Align子项下创建ListView小部件，但是其卡片（子项）忽略了将ListView的对齐值设置为List的起始值。

    Align(
      alignment: Alignment(0, -0.28),
      child: Divider(
        color: Color.fromARGB(50, 255, 255, 255),
      ),
    ),
    Align(
      alignment: Alignment(0, -0.20),
      child: ListView(
        children: <Widget>[
          Card(
            child: ListTile(
            leading: Icon(some_icon),
            title: Text("blabla"),
          )),
        ],
      ),
    ),

我希望ListView项在我的Divider下开始，因为垂直倾斜度设置的值为-0.20，低于Divider对齐（-0.28）。但是，它的外观如下：

如果我删除ListView并将 Card小部件设置为Align直接子对象，则定位很好。现在，正如我在文档中所读到的，“对齐”小部件的对齐方式值受唯一子对象的尊重，那么如何为ListView子对象（行/列表标题/卡等）实现相同的效果？

Answer 1

这只是一个示例！根据需要进行修改。（已编辑）

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Stack(children: [
      //Your behind widgets here...
      Stack(children: [
        Card(
            color: Colors.white,
            child:
                ListTile(title: Text('1st card', textAlign: TextAlign.center))),
        Align(
          alignment:Alignment(0, -0.20),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
              Container(
                height: 2,
                width: double.infinity,
                color: Colors.black,
                margin: EdgeInsets.only(right: 25, left: 25),
              ),
              SizedBox(
                height: 10,
                width: double.infinity,
              ),
              Card(
                  color: Colors.white,
                  child: ListView(shrinkWrap: true, children: [
                    ListTile(
                        title: Text('List card', textAlign: TextAlign.center))
                  ])),
            ],
          ),
        )
      ])
    ]));
  }

Answer 2

请尝试一下...

      body: Container(
        child: Center(
          child: Padding(
            padding: EdgeInsets.all(10),
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                Divider(
                  thickness: 20, // this is for example
                  height: 22, // this is for example
                  color: Colors.red, // this is for example
                ),
                Card (
                    child: ListTile(
                  leading: Icon(Icons.print),
                  title: Text("blabla"),
                )),
              ],
            ),
          ),
        ),
      ),

Flutter-如何对齐（小部件）孙子部件，使其与子部件相同

2 个答案: