Flutter - resizeToAvoidBottomInset 属性使我的 ListView 被键盘覆盖

Question

我会从一开始就描述我的问题。我有一个带有 BottomNavigationBar、ListView 和自定义搜索小部件的页面（在其中使用 TextField）。每当我使用搜索小部件时，键盘就会出现并带来不必要的白框（我已经浏览了很多这个问题，并通过使用 resizeToAvoidBottomInset: false 作为我的 Scaffold 属性找到了这个修复。使用该属性修复了白框问题，但它给出了一个新问题：我的 ListView 的下半部分现在被键盘挡住了，因为当键盘出现时 ListView 的高度没有得到调整。

这是我的查看代码：

@override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        FocusManager.instance.primaryFocus?.unfocus();
      },
      child: SafeArea(
          child: Scaffold(
            resizeToAvoidBottomInset: false,
              body: Column(
                  mainAxisSize: MainAxisSize.min,
                  children: <Widget>[
                    Container(
                      width: double.infinity,
                      margin: EdgeInsets.all(16),
                      child: const Text("Inventory",
                          textAlign: TextAlign.center,
                          style: TextStyle(
                              fontFamily: "Quicksand",
                              fontSize: 20,
                              fontWeight: FontWeight.w700)),
                    ),
                    Container(
                      child: _buildSearch(),
                    ),
                    Flexible(
                        child: Container(
                          child: FutureBuilder(
                              future: _fetchData(),
                              builder: (context, AsyncSnapshot snapshot) {
                                if (isFiltered) {
                                  isFiltered = false;
                                  return ListView.builder(
                                    // itemCount: snapshot.data.length,
                                    physics: BouncingScrollPhysics(),
                                    itemCount: arrFilteredStock.length,
                                    itemBuilder: (context, index) {
                                      var id = arrFilteredStock[index].id;
                                      var code = arrFilteredStock[index].itemCode;
                                      var comname = arrFilteredStock[index].itemComname;
                                      var unit = arrFilteredStock[index].itemUnit;
                                      var qty =
                                          arrFilteredStock[index].itemStockBalanceQty;
                                      return StockCard(
                                          stock: Stock(id, code, comname, unit, qty));
                                    },
                                  );
                                } else {
                                  if (snapshot.data == null) {
                                    return Container(
                                        child: const Center(
                                          child: Text("Loading..."),
                                        ));
                                  } else {
                                    return ListView.builder(
                                      physics: BouncingScrollPhysics(),
                                      itemCount: snapshot.data.length,
                                      itemBuilder: (context, index) {
                                        var id = snapshot.data[index].id;
                                        var code = snapshot.data[index].itemCode;
                                        var comname = snapshot.data[index].itemComname;
                                        var unit = snapshot.data[index].itemUnit;
                                        var qty =
                                            snapshot.data[index].itemStockBalanceQty;
                                        return StockCard(
                                            stock: Stock(id, code, comname, unit, qty));
                                      },
                                    );
                                  }
                                }
                              }),
                        )
                    )
                  ]))),
    );
  }

Answer 1

我找到了一个临时解决方案： 白色必备的白框不见了，ListView 可以一直滚动到里面的最后一条数据。唯一的问题是滚动到ListView的最终数据后，白框再次出现。我认为这比其他解决方案更好。

这是修改后的代码：

@override
  Widget build(BuildContext context) {
    final bottom = MediaQuery.of(context).viewInsets.bottom;
    return GestureDetector(
      onTap: () {
        FocusManager.instance.primaryFocus?.unfocus();
      },
      child: SafeArea(
          child: Scaffold(
              resizeToAvoidBottomInset: false,
              body: Column(mainAxisSize: MainAxisSize.max, children: <Widget>[
                Container(
                  width: double.infinity,
                  margin: EdgeInsets.all(16),
                  child: const Text("Inventory",
                      textAlign: TextAlign.center,
                      style: TextStyle(
                          fontFamily: "Quicksand",
                          fontSize: 20,
                          fontWeight: FontWeight.w700)),
                ),
                Container(
                  child: _buildSearch(),
                ),
                Flexible(
                    child: Container(
                  child: FutureBuilder(
                      future: _fetchData(),
                      builder: (context, AsyncSnapshot snapshot) {
                        if (isFiltered) {
                          isFiltered = false;
                          return ListView.builder(
                            // itemCount: snapshot.data.length,
                            padding: EdgeInsets.only(bottom: bottom),
                            physics: BouncingScrollPhysics(),
                            itemCount: arrFilteredStock.length,
                            itemBuilder: (context, index) {
                              var id = arrFilteredStock[index].id;
                              var code = arrFilteredStock[index].itemCode;
                              var comname = arrFilteredStock[index].itemComname;
                              var unit = arrFilteredStock[index].itemUnit;
                              var qty =
                                  arrFilteredStock[index].itemStockBalanceQty;
                              return StockCard(
                                  stock: Stock(id, code, comname, unit, qty));
                            },
                          );
                        } else {
                          if (snapshot.data == null) {
                            return Container(
                                child: const Center(
                              child: Text("Loading..."),
                            ));
                          } else {
                            return ListView.builder(
                              padding: EdgeInsets.only(bottom: bottom),
                              physics: BouncingScrollPhysics(),
                              itemCount: snapshot.data.length,
                              itemBuilder: (context, index) {
                                var id = snapshot.data[index].id;
                                var code = snapshot.data[index].itemCode;
                                var comname = snapshot.data[index].itemComname;
                                var unit = snapshot.data[index].itemUnit;
                                var qty =
                                    snapshot.data[index].itemStockBalanceQty;
                                return StockCard(
                                    stock: Stock(id, code, comname, unit, qty));
                              },
                            );
                          }
                        }
                      }),
                )),
              ]))),
    );
  }

这只是一个临时解决方案。任何解决方案将不胜感激。

Answer 2

当您添加数据时，在字段顶部的代码中添加此填充 键盘首先出现在容器中，然后检查其他区域我解决了添加此问题的相同问题

   Padding(
         padding: EdgeInsets.only(
         bottom: MediaQuery.of(context).viewInsets.bottom));