flutterdartflutter-layoutflutter-dialog

TextField inside Wrap throws "The _RenderDecoration class does not support dry layout"


I need a TextField inside Wrap widget. But it throws this error,

The _RenderDecoration class does not support dry layout

....

....

════════ Exception caught by scheduler library ════════

Updated layout information required for RenderFlex#87b02 relayoutBoundary=up7 NEEDS-LAYOUT NEEDS-PAINT to calculate semantics.

The Parent of the Wrap widget is a Column with mainAxisSize.min. And the Column is inside an AlertDialog's content. And also I need dynamic height. So, I didn't use any fixed height SizedBox. Here is the code example,

AlertDialog(
  scrollable: true,
  content: Column(
    mainAxisSize: MainAxisSize.min,
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      SomeWidgets(),
      Wrap(
        spacing: 5,
        runSpacing: 5,
        crossAxisAlignment: WrapCrossAlignment.center,
        children: [
          Text(t.someText),
          Container(
            width: 50.0,
            height: 50.0,
            color: theme.colorScheme.primary,
            alignment: Alignment.center,
            child: TextField(
              textAlign: TextAlign.center,
              keyboardType: TextInputType.number,
              controller: _controller,
              decoration: const InputDecoration(
                contentPadding: EdgeInsets.fromLTRB(0, 5, 0, 5),
                isDense: true,
                filled: true,
              ),
              onChanged: (v) {},
            ),
          ),
          Text(t.someText),
        ],
      ),
      SomeWidgets(),
    ],
  ),
)

Solution

  • Wrap your Wrap widget with Flexible or provide height on wrap widget inside dialog.

    On scrollable: false use SingleChildScrollView for dynamic height

    showDialog(
        context: context,
        builder: (c) => AlertDialog(
              scrollable: false,
              content: SingleChildScrollView(
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Flexible(
                      child: Wrap(