【问题标题】:how to make widgets float over each other in flutter [closed]如何使小部件在颤动中相互浮动[关闭]
【发布时间】:2021-04-09 09:27:02
【问题描述】:

如何使这两个(如图所示)以这种方式漂浮在卡片上(稍微对齐卡片边框)。

the requested design

这是小部件代码

卡片( 形状:圆角矩形边框( 边界半径:边界半径.圆形(20), ), 海拔:3, //颜色:Colors.orange, 孩子:容器(宽度:140,高度:140, 孩子:Image.asset('assets/c1.png', 规模:1,), ), ),

【问题讨论】:

  • 嗨,欢迎来到堆栈溢出! Stack Overflow 是一个获取代码相关问题答案的平台。我们通常要求您上传您所做的一些工作,包括您编写的代码。我们不会为您提供从头开始的代码。

标签: android flutter dart widget


【解决方案1】:

下面的代码用于创建它。红牌可以是一个图像,并相应地定位。

 Stack(
      overflow: Overflow.visible,
      children: [
        Positioned(
            top: 10,
            right: -20,
            child: Card(
              elevation: 3,
              color: Colors.red.withOpacity(0.5),
              child: Container(width: 30, height: 50),
            )),
        Card(
          elevation: 1,
          color: Colors.purple,
          child: Container(
            width: 250,
            height: 250,
          ),
        ),
        Positioned(
            top: 20,
            left: -20,
            child: Card(
              elevation: 3,
              color: Colors.orange,
          child: Container(width: 80, height: 80),
        )),

        Positioned(
            top: 20,
            right: -20,
            child: Card(
              elevation: 3,
              color: Colors.red,
              child: Container(width: 120, height: 50),
            ))
      ],
    )

【讨论】:

    【解决方案2】:

    试试 Stack 类 - 看起来你想将小部件排列在一起。

    https://api.flutter.dev/flutter/widgets/Stack-class.html

    【讨论】:

      猜你喜欢
      • 2020-05-23
      • 2021-09-22
      • 2021-04-10
      • 1970-01-01
      • 2022-01-25
      • 2019-01-28
      • 1970-01-01
      • 1970-01-01
      • 2023-03-04
      相关资源
      最近更新 更多