Flutter 基礎控件之Stack 層疊布局

//  CircleAvatar 頭像 alignment和Positioned 不可同時使    用  Positioned(相當于絕對定位 主要應用于多個控件疊加的時候)
  class MyStackWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Center(
    child: Column(
  children: <Widget>[
    Stack(
      // alignment: const FractionalOffset(0.5, 1),
      children: <Widget>[
        new CircleAvatar(
          backgroundImage: new NetworkImage(
              'https://dss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1671247724,3484152546&fm=26&gp=0.jpg'),
          radius: 100.0,
        ),
        Positioned(
          top: 160,
          left: 70,
          child: Container(
            decoration: new BoxDecoration(
              color: Colors.pink,
            ),
            padding: EdgeInsets.all(10.0),
            child: Text('漂亮MM'),
          ),
        ),
        Positioned(
          top: 10,
          left: 160,
          child: Text(
            'VIP',
            style: TextStyle(
              color: Colors.blue,
              fontSize: 25,
            ),
          ),
        ),
      ],
    ),
  ],
));
}
}
效果圖

代碼內部有解釋

?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

友情鏈接更多精彩內容