мы можем изменить высоту панели приложения - нижний виджет?

Question

Я получаю эту ошибку переполнения из-за нижнего виджета панели приложения.

Можно ли изменить высоту нижнего виджета?Заранее спасибо.

import 'package:flutter/material.dart';

class Home extends StatefulWidget {
   @override
  _State createState() {
      return new _State();
   }
}

class _Page {
   const _Page({ this.icon, this.text });
   final IconData icon;
   final String text;
}

const List<_Page> _allPages = const <_Page>[
   const _Page(icon: Icons.grade, text: 'TRIUMPH'),
   const _Page(icon: Icons.playlist_add, text: 'NOTE'),
   const _Page(icon: Icons.check_circle, text: 'SUCCESS'),
   const _Page(icon: Icons.question_answer, text: 'OVERSTATE'),
   const _Page(icon: Icons.sentiment_very_satisfied, text: 'SATISFACTION'),
   const _Page(icon: Icons.camera, text: 'APERTURE'),
   const _Page(icon: Icons.assignment_late, text: 'WE MUST'),
   const _Page(icon: Icons.assignment_turned_in, text: 'WE CAN'),

 ];

 class _State extends State<Home> with SingleTickerProviderStateMixin {

   Widget _displayGalleryOne, _topIcons, _locationGallery;

   TabController _controller;
   bool _customIndicator = false;


   @override
   void dispose() {
     _controller.dispose();
     super.dispose();
   }


  @override
  void initState() {

     _displayGalleryOne = new DisplayGalleryOne();

     _locationGallery = new LocationGallery();

     _topIcons = new TopIcons();

     _controller = new TabController(vsync: this, length: _allPages.length);

     super.initState();
  }

  @override
  Widget build(BuildContext context) {


     double width = MediaQuery.of(context).size.width;

return new Scaffold(
  floatingActionButton: new FloatingActionButton(
      onPressed: (){search();},
    child: new Icon(Icons.search),
    backgroundColor: Constants.primaryColor,
  ),
  appBar: new AppBar(
    iconTheme: new IconThemeData(
      color: Constants.primaryColor
    ),
    elevation: 8.0,
    centerTitle: true,
    backgroundColor: Colors.white,
    title: new Text(
      'Ladakh Navigator'.toUpperCase(),
      style: new TextStyle(
          fontSize: Constants.title_font_size,
          fontWeight: FontWeight.w600,
          color: Theme.of(context).primaryColor
      ),
    ),

это нижний виджет, высоту которого я хочу изменить.Также дело в том, что я хочу использовать панель вкладок, больше похожую на панель навигации.поэтому вместо «значка» я использую «IconButton», из-за которого возникает переполнение.

    bottom: new PreferredSize(
        child: new Center(
          child: new TabBar(
            indicatorColor: Colors.transparent,
            labelColor: Constants.primaryColor,
            controller: _controller,
            isScrollable: true,
            labelStyle: new TextStyle(
                fontWeight: FontWeight.w600
            ),
            tabs: _allPages.map((_Page page) {
              return new Tab(text: page.text, icon: new IconButton(icon: new Icon(page.icon, color: Constants.primaryColor, size: 30.0,), onPressed: null));
            }).toList(),
          ),
        ),
        preferredSize: new Size.fromHeight(70.0)
    ),
  ),
  body: new Container(
    child: new LayoutBuilder(
      builder: (BuildContext context, BoxConstraints viewportConstraints) {
        return SingleChildScrollView(
          child: new ConstrainedBox(
            constraints: new BoxConstraints(
              minHeight: viewportConstraints.maxHeight,
            ),
            child: new IntrinsicHeight(
              child: new Column(
                children: <Widget>[
                  /*new Container(
                    height: 90.0,
                    padding: const EdgeInsets.only(left: 10.0),
                    child: new SlidingWidget(_topIcons),
                  ),
                  new Divider(
                    height: 5.0,
                    color: Theme.of(context).dividerColor,
                  ),*/
                  new Container(
                    padding: const EdgeInsets.only(top: 40.0, left: 20.0),
                    width: double.infinity,
                    child: new Text(
                        'top destinations'.toUpperCase(),
                      style: new TextStyle(
                        fontWeight: FontWeight.w600,
                        fontSize: 16.0
                      ),
                      textAlign: TextAlign.left,
                    ),
                  ),
                  new Container(
                    padding: const EdgeInsets.only(top: 5.0, bottom: 10.0),
                    child: new Container(
                      height: 240.0,
                      child: new SlidingWidget(_locationGallery),
                    ),
                  ),
                  new Container(
                    height: 180.0,
                    padding: const EdgeInsets.only(top: 10.0, left: 10.0, right: 10.0, bottom: 10.0),
                    child: new OfferCard(Color(0xFF1976d2)),
                  ),
                  new Container(
                    padding: const EdgeInsets.only(top: 30.0, left: 20.0),
                    width: double.infinity,
                    child: new Text(
                      'popular hotels'.toUpperCase(),
                      style: new TextStyle(
                          fontWeight: FontWeight.w600,
                          fontSize: 16.0
                      ),
                      textAlign: TextAlign.left,
                    ),
                  ),
                  new Container(
                    padding: const EdgeInsets.only(top: 5.0, bottom: 0.0),
                    height: 280.0,
                    child: new SlidingWidget(_displayGalleryOne),
                  ),
                  new Container(
                    padding: const EdgeInsets.only(top: 0.0, left: 10.0, right: 10.0, bottom: 10.0),
                    child: new Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      mainAxisSize: MainAxisSize.max,
                      children: <Widget>[
                        new Container(
                          width: width * .47,
                          padding: const EdgeInsets.only(right: 5.0),
                          child: new OfferCard(Color(0xFFF44336)),
                        ),
                        new Container(
                          width: width * .47,
                          padding: const EdgeInsets.only(left: 5.0),
                          child: new OfferCard(Color(0xFFFFC107)),
                        ),
                      ],

                    ),
                  ),
                  new Container(
                    padding: const EdgeInsets.only(top: 40.0, left: 20.0),
                    width: double.infinity,
                    child: new Text(
                      'famous restaurants'.toUpperCase(),
                      style: new TextStyle(
                          fontWeight: FontWeight.w600,
                          fontSize: 16.0
                      ),
                      textAlign: TextAlign.left,
                    ),
                  ),
                  new Container(
                    padding: const EdgeInsets.only(top: 5.0, bottom: 20.0),
                    height: 280.0,
                    child: new SlidingWidget(_displayGalleryOne),
                  ),
                  new Container(
                    padding: const EdgeInsets.only(top: 10.0, left: 20.0),
                    width: double.infinity,
                    child: new Text(
                      'top adventures'.toUpperCase(),
                      style: new TextStyle(
                          fontWeight: FontWeight.w600,
                          fontSize: 16.0
                      ),
                      textAlign: TextAlign.left,
                    ),
                  ),
                  new Container(
                    padding: const EdgeInsets.only(top: 5.0, bottom: 20.0),
                    height: 280.0,
                    child: new SlidingWidget(_displayGalleryOne),
                  ),
                ],
              ),
            ),
          ),
        );
      },
    ),
  )
);
}

}

