#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 добавил