将小部件放在垂直中心

问题描述 投票:1回答:1

我在将电子邮件和移动TextFields垂直放置在中心时遇到问题。

我尝试过使用中心窗口小部件,mainAxisAlignment和crossAxisAlignment,但无济于事。

passwordInputs() => Container(
    padding: EdgeInsets.all(20.0),
    child: Center(
      child: ListView(
        children: <Widget>[
          Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              _getEmail(),
              Padding(
                padding: EdgeInsets.only(top: 10.0),
              ),
              _getMobileNumber(),
              Padding(
                padding: EdgeInsets.only(top: 16.0),
              ),
              _getSubmit()
            ],
          ),
        ],
      ),
    ),
  );
}

Widget _getEmail() {
 return Container(
  margin: EdgeInsets.only(left: 4),
   child: TextField(
   maxLines: 1,
    decoration: InputDecoration(
    labelText: "Email*",
  ),
),
);
}

Widget _getMobileNumber() {
return Container(
margin: EdgeInsets.only(left: 4),
child: TextField(
  maxLines: 1,
   decoration: InputDecoration(
    labelText: "Mobile*",
   ),
  ),
 );
}

这些小部件显示在屏幕顶部。我需要它们在屏幕的中央。

flutter-layout
1个回答
0
投票

你需要做的就是在listView中添加一个shrinkWrap : true,就像这样

Center(
    child: ListView(
      shrinkWrap: true,
      children: <Widget>[
        _getMobileNumber(),
        _getEmail()
      ],
    ),
  )

而且你不需要这个专栏。

© www.soinside.com 2019 - 2024. All rights reserved.