如何制作可无间隙地翻译的全屏背景图像

Question

这将创建一个可以使用边距移动的全屏背景图像，但它会在底部创建一个空白条。

          Container(
            margin: EdgeInsets.only(bottom: 50),
            child: Container(
              decoration: BoxDecoration(
                color: snapshot.data.color,
                image: DecorationImage(
                  image: AssetImage("assets/overlay.png"),
                  fit: BoxFit.cover,
                ),
              ),
            ),
          ),

如何创建一个比视口稍大的全屏幕背景图像，并且能够在没有任何剪裁或间隙的情况下移动它？

Answer 1

这是一个如何设置完整背景图像的示例代码

return new Container(
  child: new Stack(
    children: <Widget>[
     new Container(
       decoration: BoxDecoration(
//             color: snapshot.data.color,
         image: DecorationImage(
//               image: AssetImage("assets/overlay.png"),
              image: NetworkImage('http://www.vactualpapers.com/web/images/April-28-2016/Glitters%20in%20the%20Air%20HD%20Mobile%20Wallpaper.jpg'),
           fit: BoxFit.cover,
         ),
       ),
     ),
      new Scaffold(
        appBar: new AppBar(
          title: new Text('Full Background img'),
          backgroundColor: const Color(0xFF121F2B),
        ),
        backgroundColor: Colors.transparent,
        body: new Center(
          child: new Text('Hello How are you?', 
            style: new TextStyle(fontSize: 20.0, color: Colors.white),),
        ),
      )
    ],
  ),
);