Flutter TabBar和TabView不带脚手架，带有固定小部件

我创建了

TabBar

，没有

Appbar

和

Scaffold

以及主题上方的固定小部件。 现在，当我添加

TabBarView

时，

选项卡中没有显示任何内容，所以
我创建了一个方法，该方法从
TabController
获取
Index
，并应显示选项卡。但我无法再次看到任何内容：

 @override
  Widget build(BuildContext context) {
    return Material(
        color: Theme.of(context).backgroundColor,
        child: ListView(children: <Widget>[
          Container(
            height: 320,
            child: new Carousel(
              boxFit: BoxFit.cover,
              images: [
                photoUrl != null
                    ? NetworkImage(photoUrl)
                    : NetworkImage(photoUrl),
              ],
              autoplay: true,
              dotSize: 6,
              indicatorBgPadding: 10,
              dotColor: Theme.of(context).backgroundColor,
              dotBgColor: Theme.of(context).scaffoldBackgroundColor,
              animationCurve: Curves.fastOutSlowIn,
              animationDuration: Duration(microseconds: 1000),
            ),
          ),
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                Padding(
                  padding: const EdgeInsets.all(8.0),
                  child:
                      Text(name, style: Theme.of(context).textTheme.headline),
                ),
                Padding(
                  padding: const EdgeInsets.fromLTRB(8, 4, 0, 6),
                  child:
                      Text(subtitle, style: Theme.of(context).textTheme.body2),
                ),
              ],
            ),
          ),
          Padding(
            padding: const EdgeInsets.fromLTRB(3, 8, 3, 4),
            child: Divider(),
          ),
          TabBar(
            indicatorColor: Theme.of(context).primaryColor,
            labelColor: Theme.of(context).buttonColor,
            labelStyle: Theme.of(context).textTheme.headline,
            unselectedLabelColor: Theme.of(context).splashColor,
            controller: _tabController,
            tabs: tabs.map((e) => Tab(text: e)).toList(),
          ),
          _tabsContent(),
        ]));
  }

选项卡控制器：

  _tabsContent() {
    if (_tabController.index == 0) {
      return MenuTab();
    } else if (_tabController.index == 1) {
      return AboutTab(cuisines, dayOfWeek, start, end, desc);
    } else if (_tabController.index == 2) {
      return ContactTab(
          website,
          email,
          workPhone,
          cellPhone,
          info,
          address1,
          address2,
          address3,
          city,
          country,
          state,
          zipCode,
          latitude,
          longitude,
          socialId,
          socialName,
          url,
          thumbnailsImage);
    }
  }

TabController _tabController;
  List tabs;

  @override
  void dispose() {
    SystemChrome.restoreSystemUIOverlays();
    SystemChrome.setEnabledSystemUIOverlays(SystemUiOverlay.values);
    _tabController.dispose();
    super.dispose();
  }

  void initState() {
    super.initState();
    SystemChrome.setEnabledSystemUIOverlays([]);
    tabs = ['Menu', 'About', 'Contact'];
    _tabController = TabController(length: tabs.length, vsync: this);
  }

首先：将其添加到initState（）中

第二步：创建方法

void _handleTabControllerTick() {
    setState(() {
      _currentIndex = _tabController.index;
    });
  }

第三：将此更改为：

_tabsContent() {
    if (_currentIndex == 0) {
      return Container( child: Text("Menu Tab"));
    } else if (_currentIndex == 1) {
      return Container( child: Text("About Tab"));
    } else if (_currentIndex == 2) {
      return Container( child: Text("Contact Tab"));
    }
  }

另外，请确保您的_tabsContent（）返回了正确的内容

试试下面的代码

import 'package:flutter/material.dart';

class testing extends StatefulWidget {
  @override
  _testingState createState() {
    return _testingState();
  }
}

class _testingState extends State<testing> with SingleTickerProviderStateMixin {

  TabController _tabController;
  List tabs;
  int _currentIndex = 0;

  @override
  void dispose() {

    _tabController.dispose();
    super.dispose();
  }

  void initState() {
    super.initState();

    tabs = ['Menu', 'About', 'Contact'];
    _tabController = TabController(length: tabs.length, vsync: this);
    _tabController.addListener(_handleTabControllerTick);
  }


  void _handleTabControllerTick() {
    setState(() {
      _currentIndex = _tabController.index;
    });
  }


  _tabsContent() {
    if (_currentIndex == 0) {
      return Container( child: Text("Menu Tab"));
    } else if (_currentIndex == 1) {
      return Container( child: Text("About Tab"));
    } else if (_currentIndex == 2) {
      return Container( child: Text("Contact Tab"));
    }
  }


