PageView is causing unbounded height error-CodePudding

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  void openModal() {
    showModalBottomSheet<dynamic>(
        isScrollControlled: true,
        shape: const RoundedRectangleBorder(
            borderRadius: BorderRadius.only(
                topLeft: Radius.circular(20), topRight: Radius.circular(20))),
        context: context,
        builder: (_) {
          return Wrap(
            children: [
              ModalSheetContent(),
            ],
          );
        });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: FloatingActionButton(
          onPressed: openModal,
          tooltip: 'Increment',
          child: const Icon(Icons.add),
        ),
      ),
    );
  }
}
class ModalSheetContent extends StatefulWidget {
  const ModalSheetContent({Key? key}) : super(key: key);

  @override
  _ModalSheetContentState createState() => _ModalSheetContentState();
}

class _ModalSheetContentState extends State<ModalSheetContent> {
    final PageController pageController = PageController(
    initialPage: 0,
    keepPage: true,
  );

  
  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(20.0),
      child: PageView(
        controller: pageController,
        children: [imageVideo(context), Pricing()],
      ),
    );
  }

I want the modalSheet to take the dynamic height according to its content and not full screen. I tried wrapping PageView with Column and Expanded but it didn't work.

Error:

Viewports expand in the cross axis to fill their container and constrain their children to match their extent in the cross axis. In this case, a horizontal viewport was given an unlimited amount of vertical space in which to expand.The relevant error-causing widget was PageView

CodePudding user response：

PageView must have a height in flutter, usually it takes the biggest part of the screen but in your case you are showing it inside a bottomsheet, I assume that your bottomsheet should be almost full screen, so try to give it a height

final size = MediaQuery.of(context).size;
……
SizedBox(
    height: size.height - 100;
    child: PageView(…),
)

CodePudding user response：

If you want that your bottom sheet takes dynamic height according to its context, simple wrap your widget into column widget and add this attribute.

Column(
mainAxisSize:MainAxisSize.min,
children:[...]
)