如何在Flutter中拉伸圖像以適合整個背景（100％高度×100％寬度）？

Question

我有一個圖像與我的設備屏幕的寬高比不匹配。我想拉伸圖像，使其完全填充屏幕，並且我不想裁剪圖像的任何部分。

CSS具有百分比的概念，所以我可以將高度和寬度設置爲100％。但是，似乎Flutter沒有這個概念，只是硬編碼高度和寬度是不好的，所以我被卡住了。

這裏是我的（我使用的堆棧，因爲我有在圖像的前景東西）：​​

Widget background = new Container(
    height: // Not sure what to put here! 
    width: // Not sure what to put here! 
    child: new Image.asset(
    asset.background, 
    fit: BoxFit.fill, // I thought this would fill up my Container but it doesn't 
), 
); 

return new Stack(
    children: <Widget>[ 
    background, 
    foreground, 
    ], 
); 

Answer 1

的籌碼在裏面，你應該換你background部件在Positioned.fill。

return new Stack(
    children: <Widget>[ 
    new Positioned.fill(
     child: background, 
    ), 
    foreground, 
    ], 
); 

Answer 2

錯誤的方法在這裏。

改爲使用DecoratedBox。或Container的屬性decoration/foregroundDecoration（然後使用DecoratedBox）。

return new Container(
    decoration: const BoxDecoration(
    image: const DecorationImage(
     fit: BoxFit.fill, 
     image: const AssetImage("images/common/toto.png"), 
    ), 
), 
    child: new Text("Hello"), 
);