android - 颤振安全区域问题

Question

我正在开发一个应用程序，我需要使用安全区域以避免不必要的滑动。虽然我已经在自定义容器中实现了安全区域来渲染屏幕，但它在顶部留下了一个白边。

当我将这些参数添加到SafeArea()小部件时，

top: false,
maintainBottomViewPadding: true,

空白消失了。但是，应用栏的尺寸太大。这是最小的代码

import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';

class DashboardActivity extends StatefulWidget {
  @override
  _DashboardActivityState createState() => _DashboardActivityState();
}

class _DashboardActivityState extends State<DashboardActivity> {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      //top: false,
      //maintainBottomViewPadding: true,
      child: Scaffold(
        
        backgroundColor: Colors.white,
        resizeToAvoidBottomInset: true,
        appBar: CupertinoNavigationBar(
          backgroundColor: Colors.grey,
          leading: InkWell(
            child: Icon(
              Icons.arrow_back_ios,
              color: Colors.white,
            ),
            onTap: () => Navigator.pop(context),
          ),
          middle: Text(
            "Dashboard",
          ),
        ),
        body: Text(
          'This is an example use of SafeArea',
        ),
      ),
    );
  }
}

这只发生在高大的显示器上，即超过 18:9 的纵横比。

有人可以告诉我出了什么问题，我该如何解决？

Answer 1

SafeArea基本上是相同的 Padding 小部件。不同之处在于它会在必要时为其子部件添加填充（例如，它会将子部件缩进足以避开屏幕顶部的状态栏）。

它在较小的屏幕上工作的原因是它SafeArea没有在那里添加任何填充（就像有这样的东西padding: EdgeInsets.symmetric(vertical: 0)）

当您将Scaffold内部包裹SafeArea在更高的屏幕上时，它会计算必要的填充值并将其添加到Scaffold.

这就是你得到这个的原因：

SafeArea 的正确用例是在内部使用它body:。

FlutterAppBar和CupertinoAppBarwidgets 自己处理设备屏幕类型。