Question

我有专栏，但问题是如果屏幕的高度很小，就会出现错误：

底部超过5.0像素

Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                      children: <Widget>[
                        CenterBoxText(),
                        SizedBox(height: 1),
                        RaisedButton(
                          child: Text(‘Example’),
                        ),
                      ],
                    ),

我尝试将Column替换为ListView，并且此停止错误。但是现在在大屏幕上，小部件从顶部显示，而不是在中心。因为ListView没有mainAxisAlignment: MainAxisAlignment.center。

如何解决？

谢谢！

Answer 1

如果列创建溢出时遇到问题，则可能是垂直轴上的溢出。 ListView允许在垂直轴上滚动，并允许溢出像素位于查看屏幕下方。这就是为什么ListView为您工作而Column不起作用的原因。由于您需要Column，因此您只需要将Column包装在Expandable中，以使Column适合在可用空间内。

这是一个完整的示例：

import 'package:flutter/material.dart';

class ColumnTest extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: <Widget>[
          Expanded(
              child: Center(
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
                //CenterBoxText(),
                SizedBox(height: 1),
                RaisedButton(
                  child: Text('example'),
                ),
            ],
          ),
              ))
        ],
      ),
    );
  }
}

Answer 2

尝试用Column小部件包装SingleChildScrollView小部件，它将提供滚动功能。像这样：

 SingleChildScrollView(
              child: Column(
                       mainAxisAlignment: MainAxisAlignment.center,
                       children: <Widget>[
                         CenterBoxText(),
                         SizedBox(height: 1),
                         RaisedButton(
                           child: Text(‘Example’),
                         ),
                       ],
                     ),
                    ),

Answer 3

将Column替换为ListView。

在您的ListView中，添加-shrinkWrap: true,，然后用ListView小部件包装Center。

如何居中ListView？

3 个答案: