美文网首页
flutter Stack(层叠控件)

flutter Stack(层叠控件)

作者: CQ_TYL | 来源:发表于2019-02-19 14:41 被阅读0次

    Stack即层叠布局控件,能够将子控件层叠排列。

    Stack控件的每一个子控件都是定位或不定位,定位的子控件是被Positioned控件包裹的。Stack控件本身包含所有不定位的子控件,其根据alignment定位(默认为左上角)。然后根据定位的子控件的top、right、bottom和left属性将它们放置在Stack控件上。

    class _home extends StatefulWidget {
      @override
      State<StatefulWidget> createState() {
        return _homeState();
      }
    }
    
    class _homeState extends State<_home> {
      @override
      Widget build(BuildContext context) {
        // TODO: implement build
        return new Scaffold(
            appBar: new AppBar(
              title: Text("title"),
              centerTitle: true,
            ),
            body: new Center(
              child: new Stack(
                children: <Widget>[
                  Image.network(
                      "http://a.hiphotos.baidu.com/image/h%3D300/sign=ca66f12cffd3572c79e29adcba116352/3b87e950352ac65cd08fc0b6f6f2b21192138a69.jpg"),
                  new Positioned(
                      top: 20.0,
                      left: 10.0,
                      right: 0.0,
                      bottom: 30.0,
                      child: new Text("Positioned",style:TextStyle(fontSize:18.0,color: Colors.white),)),
                ],
              ),
            ));
      }
    }
    

    相关文章

      网友评论

          本文标题:flutter Stack(层叠控件)

          本文链接:https://www.haomeiwen.com/subject/dytfyqtx.html