方向生成器给出了错误的方向

Vin*_*mar 2 flutter flutter-layout

在我的应用程序中,我使用GridView来显示类别网格和TextField。我想更改基于一行的显示项目数Screen Orientation(即in Portrait mode 5 items per line和in landscape mode 8 items per line)。

我正在尝试通过使用OrientationBuilder小部件来实现这一目标。直到我打开软键盘来编辑TextField之前,它的性能都很好。

但是,当我打开软键盘时,OrientationBuilder返回方向,landscape从而导致溢出问题。

这是我的代码,

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),
              ),
            ),
          ],
        );
      }),
    );
Run Code Online (Sandbox Code Playgroud)

有没有其他选择而不是使用OrientationBuilder或有任何方法可以纠正它?

提前致谢。

Vin*_*mar 9

在文档中已经说过

OrientationBuilder builds a widget tree that can depend on the parent widget's orientation (distinct from the device orientation).

在我打开软键盘的情况下,屏幕的宽度大于高度(请注意,我将高度计算为Full Screen Height - Soft Keyboard height)。

因此OrientationBuilder返回如landscape它是correct behaviour每文档作为。

因此,OrientationBuilder cannot be used对于这种情况。

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

MediaQuery.of(context).orientation == Orientation.portrait ? 5 : 8
Run Code Online (Sandbox Code Playgroud)