PrefferredSize Widget：

PrefferredSize Widget 用于控制 AppBar。 此小部件不會對其子組件施加任何約束，并且不會以任何方式影響子組件的布局。 它隻是宣傳可以由父母使用的首選尺寸。

像 Scaffold 這樣的父母使用 PreferredSizeWidget 來要求他們的孩子實現該接口。 要為任意小部件提供首選大小，以便可以在該類型的子屬性中使用它，可以使用此小部件 PreferredSize。

class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Example', home: Scaffold( appBar: PreferredSize( preferredSize: Size.fromHeight(50.0), // here the desired height child: AppBar( // ... ) ), body: // ... ) ); } }

不再需要使用 PreferredSize。 使用 toolbarHeight 和 flexibleSpace

AppBar 中的 FlexibleSpace 屬性：

此小部件堆疊在工具欄和選項卡欄的後面。 它的高度将與應用欄的整體高度相同。

除非 AppBar 的容器改變了 AppBar 的大小，否則靈活空間實際上并不靈活。 CustomScrollView 中的 SliverAppBar 會在滾動時更改 AppBar 的高度。

AppBar( toolbarHeight: 120, // Set this height flexibleSpace: Container( color: Colors.orange, child: Column( children: [ Text('1'), Text('2'), Text('3'), Text('4'), ], ), ), )

您可以使用 PreferredSize 和 flexibleSpace ：

appBar: PreferredSize( preferredSize: Size.fromHeight(100.0), child: AppBar( automaticallyImplyLeading: false, // hides leading widget flexibleSpace: Container(), ) ),

您可以使用 PreferredSize 和 flexibleSpace ：

appBar: PreferredSize( preferredSize: Size.fromHeight(100.0), child: AppBar( automaticallyImplyLeading: false, // hides leading widget flexibleSpace: SomeWidget(), ) ),

這樣，您可以保持 AppBar 的高度以保持其陰影可見并具有自定義高度，這正是我想要的。 不過，您必須在 Container() 中設置間距。

關注七爪網，獲取更多APP/小程序/網站源碼資源！