我需要在Flutter应用中更改应用栏的高度。我使用以下代码:
Widget build(BuildContext context) {
return Scaffold(
appBar: PreferredSize(
preferredSize: Size.fromHeight(100.0),
child: AppBar(
automaticallyImplyLeading: false,
flexibleSpace: Container(),
centerTitle: true,
title: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Icon(Icons.search),
Icon(Icons.home),
PopupMenuButton<String>(
icon: Icon(Icons.menu),
itemBuilder: (BuildContext context) => <PopupMenuEntry<String>>[
PopupMenuItem<String>(
value: "1",
child: Text('Hello'),
),
PopupMenuItem<String>(
value: "2",
child: Text('World'),
),
]
)
],
),
),
),
body: Container());
}
这是我的结果:
高度已更改,但我需要将内容垂直居中对齐。 我尝试了这个选项,但是不起作用:
automaticallyImplyLeading: false,
flexibleSpace: Container(),
centerTitle: true,
有人建议吗?
答案 0 :(得分:3)
尝试一下
Widget build(BuildContext context) {
return Scaffold(
appBar: PreferredSize(
preferredSize: Size.fromHeight(100.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
AppBar(
elevation: 0.0,
automaticallyImplyLeading: false,
flexibleSpace: Container(),
centerTitle: true,
title: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Icon(Icons.search),
Icon(Icons.home),
PopupMenuButton<String>(
icon: Icon(Icons.menu),
itemBuilder: (BuildContext context) => <PopupMenuEntry<String>>[
PopupMenuItem<String>(
value: "1",
child: Text('Hello'),
),
PopupMenuItem<String>(
value: "2",
child: Text('World'),
),
]
)
],
),
),
],
),
),
body: Container());
}
答案 1 :(得分:2)
https://dartpad.dartlang.org/115b02f36456fe9579cb8daf092bd906
class MyAppBar extends StatelessWidget with PreferredSizeWidget {
final double appBarHeight = 120.0;
@override
get preferredSize => Size.fromHeight(appBarHeight);
@override
Widget build(BuildContext context) {
return Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
AppBar(
automaticallyImplyLeading: false,
elevation: 0,
title: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Icon(Icons.search),
Icon(Icons.home),
PopupMenuButton<String>(
icon: Icon(Icons.menu),
itemBuilder: (BuildContext context) =>
<PopupMenuEntry<String>>[
PopupMenuItem<String>(
value: "1",
child: Text('Hello'),
),
PopupMenuItem<String>(
value: "2",
child: Text('World'),
),
],
),
],
),
),
],
),
decoration: BoxDecoration(
boxShadow: <BoxShadow>[
BoxShadow(
color: Colors.black54,
blurRadius: 15.0,
offset: Offset(0.0, 0.75))
],
color:
ThemeData.dark().appBarTheme.color ?? ThemeData.dark().primaryColor,
),
);
}
}
答案 2 :(得分:1)
尝试一下
@override
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
appBar: PreferredSize(
preferredSize: Size.fromHeight(100.0),
child: AppBar(
automaticallyImplyLeading: false,
flexibleSpace: Container(),
centerTitle: true,
title: Padding(
padding: const EdgeInsets.only(top:25.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Icon(Icons.search),
Icon(Icons.home),
PopupMenuButton<String>(
icon: Icon(Icons.menu),
itemBuilder: (BuildContext context) => <PopupMenuEntry<String>>[
PopupMenuItem<String>(
value: "1",
child: Text('Hello'),
),
PopupMenuItem<String>(
value: "2",
child: Text('World'),
),
]
)
],
),
),
),
)
),
);
}