Answer 1

Для высоты дна вы можете легко изменить ее высоту и такие элементы:

Scaffold(
   /*This is Floating Action Button*/
   floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
     floatingActionButton: FloatingActionButton(
       child: const Icon(Icons.camera_alt), onPressed: scan),
   /*This is the bottom navigation bar*/
   bottomNavigationBar: BottomAppBar(
     hasNotch: true, /*Creates a notch*/
       child: Row(
         mainAxisSize: MainAxisSize.max,
         mainAxisAlignment: MainAxisAlignment.end,
         children: <Widget>[
           /*Add the Items here*/
           Container(
             /*Padding changes the height*/
             padding: EdgeInsets.all(20.0),
             child: new Icon(Icons.camera),
            )
         ],
       ),
   ),
)

Answer 2

Кажется, вид ошибки.Вы можете использовать Column with children instead of Tab для обхода.У меня все нормально работает.

new Scaffold(
      appBar: new AppBar(
        title: new Text('Network Demo'),
        bottom: new TabBar(
          indicatorColor: Colors.transparent,
          controller: controller,
          tabs: [
            new Column(
              children: <Widget>[
                new IconButton(icon: Icon(Icons.star), onPressed: null),
                new Text('Star'),
              ],
            ),new Column(
              children: <Widget>[
                new IconButton(icon: Icon(Icons.playlist_add), onPressed: null),
                new Text('Add'),
              ],
            ),new Column(
              children: <Widget>[
                new IconButton(icon: Icon(Icons.done), onPressed: null),
                new Text('Done'),
              ],
            ),new Column(
              children: <Widget>[
                new IconButton(icon: Icon(Icons.chat), onPressed: null),
                new Text('Chat'),
              ],
            ),
          ],
        ),
      ),
      body: new Center(
        child: new Wrap(
          children: <Widget>[
            new TextFormField(
              maxLines: null,
              keyboardType: TextInputType.multiline,
              decoration: new InputDecoration(hintText: 'Enter message'),
            ),
          ],
        ),
      ),
    );