如何应对SliverAppBar的flexibleSpace内部的抖动？

问题描述

我有在CustomScroll视图中滚动的SliverAppBar，我意识到一旦添加文本并开始滚动SliverAppBar的底部，便开始溢出。

我想要的行为是，当我开始滚动Sliver App Bar时，也必须立即开始滚动，以确保没有溢出。（应用栏和标签栏之间的距离必须始终保持不变）

正如您在赠予中所看到的那样，一旦我开始滚动文本，就会溢出。 Here是我的意思。

构建方法：

      @override
  Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomPadding: false,body: NestedScrollView(
        controller: _scrollViewController,headerSliverBuilder: (BuildContext context,bool boxIsScrolled) {
          return <Widget>[
            SliverAppBar(
              backgroundColor: Colors.green,pinned: true,floating: true,expandedHeight: 400,forceElevated: boxIsScrolled,flexibleSpace: Column(
                children: <Widget>[
                  Stack(
                    alignment: Alignment.center,overflow: Overflow.visible,children: <Widget>[
                      Image(
                        fit: BoxFit.cover,height: MediaQuery.of(context).size.height / 4,width: MediaQuery.of(context).size.width,image: NetworkImage(
                            'https://image.freepik.com/free-photo/soccer-field-spotlight-background-stadium_46250-1363.jpg'),),Positioned(
                        width: MediaQuery.of(context).size.width,bottom: -75,child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceEvenly,children: <Widget>[
                            Padding(
                              padding: const EdgeInsets.only(top: 45),child: Text.rich(
                                TextSpan(
                                  children: <TextSpan>[
                                    TextSpan(
                                      text: '22K',style: TextStyle(
                                          fontSize: 20,color: Colors.black87,fontWeight: FontWeight.bold),TextSpan(text: '\n'),TextSpan(
                                      text: 'Connections',style: TextStyle(color: Colors.black87),],textAlign: TextAlign.center,style: DefaultTextStyle.of(context).style,ClipRRect(
                              borderRadius: BorderRadius.circular(40),child: Image(
                                width: 130,height: 130,image: NetworkImage(
                                  'https://lookyourbestbeyourbest.files.wordpress.com/2011/11/image-3.jpeg',Padding(
                              padding: const EdgeInsets.only(top: 45),child: Text.rich(
                                TextSpan(
                                  children: <TextSpan>[
                                    TextSpan(
                                      text: '12K',SizedBox(
                    height: 85,Container(
                    child: RichText(
                      text: TextSpan(
                        text: 'John Dory',style: TextStyle(
                          color: Colors.black,fontWeight: FontWeight.bold,fontSize: 20,bottom: TabBar(
                tabs: <Widget>[
                  Tab(
                    text: "Home",icon: Icon(Icons.home),Tab(
                    text: "Example page",icon: Icon(Icons.help),)
                ],controller: _tabController,)
          ];
        },body: TabBarView(
          children: <Widget>[
            PageOne(),PageTwo(),floatingActionButton: FloatingActionButton(
        child: Icon(Icons.control_point),onPressed: () {
          _tabController.animateTo(1,curve: Curves.bounceInOut,duration: Duration(milliseconds: 10));

      
          _scrollViewController
              .jumpTo(_scrollViewController.position.maxScrollExtent);
        },);
  }
}

对不起，这么多代码。谢谢

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

dart flutter-layout