Flutter中的AppBar高度

Question

如何在Flutter 中获得AppBar的高度？
我正在使用MarialApp Widget('package:flutter/material.dart').

我有我的上下文的高度,并希望扣除appbar的高度.

final double height = MediaQuery.of(context).size.height;

Answer 1

你可以使用这个：

var height = AppBar().preferredSize.height;

这种方式非常简单且简单

Answer 2

正常工具栏高度有一个常量： kToolbarHeight

Answer 3

无需存储AppBar实例，也无需创建一个虚拟实例来获取高度。此外，AppBar.preferredSize将始终返回相同的值56.0，这是 Material Design 的标准，并且该值在某些情况下并不总是可用（例如缺少状态栏的高度）。

由于 anAppBar肯定与 a 一起使用Scaffold，恕我直言，获得真实AppBar高度（设备顶部和Scaffold身体顶部之间的距离）的更聪明的方法是使用：

double height = Scaffold.of(context).appBarMaxHeight;

有了这个，计算的高度将包括（独立于平台）：

• 状态栏高度
• 应用栏高度
• 底部应用栏小部件高度（如果有）（例如 TabBar）

希望这会有所帮助！

Answer 4

只需在 AppBar 中观看

MediaQuery.of(context).padding.top + kToolbarHeight

Answer 5

我认为这不是一种理想的方式,但它会起作用.

首先声明AppBar您将在您的小部件中使用的小部件Scaffold.

Widget demoPage() {
  AppBar appBar = AppBar(
    title: Text('Demo'),
  );
  return Scaffold(
    appBar: appBar,
    body: /*
    page body
    */,
  );
}

现在你可以获得你使用它的高度:appBarpreferredSized

double height = appBar.preferredSize.height;

您可以使用此高度来降低屏幕高度.

final double height = MediaQuery.of(context).size.height;

Answer 6

获取体高：

MediaQuery.of(context).size.height - (MediaQuery.of(context).padding.top + kToolbarHeight)

我希望，这个解决方案也能帮助你。感谢提出这个问题。

Answer 7

AppBar 的固定高度为 56。

您应该创建自己的应用栏来实现 PreferredSizeWidget

class TestAppBar extends StatelessWidget implements PreferredSizeWidget {
  @override
  Widget build(BuildContext context) {
    return AppBar(
      title: Text('TEST'),
      centerTitle: true,
    );
  }

  @override
  Size get preferredSize => Size.fromHeight(34);
}