Flutter中Positioned组件嵌套错误引发Widgets Library异常求助

错误原因 #

报错信息已经明确指出核心问题：

The offending Positioned is currently placed inside a Row widget.
Positioned widgets are placed directly inside Stack widgets.

Positioned是专为Stack设计的组件，它依赖Stack提供的StackParentData来实现定位逻辑。但你把它嵌套在了Row内部，而Row的子组件使用的是FlexParentData，两种父数据类型不兼容，因此触发异常。

修复步骤 #

将Positioned组件从Row的children列表中移出，直接作为Stack的子组件，让Stack能够正确处理它的定位属性。

修改后的代码示例：

body: Container(
  padding: const EdgeInsets.only(top: 25, left: 16, right: 16),
  child: GestureDetector(
    onTap: () {
      FocusScope.of(context).unfocus();
    },
    child: ListView(
      children: [
        Stack(
          children: [
            Row(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisSize: MainAxisSize.max,
              children: [
                Container(
                  width: 80,
                  height: 80,
                  margin: const EdgeInsets.only(left: 25),
                  decoration: BoxDecoration(
                    boxShadow: const [
                      BoxShadow(
                          spreadRadius: 2.0,
                          blurRadius: 10.0,
                          color: Colors.black,
                          offset: Offset(0, 10))
                    ],
                    shape: BoxShape.circle,
                    image: ...
                  ),
                ),
                Container(
                  margin: const EdgeInsets.only(left: 40.0),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        "Naruto",
                        style: TextStyle(
                          color:
                              Theme.of(context).primaryColorLight,
                          fontSize: 20.0,
                        ),
                      ),
                      const SizedBox(
                        height: 5.0,
                      ),
                      Text(
                        "Loreum ipusm",
                        style: TextStyle(
                          color: Theme.of(context).primaryColor,
                          fontSize: 15.0,
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            ),
            // 将Positioned移至此处，作为Stack的直接子组件
            Positioned(
              right: 0.0,
              bottom: 0.0,
              ...  
            ),
          ],
        ),
        Container(
          ...
        ),
      ],
    ),
  ),
),

关键说明 #

• Positioned仅能作为Stack的直接子组件使用，不能嵌套在Row、Column等布局组件内部。
• 若需在Row/Column中实现类似定位的效果，可根据需求选择Align、Padding或Spacer等组件替代。

内容的提问来源于stack exchange，提问作者Shailesh B