flutter 提取小部件以创建自己的配置的最佳方法是什么?

rsl1atfo  于 2023-01-27  发布在  Flutter
关注(0)|答案(2)|浏览(122)

假设我希望在许多屏幕中使用相同或非常相似的AppBar
在大多数情况下,为了减少重复代码,我会创建一个新的小部件,它具有我想要的布局/配置。

class MyAppBar extends StatelessWidget {
  final String title;

  const MyAppBar({Key? key, required this.title}) : super(key: key);

  void handlePress(){
    // handle press
  }

  @override
  Widget build(BuildContext context) {
    return AppBar(
      centerTitle: true,
      title: Text(title),
      actions: <Widget>[
        IconButton(onPressed: handlePress, icon: const Icon(Icons.notifications))
      ],
    );
  }
}

但是,如果我尝试在Scaffold中使用此函数,则会出现以下错误:

The argument type 'MyAppBar' can't be assigned to the parameter type 'PreferredSizeWidget?'

我在other solutions中看到人们这样扩展这个小部件:

class IAppBar extends AppBar {
  final String label;

  IAppBar({super.key, required this.label})
      : super(
          title: Text(label),
          centerTitle: true,
          actions: <Widget>[
            IconButton(
              onPressed: handlePress,
              icon: Icon(Icons.notifications),
            ),
          ],
        );

  void handlePress() {
    // handle press
  }
}

这是非常干净和简单的,但会产生以下错误:

The instance member 'handlePress' can't be accessed in an initializer.

是否有一种方法可以为需要特定小部件类型的小部件提供简单、可重用的配置?

bd1hkmkf

bd1hkmkf1#

AppBar projectAppBar(String title)     {
  return AppBar(
        backgroundColor:           ProjectColors.mainColor,
        elevation: 0,
        title: Text(title, style:         FontPath.bold21, textAlign:         TextAlign.center),
centerTitle: true,

                
          ),
  );
}

我总是这样用

ct2axkht

ct2axkht2#

如果要使用简单配置,可以使用以下方式。
在提取AppBar的情况下,我会创建一个返回AppBar的函数。我之所以对AppBar这样说,是因为它实现了PreferredSizeWidget。所以当提取其他小部件时,我总是选择创建Stateless/Stateful小部件。
下面是提取AppBar的演示代码:

getAppBar(String? title, void Function()? onPressed) {
  return AppBar(
    title: Text(title ?? "Demo title"),
    centerTitle: true,
    actions: <Widget>[
      IconButton(
        onPressed: onPressed ?? () {},
        icon: const Icon(Icons.notifications),
      ),
    ],
  );
}

您可以根据自己的选择添加或删除变量,但我只在提取AppBar时使用这种方法。

相关问题