Question

我尝试了this link，但没有成功。

在这段代码中，当我尝试更改AppBar的高度时，却没有任何改变。

Widget build(BuildContext context) {
  return Scaffold(
    backgroundColor: Colors.transparent,
    body: Container(
      height: double.infinity,
        child: Column(
          children: <Widget>[
            PreferredSize(
              preferredSize: Size.fromHeight(150.0),
              child: AppBar(
                backgroundColor: Colors.white.withOpacity(0.9),
                title: Container(height: 150.0,),
              ),
            )
          ],
        )),
  );
}

注意：AppBar(...)中没有使用我的appBar:

Answer 1

   class MyApp extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
        return new MaterialApp(
        title: 'Flutter Demo',
        theme: new ThemeData(
            primarySwatch: Colors.blue,
        ),
        home: new Scaffold(
            body: Stack(
            children: <Widget>[
            Container(
                color: Colors.blue,
            ),
            new Positioned(
                top: 0.0,
                left: 0.0,
                right: 0.0,
                child: AppBar(
                title: Text('App Bar'),
                backgroundColor: Colors.green,
                ),
            ),
            ],
        )),
        );
    }
    }

Answer 2

您不需要使用Stack和Positioned小部件。

Widget build(BuildContext context) {
  return Scaffold(
    backgroundColor: Colors.transparent,
    body: Container(
      height: double.infinity,
      child: Column(
        children: <Widget>[
          Container(
            height: 150, // height of AppBar
            child: AppBar(
              backgroundColor: Colors.blue.withOpacity(0.9),
              title: Text("AppBar"),
            ),
          )
        ],
      ),
    ),
  );
}

Answer 3

要获得更多控件，请使用 PreferedSize 小部件创建您自己的 appBar

示例：

appBar: PreferredSize(
     preferredSize: Size(100, 80), //width and height 
          // The size the AppBar would prefer if there were no other constraints.
     child: SafeArea(
       child: Container(
         height: 100,
         color: Colors.red,
         child: Center(child: Text('Fluter is great')),
       ),
     ),
),

<块引用>

如果您没有安全区域，请不要忘记使用 SafeArea 小部件

输出：

颤动更改自定义AppBar高度

3 个答案: