在颤动中，底部超载了 248 像素

Posted 2023-05-06

【中文标题】在颤动中，底部超载了 248 像素

【英文标题】：Bottom overloaded by 248 pixels in flutter

【发布时间】：2020-08-09 23:26:08

【问题描述】：

您好，我正在尝试创建一个搜索页面。它对我来说很好。当我打开键盘时，它给了我一个错误底部超载了 248 像素。 This is how its shown on the image

我对如何使用 ScrollView 感到困惑 谁能帮忙演示一下？

---

这是我的代码：

Widget _usersListView() 
   return StreamBuilder<List<Contact>>(
     stream: DBService.instance.getUsersInDB(_searchText),
     builder: (_context, _snapshot) 
       var _usersData = _snapshot.data;
       if (_usersData != null) 
         _usersData.removeWhere((_contact) => _contact.id == _auth.user.uid);
       
       return _snapshot.hasData
           ? Container(
               height: this.widget._height * 0.75,
               child: ListView.builder(
                 itemCount: _usersData.length,
                 itemBuilder: (BuildContext _context, int _index) 
                   var _userData = _usersData[_index];
                   var _currentTime = DateTime.now();
                   var _recepientID = _usersData[_index].id;
                   var _isUserActive = !_userData.lastseen.toDate().isBefore(
                         _currentTime.subtract(
                           Duration(hours: 1),
                         ),
                       );
                   return ListTile(
                     onTap: () 
                       DBService.instance.createOrGetConversartion(
                           _auth.user.uid, _recepientID,
                           (String _conversationID) 
                         NavigationService.instance.navigateToRoute(
                           MaterialPageRoute(builder: (_context) 
                             return ConversationPage(
                                 _conversationID,
                                 _recepientID,
                                 _userData.name,
                                 _userData.image);
                           ),
                         );
                       );
                     ,
                     title: Text(_userData.name),
                     leading: Container(
                       width: 50,
                       height: 50,
                       decoration: BoxDecoration(
                         borderRadius: BorderRadius.circular(100),
                         image: DecorationImage(
                           fit: BoxFit.cover,
                           image: NetworkImage(_userData.image),
                         ),
                       ),
                     ),
                     trailing: Column(
                       mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                       mainAxisSize: MainAxisSize.max,
                       crossAxisAlignment: CrossAxisAlignment.end,
                       children: <Widget>[
                         _isUserActive
                             ? Text(
                                 "Active Now",
                                 style: TextStyle(fontSize: 15),
                               )
                             : Text(
                                 "Last Seen",
                                 style: TextStyle(fontSize: 15),
                               ),
                         _isUserActive
                             ? Container(
                                 height: 10,
                                 width: 10,
                                 decoration: BoxDecoration(
                                   color: Colors.green,
                                   borderRadius: BorderRadius.circular(100),
                                 ),
                               )
                             : Text(
                                 timeago.format(
                                   _userData.lastseen.toDate(),
                                 ),
                                 style: TextStyle(fontSize: 15),
                               ),
                       ],
                     ),
                   );
                 ,
               ),
             )
           : SpinKitWanderingCubes(
               color: Colors.blue,
               size: 50.0,
             );
      ,
     );
    
   

【参考方案1】：

使用 Singlechildscrollview 小部件扭曲您的父小部件 例如：

 body: SingleChildScrollView(
    child: Container(
     put other widgets here
    ))

【参考方案2】：

您必须如下设置 Scaffold 属性。

resizeToAvoidBottomPadding: false,

【参考方案3】：

我建议您可以将整个正文内容包裹在 Singlechildscrollview 小部件中以避免此问题。您可以参考Singlechildscrollview 这里