Flutter 方向生成器提供错误的方向

Flutter 方向生成器提供错误的方向,flutter,flutter-layout,Flutter,Flutter Layout,在我的应用程序中,我使用GridView来显示类别网格和TextField。我想根据屏幕方向更改一行中显示的项目数(即在纵向模式下,每行5个项目,在横向模式下,每行8个项目) 我试图通过使用OrientationBuilderwidget来实现这一点。直到我打开软键盘编辑文本字段,它才能正常工作 但当我打开软键盘时,方向生成器将方向返回为横向,从而导致溢出问题 这是我的密码 return new Scaffold( appBar: buildFilterAppBar(context)

在我的应用程序中,我使用
GridView
来显示类别网格和
TextField
。我想根据
屏幕方向更改一行中显示的项目数(即在
纵向模式下,每行5个项目
,在
横向模式下,每行8个项目


我试图通过使用
OrientationBuilder
widget来实现这一点。直到我打开软键盘编辑文本字段,它才能正常工作

但当我打开软键盘时,方向生成器将方向返回为
横向
,从而导致溢出问题

这是我的密码

return new Scaffold(
      appBar: buildFilterAppBar(context),
      body: new OrientationBuilder(builder: (context, orientation) {
        return new Column(
          children: <Widget>[
            new Expanded(
              child: new ListView(
                children: <Widget>[
                  buildContentTitle(
                      context, true, Icons.local_offer, '', 'Choose category'),
                  new GridView.count(
                    crossAxisCount: orientation == Orientation.portrait ? 5 : 8,
                    shrinkWrap: true,
                    physics: new NeverScrollableScrollPhysics(),
                    children: buildCategories(orientation),
                  ),
                  new Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      buildContentTitle(context, false, null,
                          'assets/money_pouch.png', 'Set a price range'),
                      new Padding(
                        padding: const EdgeInsets.only(left: 44.0),
                        child: new Text(
                          'Price (\u20B9)',
                          style: new TextStyle(
                              color: Theme.of(context).primaryColorDark,
                              fontSize: 15.0,
                              fontWeight: FontWeight.w600),
                        ),
                      ),
                      new Padding(
                        padding: const EdgeInsets.only(left: 44.0, right: 12.0),
                        child: new Row(
                          children: <Widget>[
                            new Flexible(
                                child: new TextField(
                                  decoration: new InputDecoration(labelText: 'From'),
                                )),
                            new Container(
                              width: 1.0,
                              height: 40.0,
                              color: Colors.grey[700],
                              margin: const EdgeInsets.symmetric(horizontal: 5.0),
                            ),
                            new Flexible(
                                child: new TextField(
                                  decoration: new InputDecoration(labelText: 'To'),
                                )),
                          ],
                        ),
                      ),
                    ],
                  ),
                ],
              ),
            ),
            new MaterialButton(
              padding: const EdgeInsets.symmetric(vertical: 15.0),
              onPressed: () {},
              color: Theme.of(context).accentColor,
              minWidth: double.infinity,
              child: new Text(
                'APPLY  FILTERS',
                style: new TextStyle(color: Colors.white, fontSize: 16.0, fontWeight: FontWeight.w500),
              ),
            ),
          ],
        );
      }),
    );
返回新脚手架(
appBar:buildFilterAppBar(上下文),
正文:新方向生成器(生成器:(上下文,方向){
返回新列(
儿童:[
新扩展(
子:新列表视图(
儿童:[
buildContentTitle(
上下文,true,Icons.local_offer,,“选择类别”),
新建GridView.count(
crossAxisCount:orientation==orientation.portrait?5:8,
收缩膜:对,
物理学:新NeverscrollableScroll物理学(),
儿童:建筑类别(方向),
),
新专栏(
crossAxisAlignment:crossAxisAlignment.start,
儿童:[
buildContentTitle(上下文、false、null、,
“assets/money_pocket.png”,“设置价格范围”),
新填料(
填充:仅限常量边集(左:44.0),
儿童:新文本(
'价格(\u20B9)',
样式:新文本样式(
颜色:主题。背景。原色深,
字体大小:15.0,
fontWeight:fontWeight.w600),
),
),
新填料(
填充:仅限常量边集(左:44.0,右:12.0),
孩子:新的一排(
儿童:[
新柔性(
孩子:新文本字段(
装饰:新输入装饰(标签文本:“From”),
)),
新容器(
宽度:1.0,
身高:40.0,
颜色:颜色。灰色[700],
边距:常数边集。对称(水平:5.0),
),
新柔性(
孩子:新文本字段(
装饰:新的输入装饰(标签文本:“To”),
)),
],
),
),
],
),
],
),
),
新材料按钮(
填充:常量边集。对称(垂直:15.0),
按下:(){},
颜色:主题。背景。强调颜色,
minWidth:double.infinity,
儿童:新文本(
“应用过滤器”,
样式:新文本样式(颜色:Colors.white,fontSize:16.0,fontwweight:fontwweight.w500),
),
),
],
);
}),
);

除了使用
OrientationBuilder
之外,还有其他选项吗?或者有什么方法可以纠正它吗


提前感谢。

文档中已经说过

OrientationBuilder构建一个小部件树,它可以依赖于父小部件的方向(不同于设备方向)。

在我的情况下,当软键盘打开时,屏幕的宽度将大于高度(请注意,我计算的高度为
全屏高度-软键盘高度

因此,根据文档,OrientationBuilder返回为
横向
,这是
正确的行为

因此,在这种情况下不能使用
OrientationBuilder

为了解决这个问题,我们可以使用从
MediaQuery

MediaQuery.of(context).orientation == Orientation.portrait ? 5 : 8

OrientationBuilder
对我来说非常好。您可能只是重复检查并调试您的应用程序,或者在这里创建一个问题:我已经确定了这一点。当我打开软键盘时,小部件的状态会按预期发生变化。但方向是横向的。谢谢先生分享