flutter - Flutter 中的 Nexus 5 全屏尺寸太小？

Question

我正在尝试在颤振中实现一个应用程序，我希望这个应用程序是全屏的。

尽管我很努力，但我无法弄清楚如何正确设置屏幕尺寸。

这是我的代码：

class LoginPage extends StatefulWidget {
  @override
  _LoginPageState createState() => _LoginPageState();
}

class _LoginPageState extends State<LoginPage> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    final vm = Provider.of<LoginViewModel>(context);
    SystemChrome.setEnabledSystemUIOverlays([]);

    return Scaffold(
        backgroundColor: Color(BACKGROUND_COLOR),
        body: FractionallySizedBox(
            widthFactor: 1,
            heightFactor: 1,
            child: Container(
                color: Colors.blue,
                padding: EdgeInsets.all(30),
                child: Container(
                    child: Column(
                        mainAxisAlignment: MainAxisAlignment.spaceAround,
                        children: <Widget>[
                      Container(child: LoginForm(loginViewModel: vm)),
                      Container(child: CreateAccountSuggestor()),
                      Container(
                          width: MediaQuery.of(context).size.width * 0.65,
                          child: SocialConnectors()),
                    ])))));
  }
}

但我最终在底部有一个栏：

该条是 nexus 5 底部条的高度。

如何动态获取屏幕的全尺寸高度，否则蓝色容器将是全屏的？

标签： flutter

Answer 1

用 SafeArea 包裹您的 Scaffold 并将底部和顶部的属性设置为 false。