Question

如何在抖动中将屏幕调整为所有android设备屏幕。我已经检查了stackoverflow，但是不幸的是我没有任何令人满意的答案。

Answer 1

我认为您对响应式布局存在一些疑问，因此我将为您提供MediaQuery的一些示例：

使用MediaQuery，您可以获取设备的屏幕宽度：

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

高度：

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

以及方向：

    Orientation orientation = MediaQuery.of(context).orientation;

以及有关设备的各种信息，然后，您可以根据方向，尺寸等来布局。

这是一个例子：

                 Container(
                    width: MediaQuery.of(context).orientation == Orientation.portrait ?
                      MediaQuery.of(context).size.width / 1.3 : MediaQuery.of(context).size.width / 2.1,
                    child: RaisedButton(
                        elevation: 0.0,
                        color: Colors.green,
                        child: Text("CONTINUE", style: TextStyle(color: Colors.white),),
                        onPressed: (){
                          //code of onPressed
                          );
                        }
                    ),
                  ),

您也可以使用Align来定义窗口小部件的位置，位置，列，中心等的属性。

另一个示例，使用FittedBox处理文本：

   @override
   Widget build(BuildContext context) {
       return Material(
          child: SafeArea(
              child: Scaffold(
                  body: ListView(
                      children: <Widget>[
                      FittedBox(child: Text("Test"),),
                      FittedBox(child: Text("Flutter Flutter Flutter"),) 
                   ],
                 ),
              ),
            ),
         );
      }

结果：

肖像：

风景：

Answer 2

基本上，Flutter会根据设备尺寸自动设置高度和宽度。示例-如果使用的列表视图包含100个项目，则某些设备可能一次显示5个项目，而某些设备可能显示6个项目。它是由Flutter自动完成的。

仅当您指定高度和/或宽度的绝对值时，问题才会出现。假设您有一个小部件，并将宽度指定为450。现在，它可能适合较大的屏幕，但适合较小的屏幕（例如，宽度为400磅），那么您会在UI中看到像素溢出错误。

现在，要解决此问题，您可以按照LGM的建议使用MediaQuery.of（context）.size.height / width。

屏幕与所有设备兼容

2 个答案: