如何在SliverAppBar中删除多余的底部空间

问题描述 投票:0回答:1

我正在尝试删除SliverAppBar底部的多余空间。

我的代码是:

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> with TickerProviderStateMixin {
  ScrollController _scrollViewController;
  TabController _tabController;
  double scrollPosition;

  @override
  void initState() {
    _scrollViewController = ScrollController();
    _tabController = TabController(vsync: this, length: 2, initialIndex: 0)
      ..addListener(() => _scrollViewController.animateTo(
            0.0,
            curve: Curves.easeIn,
            duration: const Duration(milliseconds: 300),
          ));
    super.initState();
  }

  @override
  void dispose() {
    _tabController.dispose();
    _scrollViewController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.white,
      child: DefaultTabController(
        length: 2,
        initialIndex: 0,
        child: Scaffold(
          body: NestedScrollView(
            controller: _scrollViewController,
            headerSliverBuilder:
                (BuildContext context, bool innerBoxIsScrolled) {
              return <Widget>[
                SliverAppBar(
                  title: InkWell(
                    child: const Text(kCandice, style: kLogoText),
                    onTap: () => scrollToTop(),
                  ),
                  centerTitle: true,
                  elevation: 0,
                  backgroundColor: Colors.white,
                  pinned: true,
                  floating: true,
                  snap: true,
                  forceElevated: innerBoxIsScrolled,
                  bottom: TabBar(
                    tabs: <Tab>[
                      Tab(
                        text:
                            AppLocalizations.of(context).translate('following'),
                      ),
                      Tab(
                        text:
                            AppLocalizations.of(context).translate('trending'),
                      )
                    ],
                    unselectedLabelColor: Colors.black54,
                    labelColor: kPink,
                    unselectedLabelStyle: kMediumBoldText,
                    labelStyle: kMediumBoldText,
                    indicatorSize: TabBarIndicatorSize.tab,
                    indicatorColor: Colors.transparent,
                    controller: _tabController,
                  ),
                ),
              ];
            },
            body: TabBarView(
              children: [
                PostSection(), // TODO: Following
                PostSection(), // TODO: Trending
              ],
            ),
          ),
        ),
      ),
    );
  }

  void scrollToTop() {
    _scrollViewController.animateTo(
      0.0,
      curve: Curves.easeOut,
      duration: const Duration(milliseconds: 300),
    );
  }
}
flutter flutter-layout
1个回答
0
投票

我找到的解决方案:

MediaQuery.removePadding(
              context: context,
              removeTop: true,
              child: Padding(
                padding: const EdgeInsets.only(top: kCommonSeparation),
                child: TabBarView(
                  children: [
                    PostSection(), // TODO: Following
                    PostSection(), // TODO: Trending
                  ],
                ),
              ),
            ),
© www.soinside.com 2019 - 2024. All rights reserved.