我在 Flutter 上创建了一个新应用程序，在不同设备之间切换时遇到了屏幕尺寸问题。
我使用 Pixel 2XL 屏幕尺寸创建了应用程序，因为我的容器的子级为
ListView因此，当我将设备切换到新设备时，容器太长并引发错误。
我怎样才能使应用程序针对所有屏幕进行优化？
您可以使用：
double width = MediaQuery.of(context).size.width;double height = MediaQuery.of(context).size.height;要获取 SafeArea 的高度（适用于 iOS 11 及更高版本）：
var padding = MediaQuery.of(context).padding;double newheight = height - padding.top - padding.bottom;获得
widthheightheight// Full screen width and height
double width = MediaQuery.of(context).size.width;
double height = MediaQuery.of(context).size.height;
// Height (without SafeArea)
var padding = MediaQuery.of(context).viewPadding;
double height1 = height - padding.top - padding.bottom;
// Height (without status bar)
double height2 = height - padding.top;
// Height (without status and toolbar)
double height3 = height - padding.top - kToolbarHeight;
为未来的研究人员澄清并详细说明确切的解决方案：
没有上下文：
import 'dart:ui';
var pixelRatio = window.devicePixelRatio;
//Size in physical pixels
var physicalScreenSize = window.physicalSize;
var physicalWidth = physicalScreenSize.width;
var physicalHeight = physicalScreenSize.height;
//Size in logical pixels
var logicalScreenSize = window.physicalSize / pixelRatio;
var logicalWidth = logicalScreenSize.width;
var logicalHeight = logicalScreenSize.height;
//Padding in physical pixels
var padding = window.padding;
//Safe area paddings in logical pixels
var paddingLeft = window.padding.left / window.devicePixelRatio;
var paddingRight = window.padding.right / window.devicePixelRatio;
var paddingTop = window.padding.top / window.devicePixelRatio;
var paddingBottom = window.padding.bottom / window.devicePixelRatio;
//Safe area in logical pixels
var safeWidth = logicalWidth - paddingLeft - paddingRight;
var safeHeight = logicalHeight - paddingTop - paddingBottom;
结合上下文：
//In logical pixels
var width = MediaQuery.of(context).size.width;
var height = MediaQuery.of(context).size.height;
var padding = MediaQuery.of(context).padding;
var safeHeight = height - padding.top - padding.bottom;
为好奇者提供有关物理和逻辑像素的额外信息： https://blog.specctr.com/pixels-physical-vs-逻辑-c84710199d62
下面的代码有时不会返回正确的屏幕尺寸：
MediaQuery.of(context).size
我在 SAMSUNG SM-T580 上进行了测试，它返回
{width: 685.7, height: 1097.1}1920x1080请使用：
import 'dart:ui';
window.physicalSize;
使用以下方法我们可以获得设备的物理高度。 前任。 1080X1920
WidgetsBinding.instance.window.physicalSize.height
WidgetsBinding.instance.window.physicalSize.width
MediaQuery.of(context).size.widthMediaQuery.of(context).size.height我在 flutter 上创建了一个新应用程序，在不同设备之间切换时遇到了屏幕尺寸问题。
是的，
flutter_screenutil用途：
添加依赖：
安装前请检查最新版本。
dependencies:
flutter:
sdk: flutter
# add flutter_ScreenUtil
flutter_screenutil: ^0.4.2
将以下导入添加到您的 Dart 代码中：
import 'package:flutter_screenutil/flutter_screenutil.dart';
根据系统的“字体大小”辅助选项初始化并设置适合大小和字体大小以缩放
//fill in the screen size of the device in the design
//default value : width : 1080px , height:1920px , allowFontScaling:false
ScreenUtil.instance = ScreenUtil()..init(context);
//If the design is based on the size of the iPhone6 (iPhone6 750*1334)
ScreenUtil.instance = ScreenUtil(width: 750, height: 1334)..init(context);
//If you wang to set the font size is scaled according to the system's "font size" assist option
ScreenUtil.instance = ScreenUtil(width: 750, height: 1334, allowFontScaling: true)..init(context);
用途：
//for example:
//rectangle
Container(
width: ScreenUtil().setWidth(375),
height: ScreenUtil().setHeight(200),
...
),
////If you want to display a square:
Container(
width: ScreenUtil().setWidth(300),
height: ScreenUtil().setWidth(300),
),
请参阅更新的文档了解更多详细信息
注意：我测试并使用了这个插件，它确实适用于包括 iPad 在内的所有设备
希望这对某人有帮助
嘿，您可以使用此类来获取屏幕宽度和高度（以百分比表示）
import 'package:flutter/material.dart';
class Responsive{
static width(double p,BuildContext context)
{
return MediaQuery.of(context).size.width*(p/100);
}
static height(double p,BuildContext context)
{
return MediaQuery.of(context).size.height*(p/100);
}
}
并像这样使用
Container(height: Responsive.width(100, context), width: Responsive.width(50, context),);
最初我也陷入了这个问题。 然后我知道，对于移动设备，我们使用
MediaQuery.of(context).size.heightwindow.screen.heightdart.html
import 'dart:html';
getViewHeight =>
window.screen!.height! *
((window.screen!.height! -
kToolbarHeight -
kBottomNavigationBarHeight -
120) /
window.screen!.height!);
kIsWeb
? getViewHeight
: MediaQuery.of(context).size.height * 0.7)
通过使用这种方法，我们动态获得最大可用屏幕尺寸。
如何在 flutter 中访问屏幕尺寸或像素密度或长宽比？
我们可以访问屏幕尺寸和其他信息，如像素密度、宽高比等。 在 MediaQuery 的帮助下。
语法：MediaQuery.of(context).size.height
只需声明一个函数
Size screenSize() {
return MediaQuery.of(context).size;
}
像下面这样使用
return Container(
width: screenSize().width,
height: screenSize().height,
child: ...
)
有点晚了，因为我大约两年前就问了这个问题，当时还是个新手，但感谢大家的回复，因为当时我知道这是一个巨大的帮助。
为了澄清，我可能应该要求的是一个 Expanded 小部件，因为我相信（对我试图实现的目标的记忆模糊）我希望有一个 ListView 作为 Column 的子项之一。我应该寻求优化最大可用空间，而不是使用特定的屏幕尺寸来适应列中的此 ListView，因此将 ListView 包装在 Expanded 中将会产生预期的效果。
MediaQuery 很棒，但我尝试仅使用它来破译屏幕使用材质断点的外形尺寸，否则我尝试尽可能多地使用 Expanded/Spacer 小部件，并在最小/最大尺寸上使用 BoxConstaints，还需要考虑使用 SafeArea 小部件实际可用的最大空间以避免缺口/导航栏，
import 'dart:ui';
var pixelRatio = window.devicePixelRatio;
//Size in physical pixels
var physicalScreenSize = window.physicalSize;`
非常好，问题是当你构建 --release 时它不起作用。 原因是应用程序启动时 Size 为零，因此如果代码速度很快，phisicalSize 的值为 (0.0, 0.0)。
您找到解决方案了吗？
我最初从 MediaQuery 获取大小以备不时之需，然后设置一个 Future 在 500 毫秒内运行以再次获取它。第二次尝试是正确的。我的应用程序是一个从菜单开始的游戏，所以如果尺寸稍微小一点也没关系。
创建一个帮助文件并将其命名为
responsive_helper.dart
import 'package:flutter/material.dart';
class ResponsiveHelper {
static double getDeviceWidth(BuildContext context) {
return MediaQuery.of(context).size.width * MediaQuery.of(context).devicePixelRatio;
}
static double getDeviceHeight(BuildContext context) {
// Add Additional or Customize To Get Accurate Height
return MediaQuery.of(context).size.height * MediaQuery.of(context).devicePixelRatio + kToolbarHeight + kBottomNavigationBarHeight;
}
}
然后就可以这样使用了
double deviceWidth = ResponsiveHelper.getDeviceWidth(context);
if (deviceWidth <= 320) {
} else if (deviceWidth >= 321) {
}
等等