没有脚手架的 DefaultTabController?

Jon*_*mez 6 dart flutter flutter-layout

我试图DefaultTabController在一些小部件中间使用。所以我TabBar不能进入AppBar并且必须关闭一些小部件。所以我的问题是当我使用TabBarView它时崩溃......

所以这是一个 Flutter 示例的例子,但没有找到如何在没有Scaffold.

final List<Tab> myTabs = <Tab>[
  Tab(text: 'LEFT'),
  Tab(text: 'RIGHT')];
Run Code Online (Sandbox Code Playgroud)

代码

DefaultTabController(
  length: myTabs.length,
  child: Scaffold(
    appBar: TabBar(
      tabs: myTabs,
    ),
    body: TabBarView(
      children: myTabs.map((Tab tab) {
        final String label = tab.text.toLowerCase();
        return Center(
          child: Text(
            'This is the $label tab',
            style: const TextStyle(fontSize: 36),
          ),
        );
      }).toList(),
    ),
  ),
);
Run Code Online (Sandbox Code Playgroud)

这是我应该做的 TabBar 的另一个示例图像

实码

class ProfileTabBarNavigation extends StatelessWidget {
 final List<Tab> myTabs = <Tab>[
   const Tab(text: kArtwork),
   const Tab(text: kPastJobs)];
@override
Widget build(BuildContext context) {
return DefaultTabController(
  length: 2,
  initialIndex: 0,
  child: Padding(
    padding: kPaddingTabBar,
    child: Container(
      padding: EdgeInsets.all(5.0),
      decoration: BoxDecoration(
        color: kLightGrey,
        borderRadius: BorderRadius.all(
          Radius.circular(50),
        ),
      ),
      child: Column(children: <Widget>[
        TabBar(
          tabs: myTabs,
          unselectedLabelColor: Colors.black54,
          labelColor: Colors.black,
          unselectedLabelStyle: kBoldText,
          labelStyle: kBoldText,
          indicatorSize: TabBarIndicatorSize.tab,
          indicator: BoxDecoration(
            shape: BoxShape.rectangle,
            borderRadius: BorderRadius.circular(50),
            color: Colors.white,
          ),
        ),
        TabBarView(
          children: myTabs.map((Tab tab) {
            final String label = tab.text.toLowerCase();
            return Center(
              child: Text(
                'This is the $label tab',
                style: const TextStyle(fontSize: 36),
              ),
            );
          }).toList(),
        ),
      ]),
    ),
  ),
);
}
}
Run Code Online (Sandbox Code Playgroud)

Kah*_*hou 5

TabBarViewExpanded包裹你。

Expanded(
 child: TabBarView(//...),
),
Run Code Online (Sandbox Code Playgroud)

DartPad试试

  • 不工作:( 我有这个错误&gt;RenderFlex 子项具有非零弯曲,但传入的高度约束是无界的。 (2认同)