需要在我的镜头中容纳gridView

Question

Im正在构建一个显示饮食的应用程序，并具有一个搜索栏来寻找饮食。我无法像在gridviewer外部一样正确地容纳搜索栏。这是我观点的代码及其实际外观。我不想像另一张卡片

body: Container(
          child: GridView.builder(
              padding: EdgeInsets.all(15),
              gridDelegate:
                  SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
              itemCount: dietsForDisplay.length + 1,
              itemBuilder: (BuildContext context, int index) {
                if (diets.length == 0) {
                  return Container(
                    child: Padding(
                      padding: const EdgeInsets.all(60.0),
                      child: Text(
                        "No existen Dietas registradas por la nutrióloga.",
                        style: TextStyle(
                            color: Color(0xFF002D53),
                            fontFamily: 'Montserrat',
                            fontSize: 25,
                            fontWeight: FontWeight.bold),
                        textAlign: TextAlign.center,
                      ),
                    ),
                  );
                } else {
                  return index == 0
                      ? _searchBar()
                      : _listItem(
                          context,
                          index - 1,
                        );
                }
              }),
        ));
  }

并且searchBar和listItem的代码是Cards

Answer 1

将您的物料应用程序包装在安全区域小部件中

https://api.flutter.dev/flutter/widgets/SafeArea-class.html

Answer 2

我建议您用SafeArea包裹您的Scaffold小部件，以使您的应用程序栏不会因缺口而受到阻碍。如果您想在脚手架的身体中添加搜索栏，建议您使用Column将搜索栏放在顶部，将GridView.builder()放在底部。这是我的建议后的样子：

SafeArea(
 child:Scaffold(
  body: Column(
     children: <Widget>[
        //Search Bar here
        Expanded(
          child: //GridView.builder() here
        );
    ],
   ),
  ),
);

*如果您希望该页面可滚动，则将Column替换为ListView