Flutter中ListView嵌套Expanded仍报无限高度错误的求助

你的核心问题是Column子项的约束传递错误：你把Expanded嵌套在了Container内部，但Container本身作为Column的直接子项没有被Expanded包裹，导致Container的垂直高度是无界的，内部的ListView无法获得合法的高度约束，从而触发错误。

修复步骤 #

1. 将Expanded直接作为Column的子项，用来包裹后续的Stack（包含ListView和悬浮按钮），让它占据Column中myAppBar下方的所有剩余空间
2. 后续添加悬浮按钮时，直接在Stack中加入Positioned组件即可，不会影响ListView的布局约束

修改后的完整代码 #

import 'package:flutter/material.dart';
import 'package:flutter/src/widgets/container.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:my/model.dart';
import 'package:my/widgets/menucard.dart';
import 'package:my/screens/my1.dart';
import 'package:my/screens/my2.dart';
import 'package:my/screens/my3.dart';
import 'package:my/provider.dart';

class myAppBar extends StatelessWidget {
  myAppBar(
      {super.key,
      required double height,
      required String title,
      bool autoImplyBack = true})
      : _height = height,
        _title = title,
        _autoback = autoImplyBack;

  @override
  Widget build(BuildContext context) {
    return Container(
      width: double.infinity,
      height: _height,
      color: Colors.pink,
      child: SizedBox(
        width: double.infinity,
        height: _height,
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            SizedBox(
              width: _height,
              height: _height,
              child: Navigator.canPop(context) && _autoback
                  ? IconButton(
                      onPressed: () {
                        Navigator.pop(context);
                      },
                      icon: Icon(Icons.arrow_back),
                    )
                  : null,
            ),
            Center(
              child: Text(_title),
            ),
            SizedBox(
              width: _height,
              height: _height,
              child: IconButton(
                onPressed: () {
                  Navigator.pop(context);
                },
                icon: Icon(Icons.close),
              ),
            ),
          ],
        ),
      ),
    );
  }

  double _height;
  String _title;
  bool _autoback;
}

class myMenu extends StatelessWidget {
  const myMenu({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          myAppBar(height: 100, title: 'Menu'),
          // 直接用Expanded包裹Stack，占据Column剩余空间
          Expanded(
            child: Container(
              color: Colors.teal,
              child: Stack(
                children: [
                  // ListView作为Stack底层，充满整个Expanded空间
                  ListView(
                    children: [
                      MenuCard(
                          icondata: Icons.circle,
                          subMenu: 'my1',
                          onTap: () {
                            Navigator.push(
                              context,
                              MaterialPageRoute(
                                  builder: (context) => const my1()),
                            );
                          }),
                      MenuCard(
                          icondata: Icons.circle,
                          subMenu: 'my2',
                          onTap: () {
                            Navigator.push(
                              context,
                              MaterialPageRoute(
                                  builder: (context) => const my2()),
                            );
                          }),
                      MenuCard(
                          icondata: Icons.circle,
                          subMenu: 'my3',
                          onTap: () {
                            Navigator.push(
                              context,
                              MaterialPageRoute(
                                  builder: (context) => const my3()),
                            );
                          }),
                      MenuCard(
                          icondata: Icons.circle,
                          subMenu: 'log out',
                          onTap: () {
                            Navigator.push(
                              context,
                              MaterialPageRoute(
                                  builder: (context) => const my1()),
                            );
                          }),
                    ],
                  ),
                  // 示例：添加悬浮按钮，可根据需求调整位置
                  Positioned(
                    bottom: 20,
                    right: 20,
                    child: FloatingActionButton(
                      onPressed: () {},
                      child: Icon(Icons.add),
                    ),
                  )
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}

额外说明 #

• 不需要设置shrinkWrap: true，因为Expanded已经给Stack和ListView提供了明确的高度约束，性能更优
• Stack中，后添加的组件会覆盖在前面的组件上方，所以悬浮按钮放在ListView之后即可实现悬浮效果

内容的提问来源于stack exchange，提问作者Ketto Egy