为什么BoxFit枚举无法按预期工作？

Question

我正在尝试用图像覆盖整个画布。为此，我使用了BoxFit.cover枚举。但这不起作用。

代码：

    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          home: Scaffold(
            body: 
                Image(
                  image: AssetImage("assets/choco.jpg"),
                  fit: BoxFit.cover,
                ),
          ),
        );
      }
    }

输出屏幕截图：

为什么它不能覆盖整个屏幕？ BoxFit枚举值均无效。请详细说明。谢谢。

Answer 1

Stack还具有fit属性，因此将其设置为StackFit.expand。

Stack(
  fit: StackFit.expand,
  ...

此处有更多信息：https://codepen.io/alockwood05/pen/vMpdmZ

如果您没有父窗口小部件Image，请尝试使用height和width属性。

   Image(
              image: AssetImage("assets/choco.jpg"),
              height: MediaQuery.of(context).size.height,
              width: MediaQuery.of(context).size.width,
              fit: BoxFit.cover,
            ),

Answer 2

图像不知道要覆盖的宽度。 用 Container() 包裹您的图像并为其设置宽度：double.infinity,。

Container(
    width: double.infinity,
    child: Image(
            image: AssetImage("assets/choco.jpg"),
            fit: BoxFit.cover,
           ),
),