如何在颤振中管理"标签栏视图"?



我试图在TabBar中制作TabBarView,但当我把代码放在下面时,它完全变成了白色屏幕,没有任何错误。。Çan我如何解决它?请给我建议并表示感谢。


class Buttons extends StatefulWidget  {
const Buttons({Key? key}) : super(key: key);
@override
State<Buttons> createState() => _ButtonsState();
}
class _ButtonsState extends State<Buttons> with TickerProviderStateMixin {   //  다중 AnimationController를 사용할 때..???
@override
Widget build(BuildContext context)  {
TabController _tabController   = TabController(length: 3, vsync: this);
return Container(
child: Column(
children: [
Container(
child: TabBar(
controller: _tabController,
tabs: [
Tab(icon: ClipRRect(child: Text("Shop"),),),
Tab(icon: ClipRRect(child: Text("Donate"),),),
Tab(icon: ClipRRect(child: Text("BId"),),)
],
),
),
Container(
// width: double.maxFinite,
height: 300,
child: TabBarView(
controller: _tabController,
children: [
ShopPage(),
DonatePage(),
BidPage()
],
)
)
])
);
}
}

在children中,每个页面都在其他文件中,我导入了这些页面。

我已经检查了您的代码,其中有一些更正,所以请尝试下面的代码。我已经检查了下面的代码,它工作得很好。

class Buttons extends StatefulWidget  {
const Buttons({Key? key}) : super(key: key);
@override
State<Buttons> createState() => _ButtonsState();
}
class _ButtonsState extends State<Buttons> with TickerProviderStateMixin {   //  다중 AnimationController를 사용할 때..???
late TabController _tabController;       
@override
Widget build(BuildContext context)  {


@override
void initState() {
// TODO: implement initState
super.initState();
_tabController = TabController(length: 3, vsync: this);
}
return Scaffold(
appBar: AppBar(
centerTitle: false,
title: Text(
'Tabbar Demo',
style: TextStyle(
fontSize: 20
),
),
bottom: PreferredSize(
preferredSize: Size.fromHeight(50),
child: Container(
child: TabBar(
controller: _tabController,
tabs: [
Tab(icon: ClipRRect(child: Text("Shop", style: TextStyle(color: Colors.white),),),),
Tab(icon: ClipRRect(child: Text("Donate", style: TextStyle(color: Colors.white)),),),
Tab(icon: ClipRRect(child: Text("BId", style: TextStyle(color: Colors.white)),),)
],
),
),
),
),
body: SafeArea(
child: Container(
child: Column(
children: [
Expanded(
child: Container(
child: TabBarView(
controller: _tabController,
children: [
Container(color: Colors.red,),
Container(color: Colors.black87,),
Container(color: Colors.yellow,)
],
)
),
)
])
),
)
);
}
}

这是上面代码的输出

如果有任何查询,请告诉我

最新更新