Question

在Flutter中，我们可以使用Themes来共享颜色和字体样式。 https://flutter.io/docs/cookbook/design/themes

是否存在可以以类似方式使用的现有最佳实践来共享边距，填充和宽度或高度等值？

最好是有助于坚持材料设计准则的东西。

Answer 1

定义自定义小部件

最简单，可能也是最优雅的方法是定义自定义小部件，例如MyRaisedButton在内部使用尺寸正确的RaisedButton。

class MyRaisedButton extends StatelessWidget {
  MyRaisedButton({
    this.child,
    this.onPressed,
  });

  final Widget child;
  final VoidCallback onPressed;

  @override
  Widget build(BuildContext context) {
    return RaisedButton(
      padding: ...,
      onPressed: onPressed,
      child: child
    );
  }
}

在大多数情况下，这种方法效果出奇。但是，如果您仍然希望保持小部件的灵活性（能够将许多自定义选项传递给构造函数），则整个小部件定义很快就会变得很长，因为您需要将所有选项转发到RaisedButton 。在这种情况下，在整个应用程序中实际共享值是很有意义的。

在整个应用中实际共享价值

当然，这种方法也是可行的。由于Flutter的开放性，我们只需要查看how the Theme is implemented并复制该代码即可创建一个自定义的小部件，其功能类似于Theme。这是一个精简版本：

@immutable
class MyThemeData {
  MyThemeData({
    this.myPadding,
    this.myColor,
    this.myString
  });

  final Padding myPadding;
  final Color myColor;
  final String myString;
}

class MyTheme extends StatelessWidget {
  MyTheme({
    Key key,
    @required this.data,
    @required this.child
  }) : super(key: key);

  final MyThemeData data;
  final Widget child;

  static MyThemeData of(BuildContext context) {
    return (context.ancestorWidgetOfExactType(MyTheme) as MyTheme)?.data;
  }

  @override
  Widget build(BuildContext context) => child;
}

现在，您可以将MaterialApp包装在MyTheme小部件中：

MyTheme(
  data: MyThemeData(
    myPadding: ...,
    myColor: ...,
    ...
  ),
  child: ... (here goes the MaterialApp)
)

然后，您可以在应用中的任何地方编写MyTheme.of(context).myPadding。
您可以根据需要调整MyThemeData类，存储所需的任何内容。

在小部件之间共享尺寸

1 个答案: