在Flutter中将ListView居中

Opt*_* GM 6 android dart flutter flutter-layout

我正在尝试制作带有徽标的登录/注册屏幕。我需要它们具有响应能力,因此可以适合大多数移动屏幕。为了实现这一点,我使用了ListView。但是,我只需要将ListView居中放置在布局中即可。有什么建议么?

这是我的尝试:

@override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Center(
        child: ListView(
          children: <Widget>[
            Image.asset('assets/images/logo.png', scale: 3.0,),
            InputField('enter email address', Icons.email, TextInputType.emailAddress),
            PasswordInputField('enter password', Icons.lock, TextInputType.text),
            RoundBtn('SIGN IN', signIn),
            RoundBtn('SIGN UP', () => {}),
            OutlineBtn('FORGOT PASSWORD?', () => {})
          ],
        ),
      )
    );
  }
Run Code Online (Sandbox Code Playgroud)

登录屏幕 注册屏幕

Sac*_*oma 11

使用SingleChildScrollView而不是ListView。尝试这个...

 @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Center(
          child: SingleChildScrollView(
            child: Column(
            children: <Widget>[
              Image.asset('assets/images/logo.png', scale: 3.0,),
              InputField('enter email address', Icons.email, TextInputType.emailAddress),
              PasswordInputField('enter password', Icons.lock, TextInputType.text),
              RoundBtn('SIGN IN', signIn),
              RoundBtn('SIGN UP', () => {}),
              OutlineBtn('FORGOT PASSWORD?', () => {})
            ],
          ),
        ),)
    );
  }
Run Code Online (Sandbox Code Playgroud)


jit*_*555 5

ListView 不能添加到屏幕中央。仍然没有官方文档。但是,如果你想做

例子:

Center(
    child: ListView(
      shrinkWrap: true,
      children: <Widget>[
        Center(child: Text('Text1')),
        Center(child: Text('Text2')),
        Center(child: Text('Text3')),
      ],
    ),
  )
Run Code Online (Sandbox Code Playgroud)

输出:

在此处输入图片说明