Flutter Web 按钮大小问题

Question

我正在为网络和移动设备创建一个跨平台应用程序。然而，根据平台的不同，按钮具有不同的默认高度。如何在不检查平台的情况下使按钮的高度在移动设备和网页上保持相同的大小？

Answer 1

就我而言，网络上的按钮明显比移动设备上的小。我是padding显式传递的，但是在Flutter框架内部进行了调整。

移动（按预期）：

网址：

按钮代码如下所示：

  @override
  Widget build(BuildContext context) => RaisedButton(
        onPressed: onPressed,
        color: color,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(4),
        ),
        padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 8),
        child: child,
      );

我通过在初始化中设置visualDensity为VisualDensity.standardin解决了这个问题。由于某种原因，默认值为.ThemeDataMaterialAppVisualDensity.compact

class MyApp extends StatelessWidget {
  // ...

  @override
  Widget build(BuildContext context) => MaterialApp(
        // ...
        theme: ThemeData(
          // ...
          visualDensity: VisualDensity.standard,
        ),
        // ...
      );
}

现在，Web 上的大小也符合预期。