虎視眈々と

Flutter × Firebaseを研究するアプリエンジニア

Flutterで上タブを実装する

上タブの実装する方法は下記です。

f:id:superman199323:20190221101450p:plain

下記の実装でいけた。


class _HomeState extends State<Home> with SingleTickerProviderStateMixin {
 
   TabController _tabController;
   List<Widget> _tabs = [
     const Tab(
       child: Text("男性"),
     ),
     const Tab(
       child: Text("女性"),
     )
   ];
 
   @override
   void initState() {
     super.initState();
     _tabController = new TabController(vsync: this, length: _tabs.length);
   }
 
   @override
   Widget build(BuildContext context) {
     return Scaffold(
       appBar: AppBar(
         title: const Text("Home"),
         bottom: TabBar(controller: _tabController, tabs: _tabs),
       ),
       body: TabBarView(
         controller: _tabController,
         children: [
           MensFirebaseML(),
           WomenFirebaseML(),
         ],
       )
     );
   }
 }