如何在flutter中的Appbar下添加Textfield

Question

我正试图在我的绘画应用程序的顶部应用程序栏下添加一个TextField，但我不知道如何添加。我试着在网上寻找解决方案，但没有找到。。。

@override
Widget build(BuildContext context)
{
return Scaffold(
appBar: new AppBar(title: new Center(child: new Text("Draw 1102 - Beta Version", textAlign: TextAlign.center))),
body: 
Column(children: <Widget>[ TextField() ],),  // Does not work
Container( 
child: GestureDetector(
onPanUpdate: (DragUpdateDetails details)
{
setState(()
{
RenderBox _object = context.findRenderObject();
//More code...
});
},

Answer 1

您可以使用PreferredSize小部件作为AppBarsbottom属性。PreferredSize Widget也有一个子窗口，您可以在其中放置TextField。

您只需要手动为PreferredSize找到合适的height。

Answer 2

AppBar我得到了：-https://i.stack.imgur.com/JwYEM.jpg

appBar: AppBar(
toolbarHeight: 110, // Set this height
flexibleSpace: Container(
color: Colors.blue,
child: Column(children: <Widget>[
Row(children: <Widget>[
SizedBox(width: 15),
Icon(Icons.menu, color: Colors.white),
SizedBox(width: 10),
Text("Demo",
style: TextStyle(fontSize: 23, color: Colors.white))
]),
SizedBox(height: 8),
Container(
height: 40,
margin: EdgeInsets.symmetric(horizontal: 20, vertical: 5),
child: TextField(
textAlign: TextAlign.center,
controller: search,
decoration: InputDecoration(
contentPadding:
EdgeInsets.symmetric(vertical: 10, horizontal: 10),
filled: true,
fillColor: Colors.white,
prefixIcon: Icon(Icons.search, color: Colors.black),
border: OutlineInputBorder(
borderRadius:
BorderRadius.all(Radius.circular(40))),
hintStyle: new TextStyle(color: Colors.black38),
hintText: "Search"),
)),
]),
),
)