Flutter网页获得屏幕大小

Question

我第一次尝试flutter for web，并根据此文档在现有项目的基础上构建一个项目https://flutter.dev/web.项目运行良好，但在铬一半关闭我的应用程序是屏幕外。我试着用MediaQuery.of(context(和SafeArea((来获取屏幕大小，但什么也没发生。获取屏幕大小的正确方法是什么？

Answer 1

在Flutter中，我一直在尝试确定整个上下文视图的大小。您可以通过将MediaQuery与小部件的当前上下文一起使用来获得width或height

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

在小部件周围，您需要一个MaterialApp或WidgetsApp。他们是给予MediaQuery的人。当您调用.of(context)时，Flutter将始终在小部件树中查找小部件。

您可以通过添加等功能来提高响应能力

static bool isSmallScreen(BuildContext context) {
return MediaQuery.of(context).size.width < 800;
}
static bool isLargeScreen(BuildContext context) {
return MediaQuery.of(context).size.width > 1200;
}
static bool isMediumScreen(BuildContext context) {
return MediaQuery.of(context).size.width >= 800 &&
MediaQuery.of(context).size.width <= 1200;
}

在我看来，不要使用一个不支持多平台、没有超过100个发布点的垃圾库，而不是创建自己的函数来做事情，你也可以使用expand，它可以根据屏幕大小扩展屏幕

不要像那样给出尺寸

height:100
weight:100

当我们在多屏幕上使用它时，它可能会导致屏幕崩溃