如何用Flutter实现该分类板块？尝试后未获正确布局

你的代码存在两个核心问题：

• Positioned组件被放在了Row的子节点中，它只有作为Stack的直接子组件时才能生效
• 没有利用Stack的层叠特性来实现图片超出背景容器的效果

以下是修正后的代码：

Stack(
  clipBehavior: Clip.none, // 允许子组件超出Stack范围显示
  children: [
    Container(
      margin: EdgeInsets.all(15),
      decoration: BoxDecoration(
        color: Color(0xffCBCACD),
        borderRadius: BorderRadius.circular(12),
      ),
      width: 150,
      height: 100,
      alignment: Alignment.centerLeft,
      padding: EdgeInsets.only(left: 16),
      child: Text(
        indexCatName,
        style: TextStyle(fontWeight: FontWeight.bold),
      ),
    ),
    Positioned(
      bottom: 0,
      right: 0,
      child: Image(
        width: 80,
        image: NetworkImage(
            'https://pizzafactory.lk/wp-content/uploads/2017/08/Pizza-Pollo-Alla-Diavola-300x300.png'),
      ),
    ),
  ],
);

关键调整说明：

• 设置clipBehavior: Clip.none，确保图片超出背景容器的部分不会被裁剪
• 将文本直接放在背景容器内，通过alignment和padding控制左侧位置，替代冗余的Row布局
• 把Positioned移到Stack下作为直接子组件，用bottom和right定位图片到右下角，匹配目标布局效果

内容的提问来源于stack exchange，提问作者Afthal Ad