flutter pub add overlapping_panels根據套件公開資料產生的選型評估，僅供參考。
OverlappingPanels 是一個 Flutter 套件，讓開發者能夠實作受到 Discord 移動介面啟發的左右導航面板。它支援基於手勢的面板揭露動畫，並提供回呼函數來監控面板狀態變更。適用於需要直覺、可滑動側邊導航，並在 Android、iOS、Web、macOS、Windows 與 Linux 等多個平台實現順暢過渡的應用程式。
以下為關聯原始碼儲存庫的 README 原文快照，最新內容請造訪原始碼儲存庫。
Add Discord-like navigation to your app. Demo project here: overlapping_panels_demo
This widget does not support navigation events yet. So pressing the back button, does not slide the main panel back into view. This feature will be implemented in the nearest future.
Simple and straight to the point. Just provide usual widgets for all panels:
class _MyHomePageState extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Stack(
children: [
OverlappingPanels(
// Using the Builder widget is not required. You can pass your widget directly.
// But to use `OverlappingPanels.of(context)` you need to wrap your widget in a Builder
left: Builder(builder: (context) {
return const LeftPage();
}),
right: Builder(
builder: (context) => const RightPage(),
),
main: Builder(
builder: (context) {
return const MainPage();
},
),
onSideChange: (side) {
setState(() {
if (side == RevealSide.main) {
// hide something
} else if (side == RevealSide.left) {
// show something
}
});
},
),
],
);
}
}
To be able to reveal a panel with the tap of a button, for example, do:
IconButton(
icon: const Icon(Icons.menu),
onPressed: () {
// This is the main point
OverlappingPanels.of(context)?.reveal(RevealSide.left);
},
)