应用栏中的Flutter搜索按钮，将新的页面与TabBar项目作为选项

Question

我只是将一个Android应用程序传递给Flutter，当前问题如下：在Android中，当单击搜索按钮时，我有一个带有搜索按钮的片段，显示带有标签布局的新片段，用户可以在其中按标题或用户名搜索书籍，下图显示了外观：

在新片段中，用户可以选择搜索依据并可以对匹配结果进行预可视化。

这是在Flutter中实现这样的最佳方法，我知道开始就是这样：

return Scaffold(
    body: Column(
      children: <Widget>[
        // Page Content 
      ],
    ),
    appBar: AppBar(
      title: Text(this.text),
      actions: <Widget>[
        IconButton(
          onPressed: () {},
          icon: Icon(Icons.search)
        )
      ],
    ),
);

但是我应该如何实现选项卡栏以选择搜索依据以及应用程序栏中的搜索输入文本以使其成为焦点。

Answer 1

return Scaffold(
    body: Column(
      children: <Widget>[
        // Page Content 
      ],
    ),
    appBar: AppBar(
      title: Text(this.text),
      bottom: TabBar(
        tabs: [Text("Books"), Text("Users")],
      ),
      actions: <Widget>[
        IconButton(
          onPressed: () {},
          icon: Icon(Icons.search)
        )
      ],
    ),
);