应用程序栏中同一行中的标签页和操作

时间:2020-06-11 14:51:52

标签: flutter

enter image description here

我正在尝试在应用栏的同一行中实现tabViews和操作,如屏幕抓图所示。该应用程序适用于iPad,因此我可以玩更多的房地产。 AppBar类具有bottom属性,在该属性中我已看到实现了tabViews。操作属性在应用程序栏中位于较高位置。是否必须在应用程序栏中实现选项卡视图?最终,我将如何实施所示的设计。 (过去24小时无需实施)

1 个答案:

答案 0 :(得分:1)

尝试此代码:

DefaultTabController(
    length: 3,
    initialIndex: 0,
    child: Scaffold(
      appBar: AppBar(
        title: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: <Widget>[
            Expanded(
              child: TabBar(
                tabs: [
                  Tab(child: Text('ScreenOne')),
                  Tab(child: Text('ScreenTwo')),
                  Tab(child: Text('ScreenThree'))
                ],
              ),
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.end,
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                IconButton(
                  icon: Icon(MaterialIcons.share),
                  onPressed: (){},
                ),
                IconButton(
                  icon: Icon(MaterialIcons.info),
                  onPressed: (){},
                ),
              ],
            ),
          ],
        ),
      ),
      body: TabBarView(
        children: [
          ScreenOne(),
          ScreenTwo(),
          ScreenThree(),
        ],
      ),
    ),
  )