Как мне настроить размер ListView.builder для размещения большой верхней панели приложений?

#flutter #flutter-layout

#flutter #flutter-layout

Вопрос:

У меня есть Listview.builder, который создает список, но я хотел бы сделать его либо более гибким, либо знать, как его немного уменьшить, чтобы разместить над ним панель приложений большего размера. В настоящее время я получаю сообщение об ошибке «Переполнено дно» на панели приложений над ListView.Builder, поскольку там недостаточно места. Вот что у меня есть на данный момент для панели приложений и ListView.

Это Listview

  @override
 Widget build(BuildContext context) {
   return Scaffold(
     appBar: FuelAppBar(
       appBar: AppBar(),
     ),
     body: Container(
         height: 200,
         child: ListView.builder(
         itemCount: locations.length,
         shrinkWrap: true,
         itemBuilder: (context, index) {
           return Padding(
             padding: EdgeInsets.symmetric(vertical: 1.0, horizontal: 4.0),
             child: Card(
               color: (index % 2 == 0) ? greycolor : Colors.white,
               child: Container(
                   height: 60,
                   padding: EdgeInsets.fromLTRB(0, 20, 0, 0),
                   child: Row(
                     mainAxisAlignment: MainAxisAlignment.spaceBetween,
                     children: <Widget>[
                       Text(locations[index].date,
                           style: TextStyle(fontSize: 20),
                           textAlign: TextAlign.left),
                       Text(locations[index].location,
                           style: TextStyle(
                               fontSize: 20, fontWeight: FontWeight.bold),
                           textAlign: TextAlign.center),
                       Text(locations[index].amount.toString(),
                           style: TextStyle(fontSize: 20),
                           textAlign: TextAlign.right)
                     ],
                   )
               ),
             ),
           );
         })),
     );
 }
  

Это пользовательская панель приложений

 @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Row(
          children: [
            Container(
              color: Colors.orange,
              margin: EdgeInsets.all(15.0),
              child: FlutterLogo(
                size: 10.0,
              ),
            ),
            Container(
              color: Colors.blue,
              margin: EdgeInsets.all(15.0),
              child: FlutterLogo(
                size: 10.0,
              ),
            ),
            Container(
              color: Colors.purple,
              margin: EdgeInsets.all(15.0),
              child: FlutterLogo(
                size: 10.0,
              ),
            ),
          ],
        ),
        Row(
            children: [
              Container(
                color: Colors.orange,
                margin: EdgeInsets.all(25.0),
                child: FlutterLogo(
                  size: 10.0,
                ),
              ),
              Container(
                color: Colors.blue,
                margin: EdgeInsets.all(25.0),
                child: FlutterLogo(
                  size: 10.0,
                ),
              ),
              Container(
                color: Colors.purple,
                margin: EdgeInsets.all(25.0),
                child: FlutterLogo(
                  size: 10.0,
                ),
              )
            ]
    ),


        Row(
            children: [
              Container(
                color: Colors.orange,
                margin: EdgeInsets.all(25.0),
                child: FlutterLogo(
                  size: 10.0,
                ),
              ),
              Container(
                color: Colors.blue,
                margin: EdgeInsets.all(25.0),
                child: FlutterLogo(
                  size: 10.0,
                ),
              ),
              Container(
                color: Colors.purple,
                margin: EdgeInsets.all(25.0),
                child: FlutterLogo(
                  size: 10.0,
                ),
              ),
            ]),
      ]);


  @override
  Size get preferredSize => new Size.fromHeight(appBar.preferredSize.height);
  }
  

Спасибо всем!

Ответ №1:

Вы можете использовать виджет preferredSize

 class MainApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: PreferredSize(
        preferredSize: Size.fromHeight(136.0),
        child: AppBar(
          automaticallyImplyLeading: false, // hides leading widget
          flexibleSpace: CustomAppBar(),
        ),
      ),
      body: Center(
        child: Text("Hehe"),
      ),
    );
  }
}