Flutter 中卡片小部件内的重叠小部件

Question

我想在卡片中放置两个小部件（文本和图片），但是图片应该 go 在卡片上，如图所示：

但我不知道如何使图片与卡片重叠。

这是我的代码：

             Card(
                margin: EdgeInsets.zero,
                color: Theme.of(context).colorScheme.primary,
                clipBehavior: Clip.antiAlias,
                elevation: 0,
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(10),
                ),
                child: Row(
                  children: [
                    Container(
                      alignment: Alignment.bottomLeft,
                      margin: const EdgeInsets.all(12),
                      height: 70,
                      child: Text(
                        "This is a text widget.",
                        style: Theme.of(context).textTheme.bodyText1,
                      ),
                    ),
                    Image.asset(
                      'images/picture1.png',
                      scale: 5,
                    ),
                  ],
                ),
              ),

Answer 1

您可以使用stack小部件和定位小部件来实现 UI

• 堆
  • 卡片
  • 容器

Answer 2

 Card(
          margin: EdgeInsets.zero,
          color: Theme.of(context).colorScheme.primary,
          clipBehavior: Clip.antiAlias,
          elevation: 0,
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(10),
          ),
          child: Stack(
            children: [
              Row(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisAlignment: MainAxisAlignment.spaceAround,
                children: [
                  Container(
                    alignment: Alignment.bottomLeft,
                    margin: const EdgeInsets.all(12),
                    height: 70,
                    child: Text(
                      "This is a text widget.",
                      style: Theme.of(context).textTheme.bodyText1,
                    ),
                  ),
                  Image.asset(
                      'images/picture1.png',
                      scale: 5,
                    ),
                ],
              ),
            ],
          ),
        ),

您可以在卡片小部件下使用堆栈