flutter - TabBar 没有 TabController

Question

我正在尝试向我的应用程序添加一个 tabBar，但在构建它时遇到了一些问题。我已按照文档添加了 tabController，但收到一条错误消息，指出我没有 tabController。我的代码如下。

class _MyAppState extends State<MyApp> with TickerProviderStateMixin {
  TabController _controller;
  final List<Tab> topTabs = <Tab>[
    new Tab(text: 'Profile'),
    new Tab(text: 'Match'),
    new Tab(text: 'Chat'),
  ];

  @override
  void initState() {
   super.initState();

   _controller = TabController(vsync: this, length: 3);
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }


  @override
  Widget build(BuildContext context) {
      return  Scaffold(
            appBar: AppBar(
              title: Text('MyApp'),
              bottom: TabBar(
                  controller: _controller,
                  tabs: topTabs,
              ),
            ),
            body: TabBarView(
                controller: _controller,
                children: [
              new Container(
                color: Colors.lightBlueAccent,
                child: Center(child: Text('Profile', style: TextStyle(color: Colors.white),),),
              ),
              new Container(
                color: Colors.purpleAccent,
                child: Center(child: Text('Match', style: TextStyle(color: Colors.white),),),
              ),
              new Container(
                color: Colors.lightGreenAccent,
                child: Center(child: Text('Chat', style: TextStyle(color: Colors.white),),),
            )
            ]),
          );
  }
}

确切的错误是 flutter :══╡小部件库捕获异常╞═══════════════════════════ ═════ ═══════════════════════════ flutter:构建 MediaQuery(MediaQueryData(size: Size(375.0, 667.0), flutter :devicePixelRatio:2.0，textScaleFactor:1.0，platformBrightness:Brightness.light，填充: flutter :EdgeInsets.zero，viewPadding:EdgeInsets.zero，viewInsets:EdgeInsets.zero，physicalDepth: flutter :1.7976931348623157e+308，alwaysUse24HourFormat:false，accessibilityNavigation:false，highContrast: flutter :假，disableAnimations:假，invertColors:假，boldText:假)): flutter:TabBar 没有 TabController。 flutter:创建 TabBar 时，必须使用“ Controller ”提供显式 TabController flutter: 属性，否则必须保证TabBar上方有一个DefaultTabController。 flutter:在这种情况下，既没有显式 Controller 也没有默认 Controller 。

Answer 1

我可以毫无问题地运行它，您在创建包含 MaterialApp 的项目时是否覆盖了 MyApp 示例，其中包含您的代码或 main 之前的内容？

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: MyAppState()
    );
  }
}

class MyAppState extends StatefulWidget{
  
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyAppState> with TickerProviderStateMixin {
  TabController _controller;
  final List<Tab> topTabs = <Tab>[
    new Tab(text: 'Profile'),
    new Tab(text: 'Match'),
    new Tab(text: 'Chat'),
  ];

  @override
  void initState() {
   super.initState();

   _controller = TabController(vsync: this, length: 3);
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }


  @override
  Widget build(BuildContext context) {
      return  Scaffold(
            appBar: AppBar(
              title: Text('MyApp'),
              bottom: TabBar(
                  controller: _controller,
                  tabs: topTabs,
              ),
            ),
            body: TabBarView(
                controller: _controller,
                children: [
              new Container(
                color: Colors.lightBlueAccent,
                child: Center(child: Text('Profile', style: TextStyle(color: Colors.white),),),
              ),
              new Container(
                color: Colors.purpleAccent,
                child: Center(child: Text('Match', style: TextStyle(color: Colors.white),),),
              ),
              new Container(
                color: Colors.lightGreenAccent,
                child: Center(child: Text('Chat', style: TextStyle(color: Colors.white),),),
            )
            ]),
          );
  }
}