  @override
  Widget build(BuildContext context) {
    return Material(
        color: Theme.of(context).backgroundColor,
        child: ListView(children: <Widget>[
          Container( child: Text("Header")),
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                Padding(
                  padding: const EdgeInsets.all(8.0),
                  child:
                  Text("Name", style: Theme.of(context).textTheme.headline),
                ),
                Padding(
                  padding: const EdgeInsets.fromLTRB(8, 4, 0, 6),
                  child:
                  Text("Subtitle", style: Theme.of(context).textTheme.body2),
                ),
              ],
            ),
          ),
          Padding(
            padding: const EdgeInsets.fromLTRB(3, 8, 3, 4),
            child: Divider(),
          ),
          TabBar(
            indicatorColor: Theme.of(context).primaryColor,
            labelColor: Theme.of(context).buttonColor,
            labelStyle: Theme.of(context).textTheme.headline,
            unselectedLabelColor: Theme.of(context).splashColor,
            controller: _tabController,
            tabs: tabs.map((e) => Tab(text: e)).toList(),
          ),
          _tabsContent(),
        ]));
  }
}

导入“包装：颤振/材料.省道”；
类测试扩展了StatefulWidget{
@凌驾
_testingState createState（）{
返回_testingState（）；
}
}
类_testingState使用SingleTickerProviderStateMixin扩展状态{
TabController\u TabController；
列表选项卡；
int _currentIndex=0；
@凌驾
无效处置（）{
_tabController.dispose（）；
super.dispose（）；
}
void initState（）{
super.initState（）；
tabs=[“菜单”、“关于”、“联系人”]；
_tabController=tabController（长度：tabs.length，vsync:this）；
_tabController.addListener（_handleTabControllerTick）；
}
void _handleTabControllerTick（）{
设置状态（）{
_currentIndex=\u tabController.index；
});
}
_tabsContent（）{
如果（_currentIndex==0）{
返回容器（子：文本（“菜单选项卡”）；
}else if（_currentIndex==1）{
返回容器（子：文本（“关于选项卡”）；
}否则如果（_currentIndex==2）{
返回容器（子项：文本（“联系人选项卡”）；
}
}
@凌驾
小部件构建（构建上下文）{
退货(
颜色：主题。背景色，
子项：列表视图（子项：[
容器（子：文本（“标题”），
填充物(
填充：常数边集全部（8.0），
子：列(
crossAxisAlignment:crossAxisAlignment.start，
儿童：[
填充物(
填充：常数边集全部（8.0），
儿童：
文本（“名称”，样式：Theme.of（context.textTheme.headline），
),
填充物(
填充：LTRB（8,4,0,6）中的常量边集，
儿童：
文本（“字幕”，样式：Theme.of（context.textTheme.body2），
),
],
),
),
填充物(
填充：LTRB（3,8,3,4）中的常数边集，
子：分隔符（），
),
塔巴(
指示色：主题。背景。原色，
标签颜色：主题。背景。按钮颜色，
labelStyle:Theme.of（context）.textTheme.headline，
未选择的LabelColor:Theme.of（context）.splashColor，
控制器：\ tab控制器，
tabs:tabs.map（（e）=>Tab（text:e））.toList（），
),
_选项卡内容（），
]));
}
}
杰伊解释得很好。为我工作！！
import 'package:flutter/material.dart';

class testing extends StatefulWidget {
  @override
  _testingState createState() {
    return _testingState();
  }
}

class _testingState extends State<testing> with SingleTickerProviderStateMixin {

  TabController _tabController;
  List tabs;
  int _currentIndex = 0;

  @override
  void dispose() {

    _tabController.dispose();
    super.dispose();
  }

  void initState() {
    super.initState();

    tabs = ['Menu', 'About', 'Contact'];
    _tabController = TabController(length: tabs.length, vsync: this);
    _tabController.addListener(_handleTabControllerTick);
  }


  void _handleTabControllerTick() {
    setState(() {
      _currentIndex = _tabController.index;
    });
  }


  _tabsContent() {
    if (_currentIndex == 0) {
      return Container( child: Text("Menu Tab"));
    } else if (_currentIndex == 1) {
      return Container( child: Text("About Tab"));
    } else if (_currentIndex == 2) {
      return Container( child: Text("Contact Tab"));
    }
  }


  @override
  Widget build(BuildContext context) {
    return Material(
        color: Theme.of(context).backgroundColor,
        child: ListView(children: <Widget>[
          Container( child: Text("Header")),
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                Padding(
                  padding: const EdgeInsets.all(8.0),
                  child:
                  Text("Name", style: Theme.of(context).textTheme.headline),
                ),
                Padding(
                  padding: const EdgeInsets.fromLTRB(8, 4, 0, 6),
                  child:
                  Text("Subtitle", style: Theme.of(context).textTheme.body2),
                ),
              ],
            ),
          ),
          Padding(
            padding: const EdgeInsets.fromLTRB(3, 8, 3, 4),
            child: Divider(),
          ),
          TabBar(
            indicatorColor: Theme.of(context).primaryColor,
            labelColor: Theme.of(context).buttonColor,
            labelStyle: Theme.of(context).textTheme.headline,
            unselectedLabelColor: Theme.of(context).splashColor,
            controller: _tabController,
            tabs: tabs.map((e) => Tab(text: e)).toList(),
          ),
          _tabsContent(),
        ]));
  }
}