Flutter实战Stack与Positioned使用详解

最新推荐文章于 2024-07-01 14:30:30 发布

怀旧的老张

最新推荐文章于 2024-07-01 14:30:30 发布

阅读量2.9k

点赞数 3

分类专栏： flutter 文章标签： android flutter

本文为博主原创文章，未经博主允许不得转载。

本文链接：https://blog.csdn.net/Zhang_Teng/article/details/108584262

版权

本文详细介绍了Flutter中的Stack组件和Positioned组件的使用。Stack用于堆叠子组件，Positioned则用于子组件的定位。Stack的alignment属性决定子组件对齐方式，overflow属性控制超出显示区域的处理。Positioned通过left、top、right、bottom设置距离边界的距离，可以指定宽度和高度。文中还提供了一个小案例展示Stack和Positioned的组合使用，帮助理解其工作原理。

摘要由CSDN通过智能技术生成

Stack

Positioned

小案例

Stack

 Stack({
    Key key,
    this.alignment = AlignmentDirectional.topStart,//未指定区域的排布方式
    this.textDirection,
    this.fit = StackFit.loose,//没有定位的子组件如何去适应Stack的大小
    this.overflow = Overflow.clip,
    this.clipBehavior = Clip.hardEdge,//裁剪类型
    List<Widget> children = const <Widget>[],

alignment：此参数决定如何去对齐没有定位（没有使用Positioned）或部分定位的子组件。所谓部分定位，在这里特指没有在某一个轴上定位：left、right为横轴，top、bottom为纵轴，只要包含某个轴上的一个定位属性就算在该轴上有定位。
textDirection：和Row、Wrap的textDirection功能一样，都用于确定alignment对齐的参考系，即：textDirection的值为TextDirectio

最低0.47元/天解锁文章

怀旧的老张

关注

3
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
Flutter实战Stack与Positioned使用详解

StackStack({ this.alignment = AlignmentDirectional.topStart, this.textDirection, this.fit = StackFit.loose, this.overflow = Overflow.clip, List<Widget> children = const <Widget>[],})alignment：此参数决定如何去对齐没有定位（没有使用Positioned）或部分定位
复制链接

扫一扫

专栏目录