Трепетание | представление вкладок в теле вложенного представления. Как удалить пустое пространство?

#flutter #dart #flutter-layout

Вопрос:

Я использую NestedScrollView, у меня есть TabView в теле. Если виджет в представлении вкладки полупустой, то остается пустое пространство.

Насколько я понимаю, это связано с тем, что мой headerSliverBuilder слишком длинный, а представление вкладок создается на всю высоту экрана.

Я хочу сделать ту же функциональность, что и в профиле Instagram. Просмотр вкладок с записями, сохранениями.

 SafeArea(
  bottom: IphoneHasNotch.hasNotch ? false : true,
  child: NestedScrollView(
    headerSliverBuilder: (context, value) {
       return [
         SliverToBoxAdapter(
           child: Container(
            decoration: BoxDecoration(
              color: Colors.white
            ),
            child: Column(
              children: [
                Padding(
                  padding: const EdgeInsets.only(bottom: 15),
                  child: CreateHeaderWithOutBack(
                    title: 'Profile',
                    action: GestureDetector(
                      onTap: () => showModal(),
                      child: Icon(FeatherIcons.moreVertical, size: getWidth(25)),
                    )                   
                  ),
                ) 
              ]
            )
           )
         ),
         SliverToBoxAdapter(
           child: Column(
             crossAxisAlignment: CrossAxisAlignment.start,
             children: [
               Container(
                 height: getHeight(180),
                  width: MediaQuery.of(context).size.width,
                 child: Stack(
                   children: [
                     
                     ClipRect(
                       child: ImageFiltered(
                         imageFilter: ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0),
                         child: Image.network(userData.avatar != null amp;amp; userData.avatar.length > 0 ? userData.avatar : 'https://klike.net/uploads/posts/2019-05/1556708032_1.jpg',fit: BoxFit.cover, width: MediaQuery.of(context).size.width,height: getHeight(140),)
                        ),
                     ),
                     Positioned.fill(
                       child: Align(
                         alignment: Alignment.bottomLeft,
                         child: InkWell(
                            child: Hero(
                              tag: 'imageHero',
                              child: Container(
                                  margin: EdgeInsets.symmetric(horizontal: 20),
                                  height: getWidth(102),
                                  width: getWidth(102),
                                  decoration: BoxDecoration(
                                    color: Colors.white,
                                    shape: BoxShape.circle
                                  ),
                                  padding: EdgeInsets.all(2),
                                  child: Center(
                                    child: CreateImageAvatar(name: userData.name, url: userData.avatar, size: getWidth(100),)
                                  ),
                                )
                            ),
                            onTap: () {
                              Navigator.push(
                                context,PageRouteBuilder(pageBuilder: (BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation) => DetailScreen(userData.avatars),
                                opaque: false
                              ));
                            },
                          )
                       ),
                     )
                   ],
                 ),
               ),
              Padding(
                
                padding: const EdgeInsets.symmetric(horizontal: 20),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    SizedBox(height: 10),
                    Row(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Flexible(
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Text(userData.name   ', '   userData.age.toString(),
                                style: TextStyle(fontSize: 21, fontWeight: FontWeight.w600),
                              ),
                             
                              userData.city != null  amp;amp; userData.city.length > 0 ? Padding(
                                padding: const EdgeInsets.only(top: 2,bottom: 10),
                                child: Text(userData.city,
                                  style: TextStyle(fontSize: 14, fontWeight: FontWeight.w500, color: kTextColor.withOpacity(0.6)),
                                ),
                              ) : Container(),

                              userData.company != null amp;amp; userData.company.length > 0 ? Padding(
                                padding: const EdgeInsets.only(bottom: 5),
                                child: Row(
                                  crossAxisAlignment: CrossAxisAlignment.center,
                                  children: [
                                    SvgPicture.asset('assets/images/work.svg', color: Color(0xFFBEBEBE), width: getWidth(15),),
                                    SizedBox(width: 5),
                                    Text(userData.company,
                                      style: TextStyle(fontSize: 14, fontWeight: FontWeight.w500, color: Color(0xFFBEBEBE)),
                                    ),
                                  ],
                                ),
                              ) : Container(),
                            ],
                          ),
                        ),
                        widget.id == -1 ?GestureDetector(
                          onTap: (){
                            Provider.of<AppData>(context,listen: false).updateUserDataProfile(userData);
                            Navigator.pushNamed(context, EditProfile.routeName);
                          },
                          child: Container(
                            decoration: BoxDecoration(
                              color: Color(0xFFF6F6F6),
                              borderRadius: BorderRadius.circular(5),
                              border: Border.all(color: Color(0xFFEFEFEF), width: 1)
                            ),
                            padding: EdgeInsets.symmetric(vertical: 8,horizontal: 15),
                            child: Text('Edit',
                              style: TextStyle(color: Color(0xFF9E9E9E), fontWeight: FontWeight.w500, fontSize: getHeight(12)),
                            ),
                            
                          ),
                        ) : Container()
                      ],
                    ),
                   
                    userData.bio != null amp;amp; userData.bio.length > 0 ? Padding(
                      padding: const EdgeInsets.only(top: 5),
                      child: Text(userData.bio,
                        style: TextStyle(fontSize: 14, fontWeight: FontWeight.w500, color: Color(0xFF6D6D6D)),
                      ),
                    ) : Container(),
                    SizedBox(height: 20),
                    Row(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: [
                        CreateBadgeProfile(title: userData.friends.toString(), disc: 'friends',),
                        SizedBox(width: 10),
                        CreateBadgeProfile(title: userData.news.toString(), disc: 'posts',),
                      ],
                    ),
                    
                  ],
                ),
              )
             ],
           ),
         ),
        SliverPadding(
          padding: EdgeInsets.only(top: 25),
          sliver: SliverToBoxAdapter(
            child: Container(
              decoration: BoxDecoration(
              
                border: Border(
                  bottom: BorderSide(
                    color: Color(0xFFEAEAEA),
                    width: 1.0,
                  ),
                ),
              ),
              child: TabBar(
                  indicatorWeight: 2.0,
                  unselectedLabelColor: kTextColor.withOpacity(0.4),
                  labelStyle: TextStyle(fontFamily: 'Gilroy',fontWeight: FontWeight.w500, fontSize: 14, color: kTextColor.withOpacity(0.4)),
                  controller: _tabController,
                  tabs:  <Widget> [
                    Tab(text: 'About'),                       
                    Tab(text: 'Posts'),
              
                  ]                  
                  labelColor: kTextColor,
                  indicatorColor: kPrimaryColor,
                ),
            ),
          ),
        )
       ];
    },
    body: Container(
      child: TabBarView(
        controller: _tabController,
        children: [
          Bio(userData: userData,),
          NewsFeed(id:widget.id,post: 'post'),
         
        ],
      ),
    )
  ),
);
 

Комментарии:

1. можете ли вы добавить образец кода для воспроизведения ошибок?

2. @YeasinSheikh добавил