Flutter Stack manner relative layout positioning

Disclaimer: This article is a blogger original article, shall not be reproduced without the bloggers allowed. https://blog.csdn.net/qq_27981847/article/details/90239049

Stack the record about the layout, the positioning of two ways

child: new Column(
          children: <Widget>[
            new SizedBox(height: 20.0),
            new Stack(
              alignment: const FractionalOffset(0.9, 0.1),//方法一
              children: <Widget>[
                new Image(
                  image: new AssetImage("assets/images/illustration_11.jpg"),
                  width: 300.0,
                  height: 200.0,
                  fit: BoxFit.cover,
                ),
                child: new Icon(Icons.share, color: Colors.white),
              ],
            ),
            new SizedBox(height: 20.0),
            new Stack(
              children: <Widget>[
                new Image(
                  image: new AssetImage("assets/images/illustration_11.jpg"),
                  width: 300.0,
                  height: 200.0,
                  fit: BoxFit.cover,
                ),
                new Positioned(//方法二
                  right: 15.0,
                  top: 15.0,
                  child: new Icon(
                    Icons.share,
                    color: Colors.white,
                  ),
                ),
              ],
            )
          ],
        ),
        

method one

使用alignment配合FractionalOffset: For FractionalOffset parameters, equivalent weight, the first representative of a transverse weight, a second weight of representation vertical, horizontal position 0.9 represents nine-tenths of the lateral, vertical 0.1 represents a vertical one very position

Method Two

使用定位组件PositionedWherein the top, right, buttom, left, directly representing the distance from the direction