Flutter 如何将小部件代码移动到另一个文件以获得更好的可读性

我有这个Flutter 代码，目前它很短，仍然是可管理的，但我预见到它将在future 非常长，所以我想将代码拆分到单独的文件中.此代码包含位于应用程序左侧的导航栏.我希望将代码的导航轨道部分(从Row小部件开始)转移到另一个文件

//*main.dart*//
class _MainAppState extends State<MainApp> {

  int index = 0;
  bool expanded = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Stack(
          children: <Widget>[
            Padding(
              padding: const EdgeInsets.only(left: 72.0),
              child: Column(
                children: <Widget>[
                  Expanded(
                    child: SfPdfViewer.network(
                      "https://cdn.syncfusion.com/content/PDFViewer/flutter-succinctly.pdf",
                    ),
                  ),
                ],
              ),
            ),
            Row(
              children: <Widget>[
                MouseRegion(
                  onEnter: (PointerEnterEvent event) {
                    expanded = true;
                    setState(() {});
                  },
                  onHover: (PointerHoverEvent event) {},
                  onExit: (PointerExitEvent event) {
                    expanded = false;
                    setState(() {});
                  },
                  child: NavigationRail(
                    selectedIndex: index,
                    extended: expanded,
                    destinations: const <NavigationRailDestination>[
                      NavigationRailDestination(
                        icon: Icon(Icons.one_k),
                        label: Text("one"),
                      ),
                      NavigationRailDestination(
                        icon: Icon(Icons.two_k),
                        label: Text("two"),
                      ),
                      NavigationRailDestination(
                        icon: Icon(Icons.three_k),
                        label: Text("three"),
                      ),
                    ],
                    onDestinationSelected: (int i) {
                      index = i;
                      setState(() {});
                    },
                  ),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}

我试图创建一个返回整个行小部件的函数，但我面临着MouseRegion将无法访问展开的变量和setState函数的问题

//*nav_rail.dart*//
Widget buildNavRail(BuildContext context){
  return 
        Row(
          children: <Widget>[
            MouseRegion(
              onEnter: (PointerEnterEvent event) {
                expanded = true;
                setState(() {});
              },
              onHover: (PointerHoverEvent event) {},
              onExit: (PointerExitEvent event) {
                expanded = false;
                setState(() {});
              },
              child: NavigationRail(
                selectedIndex: index,
                extended: expanded,
                destinations: const <NavigationRailDestination>[
                  NavigationRailDestination(
                    icon: Icon(Icons.one_k),
                    label: Text("one"),
                  ),
                  NavigationRailDestination(
                    icon: Icon(Icons.two_k),
                    label: Text("two"),
                  ),
                  NavigationRailDestination(
                    icon: Icon(Icons.three_k),
                    label: Text("three"),
                  ),
                ],
                onDestinationSelected: (int i) {
                  index = i;
                  setState(() {});
                },
              ),
            ),
          ],
        );
}

我已经通过import 'nav_rail.dart'导入了文件.在Flutter 中做这件事的正确方法是什么？如果无法完成，是否存在类似于C/C++#Include的功能，在该功能中，预处理器会直接将文件内容复制到#Include所在的位置