没有AppBar和BottomNavigationBar的Flutter屏幕大小

Question

我想获取屏幕的确切尺寸，而不考虑AppBar和BottomNavigationBar。

以下是代码：

double screenSize = MediaQuery.of(context).size.height;
double height = screenSize - kToolbarHeight - kBottomNavigationBarHeight;
  return SingleChildScrollView(
    child: Column(
      children: [
        SizedBox(
          height: height / 2,
          child: Container(
            color: Colors.red,
          ),
        ),
        SizedBox(
          height: height / 2,
          child: Container(
            color: Colors.blue,
          ),
        ),
      ],
    ),
  );

通过这样做，我得到的高度比没有AppBar和BottomNavigationBar时实际屏幕大小稍微大一些。

在下面的截图中，您可以看到我如何可以滚动一点点。

如何计算屏幕区域的确切高度？

谢谢您的阅读和帮助！

- Elihu Del Valle

---

https://medium.com/flutter-community/a-guide-to-using-screensize-in-flutter-a-more-readable-approach-901e82556195 - Anmol Mishra

Answer 1

这应该可以做到。

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

我认为你需要移除默认的顶部填充

- JoyBoy Bami

Answer 2

获取宽度很容易，但高度可能会有些棘手，请按照以下步骤操作，这将有所帮助。

   double heightWithoutappBarNavBar = MediaQuery.of(context).size.height - (kBottomNavigationBarHeight + kToolbarHeight);

- Babul

---

嗨Babul，感谢您的帖子，但不幸的是它并没有帮助。在检查填充属性后，它们都具有0的值，因此布局没有改变。 - Elihu Del Valle

请使用以下代码。让我知道它是否有效...double heightWithoutappBarNavbar = MediaQuery.of(context).size.height - (kBottomNavigationBarHeight + kToolbarHeight); - Babul

嗨，Babul，那跟我已经有的一样，只是顺序不同而已，它不能运行 :( - Elihu Del Valle