Question 268872 in Flutter Question posted in
The official Flutter documentation can be found here.

Flutter – MainAxisSize.min not working in custom dialog

I’m trying to make my dialog auto-size to fit all it’s content using MainAxisSize.min in my Scaffold Column widget, but I’m still getting the widget at his full length. Why the MainAxisSize.min doesn’t work here?

This is the code of dialog:

class AddSockPopup extends Dialog {
  const AddSockPopup({super.key});

  @override
  Widget build(BuildContext context) {
    return StatefulBuilder(
      builder: (context, StateSetter setState){
        return Dialog(
          elevation: 0,
          backgroundColor: Colors.transparent,
          child: _buildChild(context, setState),
        );
      },
    );
  }

  _buildChild(BuildContext context, StateSetter setState) {
    return ClipRRect(
      borderRadius: BorderRadius.all(Radius.circular(12)),
      child: Scaffold(
        backgroundColor: Colors.grey[300],
        appBar: AppBar(
          title: Text('Sock details'),
          centerTitle: true,
          backgroundColor: Colors.purple[400],
          automaticallyImplyLeading: false,
        ),
        body: Padding(
          padding: EdgeInsets.all(20.0),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [...],
          ),
        ),
      ),
    );
  }
}

This is what I get

Tags:

2

Answers


  1. 0

    Wrap your Scaffold with Column and set mainAxisSize: MainAxisSize.min:

    return ClipRRect(
  borderRadius: BorderRadius.all(Radius.circular(12)),
  child: Column(
    mainAxisSize: MainAxisSize.min,
    children: [
      Scaffold(
        // ...
      ),
    ],
  ),
);
    Login or Signup to reply.
  2. 0

    @Babushka Use the ConstrainedBox widget to allow for dynamic height adjustment of the dialog. It will automatically adjust based on your content.

    ConstrainedBox(
                 
                  constraints: BoxConstraints(
                    minWidth: MediaQuery.of(context).size.width * 0.80,
                    maxWidth: MediaQuery.of(context).size.width * 0.80,
                    minHeight: MediaQuery.of(context).size.height * 0.30,
                  ),

                  child: [Your widget]
         
                ),

    I hope this will help!

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search